/* HBR catalogue chrome only. Native game cards and their inspector are isolated. */
.shell > main > .hero { padding-top:52px; padding-bottom:34px; color:var(--hbr-text); }
.shell > main > .hero > .eyebrow { color:var(--hbr-cyan); letter-spacing:2.6px; }
.shell > main > .hero > .eyebrow::before { background-color:var(--hbr-pink); }
.shell > main > .hero h1 { font-weight:650; letter-spacing:-1.4px; text-shadow:0 3px 16px rgba(0,0,0,.18); }
.shell > main > .hero h1 span { background:none; color:var(--hbr-cyan); }
.shell > main > .hero > p { color:var(--hbr-muted); }
.shell > main > .hero .version { display:inline-block; padding:5px 11px; border:1px solid var(--hbr-border); border-radius:3px; background-color:var(--hbr-surface); color:var(--hbr-muted); }
.shell > .site-header .header-links a { color:var(--hbr-muted); }
.shell > .site-header .header-links a:hover { color:var(--hbr-cyan); }

.section-nav { gap:8px; padding:9px 0; border-color:var(--hbr-border); scrollbar-width:thin; scrollbar-color:var(--hbr-blue) transparent; }
.section-nav a { color:var(--hbr-muted); border:1px solid transparent; border-radius:3px; padding:11px 17px; font-size:12px; }
.section-nav a:hover { color:var(--hbr-text); border-color:var(--hbr-border); background-color:var(--hbr-surface); }
.section-nav a.active { background-color:var(--hbr-paper); color:var(--hbr-ink); border-color:var(--hbr-paper); font-weight:650; box-shadow:0 3px 12px rgba(0,0,0,.15); }
.section-nav a.active::after { height:2px; bottom:-1px; background-color:var(--hbr-blue); }
.section-nav b { color:var(--hbr-cyan); }
.section-nav a.active b { color:var(--hbr-ink); opacity:.65; }

#catalogue { color:var(--hbr-text); }
#catalogue .menu-grid { gap:17px; }
#catalogue .category-card { min-height:285px; padding:27px 25px; background-color:var(--hbr-paper); border-color:rgba(190,207,245,.8); border-radius:4px; color:var(--hbr-ink); box-shadow:0 8px 24px rgba(1,8,25,.18); transition:transform .18s,border-color .18s; }
#catalogue .category-card:hover { border-color:var(--hbr-cyan); transform:translateY(-3px); }
#catalogue .category-card .index { color:var(--hbr-blue); opacity:.82; font-size:39px; }
#catalogue .category-card h2 { color:var(--hbr-ink); font-size:26px; font-weight:650; }
#catalogue .category-card p { color:var(--hbr-ink); opacity:.72; font-size:11px; line-height:1.95; }
#catalogue .category-card .entry-bottom { color:var(--hbr-ink); padding-top:25px; }
#catalogue .category-card .entry-bottom span:last-child { color:var(--hbr-blue); }
#catalogue .section-heading { border-bottom:1px solid var(--hbr-border); margin-bottom:22px; padding-bottom:18px; }
#catalogue .section-heading h2 { color:var(--hbr-text); font-weight:650; }
#catalogue .section-heading p,#catalogue .section-heading > span,#catalogue .results,#catalogue > .muted,#catalogue > .character-note { color:var(--hbr-muted); }
#catalogue .subheading { color:var(--hbr-text); font-weight:600; }
#catalogue .memory-group > .subheading { border-color:var(--hbr-border); color:var(--hbr-cyan); }

#catalogue .toolbar .search,#catalogue .toolbar select { background-color:var(--hbr-paper); color:var(--hbr-ink); border-color:rgba(190,207,245,.7); border-radius:3px; min-height:42px; }
#catalogue .toolbar .search::placeholder { color:#62718b; opacity:1; }
#catalogue .toolbar > span { color:var(--hbr-muted); }
#catalogue .letter-index { border-color:var(--hbr-border); gap:5px; }
#catalogue .letter-button { min-height:31px; background-color:transparent; color:var(--hbr-muted); border:1px solid transparent; }
#catalogue .letter-button:hover { border-color:var(--hbr-border); background-color:var(--hbr-surface); color:var(--hbr-text); }
#catalogue .letter-button[aria-pressed=true] { background-color:var(--hbr-paper); border-color:var(--hbr-paper); color:var(--hbr-ink); font-weight:650; }
#catalogue .small-button,#catalogue .pagination button { background-color:var(--hbr-paper); color:var(--hbr-ink); border-color:rgba(190,207,245,.7); border-radius:3px; }
#catalogue .small-button:hover:not(:disabled),#catalogue .pagination button:hover:not(:disabled) { background-color:#e0edff; border-color:var(--hbr-cyan); }
#catalogue .pagination,#catalogue .back-button { color:var(--hbr-muted); }
#catalogue .back-button:hover { color:var(--hbr-cyan); }

#catalogue .entry-card { background-color:var(--hbr-surface); color:var(--hbr-text); border-color:var(--hbr-border); border-radius:4px; box-shadow:0 6px 20px rgba(2,9,26,.13); }
#catalogue .entry-card > h3 { color:var(--hbr-text); font-weight:650; }
#catalogue .entry-card > .english,#catalogue .entry-card > .muted,#catalogue .entry-card .character-note,#catalogue .entry-card .preview-context,#catalogue .entry-card .short-loop { color:var(--hbr-muted); }
#catalogue .entry-card > .description { color:var(--hbr-text); }
#catalogue .entry-card .tag { background-color:rgba(153,177,229,.18); color:var(--hbr-text); border:1px solid var(--hbr-border); border-radius:3px; }
#catalogue .entry-card .tag.buff { background-color:#d5eff4; color:#204a5e; border-color:#b7dfe8; }
#catalogue .entry-card .tag.debuff { background-color:#f0d8ed; color:#684164; border-color:#dfb9da; }
#catalogue .entry-card .entry-action { color:var(--hbr-cyan); border-top:1px solid var(--hbr-border); margin-top:20px; padding-top:15px; }
#catalogue .entry-card .entry-action:hover { color:var(--hbr-text); }
#catalogue .character-select { background-color:var(--hbr-paper); color:var(--hbr-ink); border:1px solid rgba(190,207,245,.7); border-radius:3px; }
#catalogue .character-select:hover { background-color:#e0edff; border-color:var(--hbr-cyan); }
#catalogue .stat-box,#detail-dialog .stat-box { background-color:var(--hbr-paper); border:1px solid rgba(190,207,245,.7); border-radius:3px; color:var(--hbr-ink); }
#catalogue .stat-box .value,#detail-dialog .stat-box .value { color:var(--hbr-ink); }
#catalogue .stat-box .label,#catalogue .stat-box .hint,#detail-dialog .stat-box .label,#detail-dialog .stat-box .hint { color:#596b87; }
#catalogue .relic-list summary { color:var(--hbr-cyan); font-size:12px; }
#catalogue .relic-list p { color:var(--hbr-muted); }
#catalogue .starter-deck > span { background-color:var(--hbr-paper); border-color:rgba(190,207,245,.7); color:var(--hbr-ink); }
#catalogue .callout { background-color:var(--hbr-surface); border-color:var(--hbr-border); color:var(--hbr-muted); }
#catalogue .empty { border-color:var(--hbr-border); background-color:var(--hbr-surface); color:var(--hbr-muted); }
#catalogue .loading,#catalogue .error { color:var(--hbr-muted); }
#catalogue .error a { color:var(--hbr-cyan); }

#catalogue .simulator { background-color:var(--hbr-surface); border-color:var(--hbr-border); color:var(--hbr-text); border-radius:4px; }
#catalogue .simulator > summary { color:var(--hbr-text); }
#catalogue .simulator .intro,#catalogue .simulator .note { color:var(--hbr-muted); }
#catalogue .simulator .slider-title { color:var(--hbr-muted); }
#catalogue .simulator .slider-title output { color:var(--hbr-cyan); }
#catalogue .simulator input[type=range],#catalogue .simulator input[type=checkbox] { accent-color:var(--hbr-blue); }
#catalogue .simulator .slider-number,#catalogue .simulator .select-row select,#catalogue .simulator .extra-settings input[type=number] { background-color:var(--hbr-paper); color:var(--hbr-ink); border-color:rgba(190,207,245,.7); }
#catalogue .simulator .select-row { color:var(--hbr-text); }
#catalogue .simulator .extra-settings { border-color:var(--hbr-border); }
#catalogue .simulator .small-button { background-color:var(--hbr-paper); border-color:rgba(190,207,245,.7); color:var(--hbr-ink); }

#detail-dialog { background-color:var(--hbr-surface); color:var(--hbr-text); border-color:var(--hbr-border); border-radius:5px; box-shadow:0 14px 60px rgba(0,0,0,.35); }
#detail-dialog::backdrop { background-color:rgba(4,9,24,.78); backdrop-filter:blur(5px); }
#detail-dialog .dialog-head { border-color:var(--hbr-border); }
#detail-dialog .dialog-head h2 { color:var(--hbr-text); font-weight:650; }
#detail-dialog .dialog-head .eyebrow { color:var(--hbr-cyan); }
#detail-close { background-color:transparent; color:var(--hbr-text); }
#detail-dialog .description,#detail-dialog .info-list,#detail-dialog .subheading { color:var(--hbr-text); }
#detail-dialog .character-note,#detail-dialog .muted { color:var(--hbr-muted); }
#detail-dialog .loop-note { background-color:rgba(121,156,216,.12); color:var(--hbr-text); border-left-color:var(--hbr-cyan); }
#detail-dialog .detail-table th { color:var(--hbr-muted); border-color:var(--hbr-border); }
#detail-dialog .detail-table td { color:var(--hbr-text); border-color:var(--hbr-border); }
#detail-dialog .detail-table tbody tr:nth-child(even) { background-color:rgba(139,169,231,.07); }

.shell > footer { color:var(--hbr-muted); border-color:var(--hbr-border); }
.shell > footer strong { color:var(--hbr-text); }
.shell > footer a:hover { color:var(--hbr-cyan); }
.section-nav a:focus-visible,#catalogue .category-card:focus-visible,#catalogue .small-button:focus-visible,#catalogue .character-select:focus-visible,#catalogue .entry-action:focus-visible,#catalogue .letter-button:focus-visible,#catalogue .toolbar input:focus-visible,#catalogue .toolbar select:focus-visible,#catalogue .simulator input:focus-visible,#catalogue .simulator select:focus-visible,#catalogue .simulator summary:focus-visible,#detail-close:focus-visible { outline:2px solid var(--hbr-cyan); outline-offset:4px; }

@supports (backdrop-filter:blur(8px)) { #catalogue .entry-card,#catalogue .simulator,#detail-dialog { backdrop-filter:blur(8px); } }
@media(max-width:800px) { .section-nav { gap:5px; } .section-nav a { padding:10px 13px; } }
@media(max-width:560px) {
  .shell > main > .hero { padding-top:33px; padding-bottom:27px; }
  .shell > main > .hero h1 { letter-spacing:-.8px; }
  .section-nav a { font-size:10px; padding:9px 12px; }
  #catalogue .category-card { min-height:220px; padding:22px; }
  #catalogue .category-card h2 { font-size:24px; }
  #catalogue .section-heading { margin-bottom:18px; }
  #catalogue .toolbar .search,#catalogue .toolbar select { font-size:16px; }
  #catalogue .simulator .slider-number,#catalogue .simulator .select-row select,#catalogue .simulator .extra-settings input[type=number] { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { #catalogue .category-card { transition:none; } #catalogue .category-card:hover { transform:none; } }