.catalog-layout { padding-top: 30px; }
.catalog-showcase { position: relative; min-height: 210px; margin-bottom: 18px; padding: 34px 38px; overflow: hidden; border-radius: 12px; background: linear-gradient(110deg,#17252b 0%,#243a40 58%,#314b50 100%); color: #fff; }
.catalog-showcase::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 67% 20%,rgba(205,227,222,.16),transparent 30%),linear-gradient(90deg,transparent 45%,rgba(255,255,255,.035)); pointer-events: none; }
.catalog-showcase-copy { position: relative; z-index: 2; align-self: center; }
.catalog-showcase .catalog-eyebrow { color: #9cc5c5; }
.catalog-showcase h1 { color: #fff; font-size: 32px; font-weight: 600; letter-spacing: -.03em; }
.catalog-showcase .catalog-description { color: #c6d3d4; font-size: 14px; }
.catalog-showcase-meta { display: flex; align-items: baseline; gap: 9px; margin-top: 27px; color: #aebfc1; font-size: 12px; }
.catalog-showcase-meta strong { color: #fff; font: 500 28px/1 Georgia,serif; }
.catalog-showcase-meta i { width: 1px; height: 12px; margin: 0 5px; background: rgba(255,255,255,.22); }
.catalog-showcase-art { position: absolute; z-index: 1; right: 32px; bottom: -62px; width: 410px; height: 250px; }
.catalog-showcase-art::after { content: ''; position: absolute; left: 0; right: 0; bottom: 42px; height: 22px; background: rgba(8,15,18,.35); filter: blur(16px); border-radius: 50%; }
.catalog-showcase-art img { position: absolute; bottom: 0; width: 142px; height: 224px; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(5,12,15,.38)); }
.catalog-showcase-art img:nth-child(1) { left: 20px; transform: rotate(-7deg) translateY(13px); opacity: .82; }
.catalog-showcase-art img:nth-child(2) { left: 130px; z-index: 2; width: 158px; height: 244px; }
.catalog-showcase-art img:nth-child(3) { right: 0; transform: rotate(7deg) translateY(16px); opacity: .8; }

.catalog-layout .collection-entries { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 46px; }
.catalog-layout .collection-entry { position: relative; isolation: isolate; display: flex; flex-direction: row; align-items: flex-end; gap: 12px; min-height: 126px; padding: 16px; overflow: hidden; border: 1px solid #e5e9ea; border-radius: 8px; background: #222; color: #fff; text-decoration: none; cursor: pointer; }
.catalog-layout .collection-entry::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg,rgba(13,19,22,.05) 5%,rgba(13,19,22,.9) 100%); }
.catalog-layout .collection-entry::after { content: ''; position: absolute; inset: 0; z-index: -2; background: #26353a; }
.catalog-layout .collection-entry > img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; filter: saturate(.7); transition: transform .25s ease,filter .25s ease; }
.catalog-layout .collection-entry:hover { border-color: #a7b9bb; background: #222; }
.catalog-layout .collection-entry:hover > img { transform: scale(1.04); filter: saturate(.92); }
.catalog-layout .collection-entry.is-active { border-color: #d87479; box-shadow: inset 0 -2px #d87479; }
.collection-copy { display: grid; gap: 2px; min-width: 0; }
.collection-copy small { color: #b9cacb; font-size: 9px; letter-spacing: .14em; }
.collection-copy strong { color: #fff; font-size: 15px; font-weight: 600; }
.collection-copy em { color: #c0cbcc; font-size: 11px; font-style: normal; }
.catalog-layout .collection-arrow { align-self: flex-end; color: rgba(255,255,255,.8); font-size: 16px; }

.catalog-layout .hero-library-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 15px; }
.hero-library-heading > div > p { margin: 0 0 5px; color: #799196; font-size: 9px; font-weight: 600; letter-spacing: .16em; }
.catalog-layout .hero-library-heading h2 { font-size: 22px; }
.catalog-layout .hero-library-heading h2 span { display: inline-grid; place-items: center; min-width: 24px; height: 20px; margin-left: 8px; padding: 0 6px; border-radius: 10px; background: #eef2f2; color: #718287; font-size: 11px; }
.hero-library-heading > span { color: #9aa3a6; font-size: 11px; }
.catalog-layout .catalog-toolbar { gap: 8px; padding: 12px; border: 0; border-radius: 8px; background: #f5f7f7; }
.catalog-layout .catalog-toolbar input,.catalog-layout .catalog-toolbar select { border-color: #e1e6e7; background: rgba(255,255,255,.92); }
.catalog-layout .catalog-toolbar button { border: 0; background: transparent; color: #76878b; }
.catalog-layout .catalog-status { margin-top: 18px; }
.catalog-layout .catalog-art { background: #f4f5f5; border-radius: 8px; }
.catalog-layout .catalog-card.is-ssr-foil .catalog-art{position:relative;isolation:isolate;overflow:hidden}
.catalog-layout .catalog-card.is-ssr-foil .catalog-art::before,.catalog-layout .catalog-card.is-ssr-foil .catalog-art::after{content:"";position:absolute;z-index:1;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:screen}
.catalog-layout .catalog-card.is-ssr-foil .catalog-art::before{background-image:linear-gradient(125deg,rgba(255,110,185,.07),rgba(255,226,119,.045) 28%,rgba(105,230,221,.055) 58%,rgba(145,135,255,.075)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 220'%3E%3Cdefs%3E%3ClinearGradient id='a'%3E%3Cstop stop-color='%23ff9ae5'/%3E%3Cstop offset='.48' stop-color='white'/%3E%3Cstop offset='1' stop-color='%2393eaff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23a)' stroke='white' stroke-width='.7' d='M31 29l1.1 3.9L36 34l-3.9 1.1L31 39l-1.1-3.9L26 34l3.9-1.1zM106 91l.9 3.1L110 95l-3.1.9L106 99l-.9-3.1L102 95l3.1-.9zM52 164l1 3.5 3.5 1-3.5 1L52 173l-1-3.5-3.5-1 3.5-1z'/%3E%3C/svg%3E");background-size:100% 100%;animation:bd-ssr-sparkle-a 6.8s ease-in-out infinite}
.catalog-layout .catalog-card.is-ssr-foil .catalog-art::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 220'%3E%3Cdefs%3E%3ClinearGradient id='b'%3E%3Cstop stop-color='%23bca5ff'/%3E%3Cstop offset='.5' stop-color='white'/%3E%3Cstop offset='1' stop-color='%23a9ffd9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23b)' stroke='white' stroke-width='.7' d='M92 21l1 3.5 3.5 1-3.5 1L92 30l-1-3.5-3.5-1 3.5-1zM22 114l.9 3.1 3.1.9-3.1.9L22 122l-.9-3.1-3.1-.9 3.1-.9zM116 183l1.1 3.9 3.9 1.1-3.9 1.1L116 193l-1.1-3.9-3.9-1.1 3.9-1.1z'/%3E%3C/svg%3E");background-size:100% 100%;filter:drop-shadow(0 0 2px rgba(255,255,255,.95));animation:bd-ssr-sparkle-b 6.8s ease-in-out infinite}
@keyframes bd-ssr-sparkle-a{0%,8%,49%,100%{opacity:.62}18%,43%{opacity:1}}
@keyframes bd-ssr-sparkle-b{0%,39%,84%,100%{opacity:.28}52%,79%{opacity:1}}
@media(prefers-reduced-motion:reduce){.catalog-layout .catalog-card.is-ssr-foil .catalog-art::before,.catalog-layout .catalog-card.is-ssr-foil .catalog-art::after{animation:none;opacity:.3}}
.catalog-layout .catalog-card:hover .catalog-art { background: #eaeeee; }

/* Support card thumbnails retain the landscape card frame in both catalog entry points. */
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail[data-catalog-key="catalog_7d76498e4b094e88bbe587f2a3d465ab"] .catalog-detail-switch-list button{flex:0 0 144px}
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail[data-catalog-key="catalog_7d76498e4b094e88bbe587f2a3d465ab"] .catalog-detail-switch-list img{width:auto;height:81px;aspect-ratio:16/9;object-fit:contain}

@media(max-width:900px) {
  .catalog-showcase-art { right: -20px; opacity: .72; }
  .catalog-layout .collection-entries { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .catalog-detail-backdrop.is-bangdream-card-detail .bd-card-open-image { width:fit-content; max-width:100%; margin-inline:auto; }
  .catalog-layout { padding-top: 18px; }
  .catalog-showcase { min-height: 184px; padding: 26px 22px; }
  .catalog-showcase h1 { font-size: 27px; }
  .catalog-showcase-art { right: -82px; bottom: -74px; transform: scale(.78); transform-origin: center bottom; opacity: .5; }
  .catalog-showcase-meta { margin-top: 20px; }
  .catalog-layout .collection-entries { gap: 8px; margin-bottom: 32px; }
  .catalog-layout .collection-entry { min-height: 104px; flex-direction: row; align-items: flex-end; padding: 12px; }
  .collection-copy strong { font-size: 13px; }
  .collection-copy em { display: none; }
  .catalog-layout .hero-library-heading { align-items: flex-start; }
  .hero-library-heading > span { display: none; }
  .catalog-layout .catalog-toolbar { padding: 9px; }
}

/* Generic catalog detail: a separately scoped copy of the Arcana card modal UI. */
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) { align-items:center; padding:24px; background:rgba(17,27,31,.5); backdrop-filter:blur(12px) saturate(1.2); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-stage { position:relative; z-index:0; isolation:isolate; width:min(980px,100%); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-stage::before { content:""; position:absolute; z-index:-1; inset:-18px -20px -20px; border:.5px solid rgba(255,255,255,.22); border-radius:18px; background:rgba(242,248,249,.28); box-shadow:0 18px 52px rgba(8,18,24,.22); backdrop-filter:blur(14px) saturate(1.25); pointer-events:none; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-body { position:relative; z-index:1; display:flex; min-height:0; flex-direction:column; margin:0 -10px -12px; padding:10px; border:.5px solid rgba(255,255,255,.22); border-radius:6px; background:rgba(255,255,255,.9); box-shadow:0 18px 52px rgba(8,18,24,.22); backdrop-filter:blur(18px) saturate(1.15) brightness(1.2); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-dialog { width:min(980px,100%); padding:14px; border:0; border-radius:8px; background:#fff; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-content { grid-template-columns:minmax(220px,34%) minmax(0,1fr); gap:28px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-image { aspect-ratio:3/5; box-shadow:0 0 18px rgba(16,27,32,.22); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-copy { padding-top:8px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-kicker { margin:0 0 8px; color:#557b70; font-size:11px; font-weight:700; letter-spacing:.12em; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-copy h2 { margin:0 0 10px; color:#172126; font-size:30px; font-weight:600; line-height:1.2; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-summary { margin:4px 0 10px; padding-bottom:10px; border-bottom:1px solid #e8eded; color:#3d4d52; font-size:14px; line-height:1.7; white-space:pre-wrap; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-fields { display:grid; grid-template-columns:1fr; gap:0; margin:0; border-top:1px solid #e8eded; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-fields>div { display:grid; grid-template-columns:90px minmax(0,1fr); gap:12px; padding:11px 0; border-bottom:1px solid #e8eded; font-size:14px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-fields dt { color:#718087; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-fields dd { line-height:1.65; overflow-wrap:anywhere; white-space:pre-wrap; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-nested { margin-top:18px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-nested h3 { margin:0 0 8px; color:#405851; font-size:14px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-nested details { border-top:1px solid #e8eded; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-nested summary { padding:10px 0; color:#52676a; cursor:pointer; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-nested pre { max-height:280px; overflow:auto; padding:12px; border-radius:6px; background:#f3f5f7; color:#29393e; white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:900px) {
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) { align-items:center; padding:16px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-stage { width:min(980px,100%); max-height:calc(100dvh - 32px); }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-dialog { width:100%; max-height:calc(100dvh - 52px); padding:14px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-content { grid-template-columns:minmax(140px,30%) minmax(0,1fr); gap:18px; }
}
@media(max-width:600px) {
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) { align-items:center; padding:16px 14px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-stage { width:100%; max-height:calc(100dvh - 32px); }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-stage::before { display:none; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-body { margin:0; padding:0; border:0; background:transparent; box-shadow:none; backdrop-filter:none; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-dialog { height:calc(100dvh - 64px); max-height:calc(100dvh - 64px); overflow:auto; padding:20px 14px; border:0; border-radius:0 0 6px 6px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-close { position:fixed; z-index:170; top:24px; right:18px; width:38px; height:38px; border:1px solid #c9d3d6; border-radius:6px; background:#f7f8f8; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-content { display:flex; flex-direction:column; gap:12px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-media { position:relative; width:calc(100% + 28px); min-height:min(63vw,217px); margin:0 -14px; overflow:hidden; touch-action:pan-y; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-card-surface { display:contents; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-image { position:relative; z-index:2; display:block; width:min(38vw,130px); margin:0 auto; border-radius:8px; box-shadow:0 0 22px rgba(16,27,32,.36); }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-copy { width:100%; padding-top:0; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-copy h2 { font-size:24px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-summary { margin-bottom:6px; padding-bottom:8px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-summary p { font-size:13px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-fields>div { grid-template-columns:76px minmax(0,1fr); gap:10px; padding:9px 0; font-size:13px; }
}
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-tools { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 -12px 10px; padding:10px 12px; border:1px solid rgba(255,255,255,.76); border-radius:10px; background:rgba(255,255,255,.76); box-shadow:0 8px 26px rgba(8,18,24,.12); backdrop-filter:blur(12px) saturate(1.15); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-search { flex:1 1 auto; min-width:0; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-search input,
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-filter select { box-sizing:border-box; width:100%; height:40px; padding:0 12px; border:1px solid #dce3e5; border-radius:7px; background:#f7f8f8; color:#29393e; font:inherit; font-size:14px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-filter { flex:0 0 180px; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-stage::before,
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-body,
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-tools,
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-search input,
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select { border-radius:8px; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-stage::before { top:-8px; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-search { flex:0 1 420px; margin-left:auto; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter { flex:0 0 150px; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter { position:relative; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter::after { content:""; position:absolute; right:14px; top:50%; width:8px; height:8px; border-right:2px solid #53666b; border-bottom:2px solid #53666b; transform:translateY(-70%) rotate(45deg); pointer-events:none; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select { appearance:none; -webkit-appearance:none; padding:0 34px 0 14px; border:1px solid #d6dfe0; background:#f8faf9; color:#304247; cursor:pointer; transition:border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select:hover { border-color:#aabfba; background:#fff; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select:focus-visible { outline:0; border-color:#5d8a7d; box-shadow:0 0 0 3px rgba(93,138,125,.2); }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-tools { position:relative; z-index:1; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-tools:has(.generic-detail-filter.is-open) { z-index:3; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter.is-open { z-index:3; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select[hidden],.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu[hidden] { display:none; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-trigger { box-sizing:border-box; display:block; width:100%; height:40px; padding:0 34px 0 14px; overflow:hidden; border:1px solid #d6dfe0; border-radius:8px; background:#f8faf9; color:#304247; font:inherit; font-size:14px; text-align:left; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-trigger:hover { border-color:#aabfba; background:#fff; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-trigger:focus-visible { outline:0; border-color:#5d8a7d; box-shadow:0 0 0 3px rgba(93,138,125,.2); }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu { position:absolute; top:calc(100% + 5px); left:0; z-index:5; box-sizing:border-box; width:100%; max-height:min(260px,45dvh); overflow-y:auto; padding:5px; border:1px solid #d8e2e0; border-radius:8px; background:#fff; box-shadow:0 10px 28px rgba(25,43,46,.18); }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu button { display:block; width:100%; min-height:34px; padding:6px 9px; border:0; border-radius:5px; background:transparent; color:#304247; font:inherit; font-size:13px; text-align:left; cursor:pointer; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu button:hover,.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu button:focus-visible { outline:0; background:#edf3f1; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu button.is-selected { background:#e6f0ec; color:#315e51; font-weight:650; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-menu button.is-selected::after { content:'✓'; float:right; }
.catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-dialog.is-empty .catalog-detail-content { display:flex; height:100%; min-height:0; align-items:center; justify-content:center; }
.catalog-detail-backdrop.is-bangdream-card-detail .bd-card-section h3::before { content:""; display:inline-block; width:8px; height:8px; margin:0 11px 2px 2px; transform:rotate(45deg); border-radius:1px; background:#688b80; }
.catalog-detail-backdrop.is-bangdream-card-detail .bd-skill-name::before { content:"·"; }
.catalog-detail-backdrop.is-bangdream-card-detail .bd-card-open-image { display:block; width:100%; padding:0; border:0; background:transparent; cursor:zoom-in; }
.catalog-detail-backdrop.is-bangdream-card-detail .bd-card-open-image:focus-visible { outline:2px solid #557b70; outline-offset:3px; border-radius:8px; }
.bd-card-image-viewer { box-sizing:border-box; position:fixed; inset:0; width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; padding:20px; border:0; background:rgba(8,12,19,.94); }
.bd-card-image-viewer[open] { display:grid; place-items:center; }
.bd-card-image-viewer::backdrop { background:rgba(8,12,19,.92); }
.bd-card-image-viewport { display:grid; width:100%; height:100%; place-items:center; overflow:hidden; touch-action:none; user-select:none; cursor:zoom-in; }
.bd-card-image-viewport.is-zoomed { cursor:grab; }
.bd-card-image-viewport.is-zoomed.is-dragging { cursor:grabbing; }
.bd-card-image-viewer img { display:block; max-width:100%; max-height:calc(100dvh - 40px); width:auto; height:auto; object-fit:contain; pointer-events:none; user-select:none; -webkit-user-drag:none; will-change:transform; }
.bd-card-image-viewer-close { position:fixed; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); z-index:1; display:grid; place-items:center; box-sizing:border-box; width:36px; height:36px; padding:0; border:1px solid rgba(255,255,255,.5); border-radius:6px; background:rgba(17,27,31,.7); color:#fff; font:300 24px/1 sans-serif; cursor:pointer; }
.bd-card-image-viewer-download { position:fixed; top:max(12px,env(safe-area-inset-top)); right:calc(max(12px,env(safe-area-inset-right)) + 44px); z-index:1; display:grid; box-sizing:border-box; width:36px; height:36px; place-items:center; padding:0; border:1px solid rgba(255,255,255,.5); border-radius:6px; background:rgba(17,27,31,.7); color:#fff; cursor:pointer; }
.bd-card-image-viewer-download svg { width:18px; height:18px; }
.bd-card-image-viewer-download:disabled { opacity:.5;cursor:wait; }
.bd-card-image-viewer-download:focus-visible { outline:2px solid #fff;outline-offset:3px; }
.bd-card-image-viewer-close:focus-visible { outline:2px solid #fff; outline-offset:3px; }
@media(max-width:1050px) and (min-width:601px) {
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter { flex-basis:140px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-search { flex:1 1 240px; }
}
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switcher { display:flex; align-items:center; gap:8px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switcher[hidden] { display:none; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switch-arrow { flex:0 0 36px; width:36px; height:44px; display:grid; place-items:center; padding:0; border:0; background:transparent; color:#49665f; font-size:28px; cursor:pointer; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switch-arrow:disabled { opacity:.35; cursor:default; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switch-list { flex:1 1 auto; width:0; padding:14px 0 12px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switch-list button { flex-basis:68px; }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switch-list button.is-active { position:relative; z-index:1; transform:scale(1.06); }
.catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-desktop-count { position:absolute; right:14px; bottom:12px; display:block; padding:3px 6px; border-radius:4px; background:#f2f5f5; color:#6e8185; font-size:11px; line-height:1.2; }
@media(max-width:600px) {
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail).is-bangdream-card-detail .catalog-detail-desktop-count { display:none; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail).is-bangdream-card-detail .bd-card-title-row #catalog-detail-title { margin:0; font-size:22px; font-weight:700; line-height:1.2; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-tools { margin:0 0 8px; padding:8px; border-radius:8px; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-search input,
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-filter select { height:38px; padding:0 8px; border-radius:6px; font-size:13px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select { border-radius:8px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter select { padding-right:28px; padding-left:10px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter-trigger { height:38px; padding:0 28px 0 10px; font-size:13px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter::after { right:11px; width:7px; height:7px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-tools { flex-wrap:wrap; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-search { flex:1 1 100%; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .generic-detail-filter { flex:0 0 112px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter { flex:1 1 112px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-tools { display:grid; grid-template-columns:minmax(0,1fr) minmax(104px,28%) 38px; gap:8px; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-search { grid-column:1; grid-row:1; margin:0; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter[data-filter-key="quality"] { grid-column:2; grid-row:1; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter[data-filter-key="character"],
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .generic-detail-filter[data-filter-key="band"] { display:none; }
  .catalog-detail-backdrop.is-generic-detail.is-bangdream-card-detail .catalog-detail-close { right:22px; }
  .catalog-detail-backdrop.is-bangdream-card-detail .bd-skill-heading h4 { flex:1 1 0; min-width:0; }
  .catalog-detail-backdrop.is-bangdream-card-detail .bd-skill-name { display:block; margin-top:3px; overflow-wrap:anywhere; }
  .catalog-detail-backdrop.is-bangdream-card-detail .bd-skill-name::before { content:none; }
  .catalog-detail-backdrop.is-generic-detail:not(.is-independent-detail) .catalog-detail-switcher { display:none; }
}
@media(prefers-reduced-motion:reduce) { .catalog-layout .collection-entry > img { transition: none; } }

/* Desktop catalog workspace: compact collection rail beside the active archive. */
@media(min-width:901px) {
  .catalog-layout {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    align-items: start;
    column-gap: 32px;
    padding-top: 30px;
  }
  .catalog-layout > .catalog-heading {
    grid-column: 1 / -1;
  }
  .catalog-layout > .collection-entries {
    position: sticky;
    top: 84px;
    grid-column: 1;
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 0;
    padding: 6px;
    border: 1px solid #e8edef;
    border-radius: 16px;
    background: #f7f9f9;
  }
  .catalog-layout > .collection-entries .collection-entry {
    min-height: 78px;
    padding: 10px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #273137;
    box-shadow: none;
  }
  .catalog-layout > .collection-entries .collection-entry::before,
  .catalog-layout > .collection-entries .collection-entry::after { display: none; }
  .catalog-layout > .collection-entries .collection-entry > img {
    position: static;
    inset: auto;
    z-index: auto;
    filter: none;
  }
  .catalog-layout > .collection-entries .collection-entry:hover {
    background: #fff;
  }
  .catalog-layout > .collection-entries .collection-entry.is-active {
    background: #fff;
    color: #172126;
    box-shadow: 0 6px 18px #17212c10, inset 3px 0 #d94a50;
  }
  .catalog-layout > #catalog-heroes-panel,
  .catalog-layout > #catalog-other-panel {
    grid-column: 2;
    min-width: 0;
  }
}

.catalog-layout .collection-entry > img { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 9px; object-fit: cover; opacity: .86; }
.catalog-layout .collection-copy { min-width: 0; display: flex; flex-direction: column; gap: 5px; text-align: left; }
.catalog-layout .collection-copy strong { color: #273137; font-size: 14px; font-weight: 650; }
.catalog-layout .collection-copy em { color: #7c8a90; font-size: 11px; font-style: normal; white-space: nowrap; }
.catalog-layout .collection-entry.is-active .collection-copy strong { color: #172126; }
.catalog-layout .collection-entry.is-active .collection-copy em { color: #66777d; }
.catalog-layout .collection-arrow { margin-left: auto; color: #8ea0a4; font-size: 20px; font-weight: 300; }
.catalog-layout .collection-entry.is-active .collection-arrow { color: #d94a50; }
.catalog-subtoolbar { min-height: 66px; display: flex; align-items: center; gap: 18px; padding: 10px 14px 14px; border-bottom: 1px solid #e5eaec; }
.catalog-subtoolbar > span { display: flex; flex-direction: column; gap: 4px; }
.catalog-subtoolbar strong { font-size: 18px; }
.catalog-subtoolbar small { color: #89969b; font-size: 11px; }
.catalog-subtoolbar input { width: min(420px, 56%); min-height: 42px; margin-left: auto; padding: 0 14px; border: 1px solid #e0e6e8; border-radius: 8px; background: #f8f9fa; font: inherit; }
.catalog-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 24px; }
.catalog-resource-card { display: flex; align-items: center; gap: 14px; min-height: 90px; padding: 12px; border: 1px solid #e8edef; border-radius: 12px; background: #fff; color: #273137; text-align: left; transition: border-color .18s, transform .18s, box-shadow .18s; }
.catalog-resource-card:hover { transform: translateY(-2px); border-color: #bdcccf; box-shadow: 0 10px 24px #17212c0c; }
.resource-thumb { width: 62px; height: 62px; flex: 0 0 62px; overflow: hidden; border-radius: 9px; background: #edf1f2; }
.resource-thumb img { width: 100%; height: 100%; object-fit: cover; }
.catalog-resource-card > span:nth-child(2) { display: flex; flex-direction: column; gap: 7px; }
.catalog-resource-card strong { font-size: 14px; }
.catalog-resource-card small { color: #89969b; font-size: 11px; }
.catalog-resource-card i { margin-left: auto; color: #9ba8ac; font-size: 20px; font-style: normal; }
.catalog-resource-card:is(button) { width: 100%; font: inherit; cursor: pointer; }
.catalog-resource-card:is(button):focus-visible { outline: 2px solid #557b70; outline-offset: 3px; }
.catalog-card-toolbar select { min-width: 128px; }
.catalog-card-toolbar [data-card-reset] { min-width: 52px; }
.catalog-card-toolbar input { flex: 1 1 240px; width: auto; max-width: calc(100% - 387px); margin-left: auto; }
.catalog-layout .catalog-toolbar .catalog-filter-select { position: relative; display: block; flex: 0 0 100px; min-width: 0; }
.catalog-layout .catalog-toolbar .catalog-native-select { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.catalog-layout .catalog-toolbar .catalog-filter-trigger { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 13px; border: 1px solid #dce3e5; border-radius: 8px; background: #fff; color: #263137; box-shadow: 0 1px 3px rgba(23,33,44,.04); font: inherit; font-size: 13px; white-space: nowrap; cursor: pointer; }
.catalog-layout .catalog-toolbar .catalog-filter-trigger:hover { border-color: #b9c7c9; background: #fbfcfc; }
.catalog-layout .catalog-toolbar .catalog-filter-trigger:focus-visible,
.catalog-layout .catalog-toolbar .catalog-filter-select.is-open .catalog-filter-trigger { border-color: #6f9290; outline: 0; box-shadow: 0 0 0 3px rgba(74,105,109,.11); }
.catalog-layout .catalog-toolbar .catalog-filter-chevron { width: 7px; height: 7px; flex: 0 0 7px; margin: -4px 1px 0 0; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .16s ease,margin .16s ease; }
.catalog-layout .catalog-toolbar .catalog-filter-select.is-open .catalog-filter-chevron { margin-top: 4px; transform: rotate(225deg); }
.catalog-layout .catalog-toolbar .catalog-filter-menu { position: absolute; z-index: 180; top: calc(100% + 7px); left: 0; width: max-content; min-width: 100%; max-width: min(240px, calc(100vw - 32px)); max-height: min(320px, 50vh); overflow-y: auto; display: grid; gap: 3px; padding: 6px; border: 1px solid #dfe6e6; border-radius: 10px; background: rgba(255,255,255,.98); box-shadow: 0 16px 36px rgba(24,39,43,.16); backdrop-filter: blur(10px); }
.catalog-layout .catalog-toolbar .catalog-filter-menu[hidden] { display: none; }
.catalog-layout .catalog-toolbar .catalog-filter-option { position: relative; width: 100%; min-height: 34px; padding: 7px 30px 7px 10px; border: 0; border-radius: 6px; background: transparent; color: #34464b; font: inherit; font-size: 13px; text-align: left; white-space: normal; overflow-wrap: anywhere; cursor: pointer; }
.catalog-layout .catalog-toolbar .catalog-filter-option:hover,
.catalog-layout .catalog-toolbar .catalog-filter-option:focus-visible { background: #f1f5f4; outline: 0; }
.catalog-layout .catalog-toolbar .catalog-filter-option.is-selected { background: #e8f0ee; color: #285e55; font-weight: 650; }
.catalog-layout .catalog-toolbar .catalog-filter-option.is-selected::after { content: '✓'; position: absolute; right: 10px; color: #4f7770; }
.catalog-card-toolbar .catalog-filter-select { flex-basis: 100px; }
.catalog-layout .catalog-generic-toolbar { justify-content: space-between; }
.catalog-layout .catalog-generic-toolbar .catalog-filter-select { flex: 0 0 128px; }
.catalog-layout .catalog-generic-toolbar [data-generic-reset] { flex: 0 0 auto; min-width: 52px; }
.catalog-layout .catalog-generic-toolbar input { flex: 0 1 400px; width: 400px; max-width: 400px; min-width: 0; margin-left: auto; }
.catalog-layout .catalog-generic-grid .catalog-card-info { min-width:0; }
.catalog-layout .catalog-generic-grid.is-landscape-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.catalog-layout .catalog-generic-card.is-landscape-card .catalog-art { aspect-ratio: 5 / 3; }
.catalog-layout .catalog-generic-grid .catalog-card-info h2 { display:block; width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.catalog-layout .catalog-generic-grid > .catalog-check-empty { grid-column: 1 / -1; justify-self: center; width: 100%; min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.catalog-layout .catalog-generic-grid > .catalog-check-empty img { width: 52px; height: 52px; object-fit: contain; }
.catalog-layout .catalog-generic-grid > .catalog-check-empty strong,.catalog-layout .catalog-generic-grid > .catalog-check-empty small { display: block; width: auto; max-width: min(440px, 100%); white-space: normal; overflow-wrap: anywhere; }
.catalog-card-grid .catalog-card-entry { width: 100%; padding: 0; color: inherit; font: inherit; text-align: inherit; cursor: pointer; }
.catalog-card-grid .catalog-card-entry .catalog-art { height: auto; aspect-ratio: 3 / 5; padding: 0; overflow: hidden; }
.catalog-card-grid .catalog-card-entry .catalog-art img { width: 100%; height: 100%; object-fit: cover; }
.catalog-card-grid .catalog-card-entry:focus-visible { outline: 2px solid #557b70; outline-offset: 3px; }
.catalog-layout .catalog-grid.is-square .catalog-art,
.catalog-card-grid .catalog-card-entry.is-square .catalog-art { height: auto; aspect-ratio: 1 / 1; padding: 0; overflow: hidden; }
.catalog-layout .catalog-grid.is-square .catalog-art img,
.catalog-card-grid .catalog-card-entry.is-square .catalog-art img { width: 100%; height: 100%; object-fit: cover; }
.catalog-layout .catalog-grid.is-rectangle .catalog-art,
.catalog-card-grid .catalog-card-entry.is-rectangle .catalog-art { height: auto; aspect-ratio: 3 / 5; padding: 0; overflow: hidden; }
.catalog-layout .catalog-grid.is-rectangle .catalog-art img,
.catalog-card-grid .catalog-card-entry.is-rectangle .catalog-art img { width: 100%; height: 100%; object-fit: cover; }
.catalog-detail-open { overflow: hidden; }
.catalog-detail-backdrop { position: fixed; z-index: 160; inset: 0; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(13, 22, 27, .74); backdrop-filter: blur(4px); }
.catalog-detail-backdrop[hidden] { display: none; }
.catalog-detail-stage { display: flex; width: min(740px, 100%); min-width: 0; max-height: calc(100vh - 48px); flex-direction: column; align-items: stretch; }
.catalog-detail-body { display: contents; }
.catalog-detail-desktop-count { display: none; }
.catalog-detail-dialog { position: relative; width: min(740px, 100%); max-height: calc(100vh - 48px); overflow: auto; padding: 24px; border: 1px solid rgba(255,255,255,.7); border-radius: 12px; background: #fff; box-shadow: 0 24px 70px rgba(10, 22, 28, .28); }
.catalog-detail-close { position: absolute; z-index: 1; top: 2px; right: 6px; width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #314247; font: 300 20px/1 sans-serif; cursor: pointer; }
.catalog-detail-content { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 24px; align-items: start; }
.catalog-detail-media { min-width: 0; }
.catalog-detail-image { width: 100%; aspect-ratio: 3 / 5; border-radius: 14px; background: #f2f4f4; object-fit: cover; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-image { box-shadow: 0 0 18px rgba(16,27,32,.22); }
.catalog-detail-mobile-card,
.catalog-detail-mobile-arrow { display: none; }
.catalog-detail-mobile-count { display: none; }
.catalog-detail-copy { min-width: 0; padding-top: 12px; }
.catalog-detail-titlebar { display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding-right: 0; }
.catalog-detail-meta { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 6px; margin-top: 0; }
.catalog-detail-meta span { padding: 3px 8px; border-radius: 4px; background: #edf4f1; color: #426a60; font-size: 13px; font-weight: 600; }
.catalog-detail-copy > small { color: #557b70; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.catalog-detail-copy h2 { margin: 8px 0; color: #172126; font-size: 30px; font-weight: 600; line-height: 1.2; }
.catalog-detail-intro { margin: 12px 0 16px; }
.catalog-detail-intro p { margin: 0; color: #3d4d52; font-size: 14px; line-height: 1.7; }
.catalog-detail-intro .catalog-detail-keywords { margin-top: 2px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-intro { margin-top: 4px; margin-bottom: 8px; padding-bottom: 10px; border-bottom: 1px solid #e8eded; }
.catalog-level-control { margin: 4px 0 18px; padding: 13px 0 15px; border-top: 1px solid #e8eded; border-bottom: 1px solid #e8eded; }
.catalog-level-heading { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin-bottom: 9px; color: #8a989d; font-size: 11px; }
.catalog-level-heading strong { min-width: 54px; color: #365f55; font-size: 13px; text-align: center; }
.catalog-level-heading span:last-child { text-align: right; }
.catalog-level-control input[type="range"] { --level-progress: 0%; width: 100%; height: 18px; margin: 0; border: 0; background: transparent; cursor: pointer; appearance: none; -webkit-appearance: none; }
.catalog-level-control input[type="range"]::-webkit-slider-runnable-track { height: 4px; border-radius: 999px; background: linear-gradient(90deg, #557b70 var(--level-progress), #dce4e3 var(--level-progress)); }
.catalog-level-control input[type="range"]::-webkit-slider-thumb { width: 16px; height: 16px; margin-top: -6px; border: 3px solid #fff; border-radius: 50%; background: #557b70; box-shadow: 0 1px 5px rgba(35,70,61,.28); appearance: none; -webkit-appearance: none; }
.catalog-level-control input[type="range"]::-moz-range-track { height: 4px; border-radius: 999px; background: #dce4e3; }
.catalog-level-control input[type="range"]::-moz-range-progress { height: 4px; border-radius: 999px; background: #557b70; }
.catalog-level-control input[type="range"]::-moz-range-thumb { width: 10px; height: 10px; border: 3px solid #fff; border-radius: 50%; background: #557b70; box-shadow: 0 1px 5px rgba(35,70,61,.28); }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana { margin: 8px 0; padding: 8px 0; border: 0; border-radius: 0; background: transparent; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading { display: flex; align-items: baseline; justify-content: flex-start; gap: 8px; margin-bottom: 10px; color: #60716d; font-size: 16px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading > span { color: #405851; font-size: 16px; font-weight: 600; line-height: 1.4; letter-spacing: .02em; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading strong { min-width: 0; padding: 0; border-radius: 0; background: transparent; color: #315c51; font-size: 16px; line-height: 1.4; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"] { height: 20px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]::-webkit-slider-runnable-track { height: 6px; background: linear-gradient(90deg, #4e7a6e var(--level-progress), #d9e3e0 var(--level-progress)); box-shadow: inset 0 1px 1px rgba(31,64,55,.08); }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]::-webkit-slider-thumb { width: 18px; height: 18px; margin-top: -6px; border-width: 3px; background: #4e7a6e; box-shadow: 0 2px 7px rgba(35,70,61,.3); }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]::-moz-range-track,
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]::-moz-range-progress { height: 6px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; background: #4e7a6e; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]:focus-visible { outline: 0; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 3px solid rgba(78,122,110,.22); outline-offset: 2px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-level-scale { display: flex; justify-content: space-between; margin-top: 2px; color: #93a19d; font-size: 12px; font-style: italic; }
.catalog-detail-copy dl { display: grid; gap: 0; margin: 0; border-top: 1px solid #e8eded; }
.catalog-detail-copy dl > div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid #e8eded; font-size: 13px; }
.catalog-detail-copy dl > .catalog-skill-effect-row { display: block; }
.catalog-detail-copy .catalog-skill-effect-row dt { margin-bottom: 7px; }
.catalog-detail-copy dl > .catalog-upgrade-cost-row { display: block; border-bottom: 0; }
.catalog-detail-copy .catalog-upgrade-cost-row dt { margin-bottom: 7px; }
.catalog-detail-copy dt { color: #849297; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dt { font-size: 15px; }
.catalog-detail-copy dd { margin: 0; color: #29393e; line-height: 1.65; }
@media(min-width:601px) {
  .catalog-detail-backdrop.is-arcanatactics:not([hidden]) { background: rgba(17,27,31,.5); backdrop-filter: blur(12px) saturate(1.2); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade { order: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search { order: 1; }
}
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-tools { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 10px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.76); border-radius: 10px; background: rgba(255,255,255,.76); box-shadow: 0 8px 26px rgba(8,18,24,.12); backdrop-filter: blur(12px) saturate(1.15); }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-search { position: relative; flex: 0 1 320px; min-width: 0; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-search-icon { position: absolute; top: 50%; left: 12px; width: 18px; height: 18px; transform: translateY(-50%); opacity: .52; pointer-events: none; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-search input,
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger { height: 40px; border: 1px solid #dce3e5; border-radius: 7px; background: #f7f8f8; color: #29393e; font: inherit; font-size: 14px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-search input { width: 100%; padding: 0 12px 0 36px; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade { position: relative; flex: 0 0 112px; }
.catalog-detail-grade-options { display: none; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; cursor: pointer; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger i { width: 7px; height: 7px; flex: 0 0 7px; margin-top: -4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu { position: absolute; z-index: 8; top: calc(100% + 5px); right: 0; min-width: 100%; display: grid; gap: 2px; padding: 5px; border: 1px solid #dce3e5; border-radius: 7px; background: #fff; box-shadow: 0 8px 22px rgba(20,35,40,.18); }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu[hidden] { display: none; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button { min-height: 34px; padding: 0 8px; border: 0; border-radius: 4px; background: transparent; color: #29393e; font: inherit; font-size: 13px; text-align: left; white-space: nowrap; cursor: pointer; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button:hover { background: #eef3f1; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button.is-selected { background: #e8f0ee; color: #285e55; font-weight: 650; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button.is-selected::after { content: '✓'; float: right; color: #4f7770; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog.is-empty .catalog-detail-content { display: flex; min-height: 320px; align-items: center; justify-content: center; }
.catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog.is-empty .catalog-detail-desktop-count { display: none; }
.catalog-detail-empty { display: flex; width: 100%; flex-direction: column; align-items: center; justify-content: center; padding: 32px 16px; color: #79908a; text-align: center; }
.catalog-detail-empty svg { width: 64px; height: 64px; margin-bottom: 14px; color: #a5bcb5; }
.catalog-detail-empty h2 { margin: 0 0 7px; color: #354e47; font-size: 20px; font-weight: 650; }
.catalog-detail-empty p { margin: 0; font-size: 14px; }
@media(min-width:601px) {
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage { position: relative; z-index: 0; isolation: isolate; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage::before { content: ''; position: absolute; z-index: -1; inset: -18px -20px -20px; border: .5px solid rgba(255,255,255,.22); border-radius: 18px; background: rgba(242,248,249,.28); box-shadow: 0 18px 52px rgba(8,18,24,.22); backdrop-filter: blur(14px) saturate(1.25); pointer-events: none; }
}
.catalog-detail-backdrop.is-arcanatactics [data-level-effect] { font-size: 15px; }
.catalog-level-effect-value { color: #df4f25; font-weight: 700; }
.catalog-upgrade-cost { display: flex; flex-wrap: wrap; gap: 7px; }
.catalog-upgrade-cost span { padding: 3px 8px; border-radius: 6px; background: #eceff1; color: #4d625d; font-size: 14px; }
.catalog-detail-switcher { position: relative; display: block; flex: 0 0 auto; width: 100%; margin-top: 2px; overflow: visible; }
.catalog-detail-switcher[hidden] { display: none; }
.catalog-detail-switch-arrow { display: none; }
.catalog-detail-switch-list { display: flex; min-width: 0; gap: 12px; overflow-x: auto; padding: 28px 14px 16px; cursor: grab; touch-action: pan-y; user-select: none; overscroll-behavior-x: contain; scroll-behavior: smooth; scrollbar-width: none; scroll-snap-type: x mandatory; }
.catalog-detail-switch-list.is-dragging { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; }
.catalog-detail-switch-list.is-positioning { scroll-behavior: auto; }
.catalog-detail-switch-list::-webkit-scrollbar { display: none; }
.catalog-detail-switch-list button { flex: 0 0 68px; display: block; padding: 0; border: 0; border-radius: 5px; background: transparent; filter: contrast(.52) saturate(.68) brightness(.96); cursor: pointer; scroll-snap-align: center; transition: filter .18s ease, transform .18s ease; }
.catalog-detail-switch-list button:hover { filter: contrast(.82) saturate(.88); }
.catalog-detail-switch-list button.is-active { filter: none; }
.catalog-detail-switch-list img { display: block; width: 68px; height: 106px; border: 0; border-radius: 5px; object-fit: cover; pointer-events: none; -webkit-user-drag: none; box-shadow: 0 5px 16px rgba(7,18,23,.22); }
.catalog-detail-backdrop:is(.is-bangdream-card-detail,.is-arcanatactics) .catalog-detail-switch-list button { display:flex; align-items:center; justify-content:center; overflow:hidden; }
.catalog-detail-backdrop:is(.is-bangdream-card-detail,.is-arcanatactics) .catalog-detail-switch-list img { width:auto; max-width:none; flex-shrink:0; object-fit:contain; }
.catalog-detail-switch-list button.is-active img { animation: catalog-active-card-breathe 2.8s ease-in-out infinite; }
@keyframes catalog-active-card-breathe {
  0%, 100% { box-shadow: 0 0 0 1px #fff, 0 0 7px rgba(255,255,255,.3), 0 7px 20px rgba(7,18,23,.32); }
  50% { box-shadow: 0 0 0 1px #fff, 0 0 12px 2px rgba(255,255,255,.65), 0 8px 24px rgba(7,18,23,.36); }
}
@media(prefers-reduced-motion:reduce) {
  .catalog-detail-switch-list button.is-active img { animation: none; box-shadow: 0 0 0 1px #fff, 0 7px 20px rgba(7,18,23,.32); }
}
.catalog-awakening { margin-top: 20px; }
.catalog-awakening-heading { margin-bottom: 10px; }
.catalog-awakening-heading h3 { margin: 0 0 5px; color: #233438; font-size: 16px; }
.catalog-awakening-heading p { margin: 0; color: #7a898d; font-size: 11px; line-height: 1.6; }
.catalog-awakening-stages { display: grid; gap: 8px; }
.catalog-awakening-stages details { overflow: hidden; border: 1px solid #e2e9e7; border-radius: 8px; background: #fbfcfc; }
.catalog-awakening-stages summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; color: #314a44; cursor: pointer; list-style: none; }
.catalog-awakening-stages summary::-webkit-details-marker { display: none; }
.catalog-awakening-stages summary::after { content: '⌄'; flex: 0 0 auto; color: #789088; transition: transform .18s ease; }
.catalog-awakening-stages details[open] summary::after { transform: rotate(180deg); }
.catalog-awakening-stages summary span { font-size: 13px; font-weight: 600; }
.catalog-awakening-stages summary small { margin-left: auto; color: #87948f; font-size: 11px; }
.catalog-awakening-stages ul { display: grid; gap: 7px; margin: 0; padding: 10px 16px 14px 30px; border-top: 1px solid #e8edeb; color: #52645f; font-size: 12px; line-height: 1.55; }
@media(min-width:901px) {
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-tools { position: relative; z-index: 2; margin: -18px -10px 8px; padding: 10px; border: .5px solid rgba(255,255,255,.22); background: rgba(255,255,255,.6); box-shadow: 0 18px 52px rgba(8,18,24,.16); backdrop-filter: blur(18px) saturate(1.15) brightness(1.2); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade { flex: 0 1 auto; min-width: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger { display: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade-options { display: flex; flex-wrap: wrap; gap: 8px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade-option { flex: 0 0 96px; width: 96px; min-height: 40px; padding: 0 8px; border: 1px solid #dce3e5; border-radius: 6px; background: #f7f8f8; color: #29393e; font: inherit; font-size: 14px; text-align: center; white-space: nowrap; cursor: pointer; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade-option:hover { border-color: #aebfba; background: #eef3f1; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade-option.is-selected { border-color: #5f9b86; background: #cfe7db; color: #1f5747; box-shadow: inset 0 0 0 1px rgba(61,125,101,.26), 0 2px 6px rgba(43,98,76,.14); font-weight: 700; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage { width: min(980px, 100%); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage.is-empty { position: absolute; top: var(--catalog-detail-empty-top, 24px); left: 50%; transform: translateX(-50%); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage::before { display: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-body { position: relative; z-index: 1; display: flex; min-height: 0; flex-direction: column; margin: 0 -10px -12px; padding: 10px 10px 10px; border: .5px solid rgba(255,255,255,.22); background: rgba(255,255,255,.9); box-shadow: 0 18px 52px rgba(8,18,24,.22); backdrop-filter: blur(18px) saturate(1.15) brightness(1.2); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-tools,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-body { border-radius: 6px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-desktop-count { position: absolute; right: 14px; bottom: 12px; display: block; padding: 3px 6px; border-radius: 4px; background: #f2f5f5; color: #6e8185; font-size: 11px; line-height: 1.2; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search input { border-radius: 6px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog { width: min(980px, 100%); padding: 14px; border-radius: 8px; background: #fff; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog.is-empty .catalog-detail-content { min-height: 467px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switcher { display: flex; align-items: center; gap: 8px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switcher[hidden] { display: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-list { flex: 1 1 auto; width: 0; padding: 14px 0 12px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-list button.is-active { position: relative; z-index: 1; transform: scale(1.06); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-arrow { flex: 0 0 36px; width: 36px; height: 44px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #49665f; cursor: pointer; transition: color .18s ease, transform .18s ease; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-arrow svg { width: 27px; height: 36px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-arrow:hover:not(:disabled) { color: #234f43; transform: scale(1.08); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switch-arrow:disabled { opacity: .35; cursor: default; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-image { position: sticky; top: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana { margin: 10px 0; padding: 12px; border-radius: 6px; background: #f3f5f7; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl { gap: 8px; border: 0; background: transparent; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl > .catalog-skill-effect-row,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl > .catalog-upgrade-cost-row { padding: 12px; border: 0; border-radius: 6px; background: #f3f5f7; }
  .catalog-layout .catalog-grid { gap: 18px 16px; }
  .catalog-layout .catalog-art { height: 176px; padding: 8px 6px; }
  .catalog-layout .catalog-card-info { padding-top: 8px; }
}
@media(max-width:900px) {
  .catalog-layout .collection-entry > img { width: 42px; height: 42px; flex-basis: 42px; }
  .catalog-layout .collection-copy em { display: none; }
  .catalog-resource-grid { grid-template-columns: 1fr; }
  .catalog-detail-backdrop { align-items: center; padding: 16px; }
  .catalog-detail-stage { width: min(430px, 100%); max-height: calc(100vh - 32px); }
  .catalog-detail-dialog { width: 100%; min-height: 0; max-height: calc(100vh - 122px); padding: 18px 14px 16px; border-radius: 10px; }
  .catalog-detail-content { grid-template-columns: 108px minmax(0, 1fr); gap: 16px; }
  .catalog-detail-copy { padding-top: 4px; }
  .catalog-detail-copy h2 { margin-right: 0; font-size: 20px; }
  .catalog-detail-copy dl > div { grid-template-columns: 64px minmax(0, 1fr); gap: 8px; padding: 8px 0; font-size: 12px; }
  .catalog-detail-close { top: 10px; right: 10px; width: 32px; height: 32px; }
  .catalog-detail-switcher { margin-top: 9px; }
  .catalog-detail-switch-list { gap: 9px; padding-inline: 2px; }
  .catalog-detail-switch-list button { flex-basis: 56px; }
  .catalog-detail-switch-list img { width: 56px; height: 88px; }
}
@media(max-width:600px) {
  .catalog-layout .catalog-generic-grid.is-landscape-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .catalog-layout .catalog-generic-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 8px; }
  .catalog-layout .catalog-generic-toolbar input { grid-column: 1; grid-row: 1; order: 0; width: 100%; min-width: 0; max-width: none; margin: 0; }
  .catalog-layout .catalog-generic-toolbar .catalog-filter-select { grid-column: 2; grid-row: 1; order: 1; min-width: 0; }
  .catalog-layout .catalog-generic-toolbar:has([data-generic-reset]:not([hidden])) { grid-template-columns: minmax(0, 1fr) 112px 42px; }
  .catalog-layout .catalog-generic-toolbar [data-generic-reset]:not([hidden]) { grid-column: 3; grid-row: 1; min-width: 0; padding-inline: 2px; }
  .catalog-layout #catalog-heroes-panel .catalog-toolbar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 8px;
  }
  .catalog-layout #catalog-heroes-panel .catalog-toolbar .catalog-filter-select { min-width: 0; }
  .catalog-layout #catalog-heroes-panel .catalog-toolbar .catalog-filter-trigger {
    gap: 5px;
    padding-inline: 8px;
  }
  .catalog-layout #catalog-heroes-panel .catalog-toolbar > button {
    padding-inline: 4px;
    white-space: nowrap;
  }
  .catalog-layout #catalog-heroes-panel .catalog-toolbar > input {
    grid-column: 1 / -1;
    min-width: 0;
    width: 100%;
    margin-left: 0;
  }
  .catalog-card-toolbar { flex-wrap: wrap; }
  .catalog-card-toolbar .catalog-filter-select { flex: 0 0 95px; min-width: 0; }
  .catalog-card-toolbar [data-card-reset] { flex: 0 0 42px; min-width: 42px; padding-inline: 4px; }
  .catalog-card-toolbar input { order: 5; flex: 1 1 180px; width: auto; min-width: 160px; max-width: none; margin: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-tools { position: relative; top: auto; z-index: 5; gap: 8px; margin: 0; padding: 8px 49px 0 6px; border: 1px solid rgba(255,255,255,.75); border-bottom: 0; border-radius: 8px 8px 0 0; background: rgba(247,251,248,.9); box-shadow: 0 7px 12px -7px rgba(17,30,36,.3); -webkit-backdrop-filter: blur(12px) saturate(1.2); backdrop-filter: blur(12px) saturate(1.2); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-tools[hidden] { display: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade { position: relative; flex: 0 0 96px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade { order: 1; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-grade,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search { transform: translateY(-4px); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search input { width: 100%; height: 38px; border: 1px solid #c9d3d6; border-radius: 6px; background: #f7f8f8; color: #29393e; font: inherit; font-size: 13px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger { display: flex; align-items: center; justify-content: space-between; gap: 4px; padding: 0 8px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-trigger i { width: 7px; height: 7px; flex: 0 0 7px; margin-top: -4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu { position: absolute; z-index: 8; top: calc(100% + 5px); right: 0; width: 100%; min-width: 0; display: grid; gap: 2px; padding: 5px; border: 1px solid #dce3e5; border-radius: 7px; background: #fff; box-shadow: 0 8px 22px rgba(20,35,40,.18); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu[hidden] { display: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button { min-height: 34px; padding: 0 8px; border: 0; border-radius: 4px; background: transparent; color: #29393e; font: inherit; font-size: 13px; text-align: left; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-filter-menu button:hover { background: #eef3f1; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search { order: 0; flex: 1 1 auto; min-width: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-search input { padding: 0 9px 0 34px; }
  .catalog-detail-backdrop.is-arcanatactics { align-items: center; padding: 24px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-stage { width: 100%; max-height: calc(100dvh - 48px); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog { height: calc(100dvh - 114px); max-height: calc(100dvh - 114px); overflow: auto; padding: 20px 14px; border-top: 0; border-radius: 0 0 6px 6px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-dialog.is-empty .catalog-detail-content { min-height: calc(100dvh - 160px); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-close { position: fixed; z-index: 170; top: 38px; right: 28px; width: 38px; height: 38px; border: 1px solid #c9d3d6; border-radius: 6px; background: #f7f8f8; box-shadow: none; backdrop-filter: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-content { display: flex; flex-direction: column; gap: 12px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-count { display: block; width: 100%; margin-bottom: -6px; color: #87959a; font-size: 11px; line-height: 1.2; text-align: center; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-card-surface { display: contents; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-media { --mobile-swipe-x: 0px; --mobile-main-scale: 1; --mobile-main-rotate: 0deg; --mobile-main-opacity: 1; --mobile-prev-scale: .92; --mobile-prev-rotate: -10deg; --mobile-prev-opacity: .42; --mobile-next-scale: .92; --mobile-next-rotate: 10deg; --mobile-next-opacity: .42; --mobile-before-opacity: 0; --mobile-after-opacity: 0; position: relative; width: calc(100% + 28px); min-height: min(63vw, 217px); margin: 0 -14px; overflow: hidden; touch-action: pan-y; user-select: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-image { position: relative; z-index: 2; display: block; width: min(38vw, 130px); margin: 0 auto; opacity: var(--mobile-main-opacity); box-shadow: 0 0 22px rgba(16,27,32,.36); transform: translateX(var(--mobile-swipe-x)) rotate(var(--mobile-main-rotate)) scale(var(--mobile-main-scale)); transition: transform .19s ease-out, opacity .19s ease-out; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card { position: absolute; z-index: 1; top: 50%; display: block; width: 100px; height: 156px; padding: 0; overflow: visible; border: 0; border-radius: 8px; background: transparent; cursor: pointer; transition: transform .19s ease-out, opacity .19s ease-out; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card.is-previous { left: -40px; opacity: var(--mobile-prev-opacity); transform: translateY(-50%) translateX(var(--mobile-swipe-x)) rotate(var(--mobile-prev-rotate)) scale(var(--mobile-prev-scale)); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card.is-next { right: -40px; opacity: var(--mobile-next-opacity); transform: translateY(-50%) translateX(var(--mobile-swipe-x)) rotate(var(--mobile-next-rotate)) scale(var(--mobile-next-scale)); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card.is-before-previous { left: calc(-50% - 30px); opacity: var(--mobile-before-opacity); transform: translateY(-50%) translateX(var(--mobile-swipe-x)) rotate(-10deg) scale(.92); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card.is-after-next { right: calc(-50% - 30px); opacity: var(--mobile-after-opacity); transform: translateY(-50%) translateX(var(--mobile-swipe-x)) rotate(10deg) scale(.92); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-media.is-swiping .catalog-detail-image,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-media.is-swiping .catalog-detail-mobile-card { transition: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-media.is-switching { pointer-events: none; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-card img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; filter: contrast(.72) saturate(.7) drop-shadow(0 5px 8px rgba(13,25,31,.42)); }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-arrow { position: absolute; z-index: 4; top: 50%; width: 28px; height: 28px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(23,33,38,.68); color: #fff; font-size: 0; transform: translateY(-50%); cursor: pointer; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-arrow.is-previous { left: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-arrow.is-next { right: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-mobile-arrow svg { display: block; width: 14px; height: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy { width: 100%; padding-top: 0; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-titlebar { width: 100%; align-items: baseline; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-meta span { padding: 2px 6px; font-size: 12px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-intro { margin-bottom: 6px; padding-bottom: 8px; border-bottom: 1px solid #e8eded; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-intro p { font-size: 13px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana { display: grid; grid-template-columns: 72px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 12px; align-items: center; margin: 8px 0; padding: 12px; border-radius: 6px; background: #f3f5f7; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana { margin-top: 6px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading { grid-column: 1; grid-row: 1 / 3; align-self: stretch; flex-direction: column; align-items: center; justify-content: center; gap: 2px; margin: 0; padding-right: 12px; border-right: 1px solid rgba(63,84,91,.08); text-align: center; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading > span { font-size: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-heading strong { font-size: 15px; line-height: 1.1; text-align: center; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana input[type="range"] { grid-column: 2; grid-row: 1; align-self: end; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-level-control--arcana .catalog-level-scale { grid-column: 2; grid-row: 2; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dt { color: #718087; font-size: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl { gap: 8px; overflow: visible; border-top: 0; border-radius: 0; background: transparent; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl > .catalog-skill-effect-row,
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-copy dl > .catalog-upgrade-cost-row { padding: 12px; border: 0; border-radius: 6px; background: #f3f5f7; }
  .catalog-detail-backdrop.is-arcanatactics [data-level-effect] { font-size: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-upgrade-cost span { color: #29393e; font-size: 14px; }
  .catalog-detail-backdrop.is-arcanatactics .catalog-detail-switcher { display: none; }
}
/* Shared catalog template: image palette and Arcana-style card movement. */
.catalog-detail-backdrop.is-shared-detail{--catalog-modal-accent:#3b7167;--catalog-modal-tint:#edf5f2;--catalog-modal-glow:#a8d5c8}
.catalog-detail-backdrop.is-shared-detail .generic-detail-kicker,
.catalog-detail-backdrop.is-shared-detail .generic-detail-nested h3{color:var(--catalog-modal-accent)}
.catalog-detail-backdrop.is-shared-detail .catalog-detail-image{box-shadow:0 10px 30px color-mix(in srgb,var(--catalog-modal-accent) 24%,transparent)}
.catalog-detail-backdrop.is-shared-detail .catalog-detail-switch-list button.is-active{border-color:var(--catalog-modal-accent);box-shadow:0 0 0 2px var(--catalog-modal-tint)}
.catalog-detail-backdrop.is-shared-detail .catalog-detail-switch-arrow:hover:not(:disabled){color:var(--catalog-modal-accent)}
.catalog-detail-backdrop.is-shared-detail .generic-detail-search input:focus-visible,
.catalog-detail-backdrop.is-shared-detail .generic-detail-filter select:focus-visible{outline:2px solid var(--catalog-modal-accent);outline-offset:2px}
.catalog-detail-backdrop.is-shared-detail .catalog-detail-stage::before{background:color-mix(in srgb,var(--catalog-modal-tint) 48%,transparent)}
@media(max-width:600px){
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-media{position:relative;display:flex;align-items:center;justify-content:center;min-height:230px;overflow:hidden;touch-action:pan-y}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-card-surface{display:block;position:relative;z-index:2;width:min(38vw,130px);margin:auto;opacity:var(--catalog-swipe-opacity,1);transform:translateX(var(--catalog-swipe-x,0px));transition:transform .2s,opacity .2s}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-media.is-swiping .catalog-detail-card-surface{transition:none}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-image{display:block;width:100%;height:auto;margin:0;box-shadow:0 0 22px color-mix(in srgb,var(--catalog-modal-accent) 34%,transparent)}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card{position:absolute;top:50%;z-index:1;display:block;width:100px;height:156px;padding:0;border:0;border-radius:8px;background:transparent;opacity:.48;cursor:pointer;transform:translateY(-50%) rotate(var(--card-rotate)) scale(.9);transition:opacity .2s,transform .2s}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card.is-previous{left:-35px;--card-rotate:-10deg}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card.is-next{right:-35px;--card-rotate:10deg}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;filter:saturate(.72)}
  .catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card:hover{opacity:.8;transform:translateY(-50%) rotate(var(--card-rotate)) scale(.96)}
}
@media(prefers-reduced-motion:reduce){.catalog-detail-backdrop.is-shared-detail .catalog-detail-mobile-card,.catalog-detail-backdrop.is-shared-detail .catalog-detail-card-surface{transition:none}}