/* /design/styles/tokens.css */
/* ============================================================================
SnapHolo 디자인 토큰
----------------------------------------------------------------------------
생성물 — 정본은 docs/design/tokens/snapholo.tokens.json, 손으로 고치지 마라.
다시 만들기: python scripts/build_tokens.py
(docs/design/styles/tokens.css 와 docs/design/ds-bundle/tokens.css 는 같은 바이트다.)
다른 CSS 파일에 hex 리터럴을 적지 마라 — 그게 v3 가 죽은 경로다.
프레임워크 중립: 순수 CSS 커스텀 프로퍼티다. 빌드 없는 정적 HTML 은 로 읽는다.
대비 실측은 정본 JSON 의 contrast 표에 있고 tests/test_design_tokens.py 가 다시 잰다.
========================================================================== */
:root {
/* ══════════════════════════════════════════════════════════════════════════
1층 · PRIMITIVE — 값 그 자체. 의미를 담지 않는다.
══════════════════════════════════════════════════════════════════════════ */
/* 브랜드 홀로 4색 — logo.ai 마스터에서 나온 값. 새로 만들지 않는다. */
--holo-aqua: #5bc9d5;
--holo-iris: #8c77da;
--holo-blossom: #ef94b8;
--holo-amber: #ffd88e;
--ink: #17232c; /* 브랜드 잉크 — brand/master/*.svg 의 fill 값과 동일 */
/* 중성 램프 (hue 220) — 흰 지면 대비 실측은 contrast 표 */
--slate-950: #1e2534;
--slate-800: #333b4c;
--slate-700: #4d576a;
--slate-600: #65718b; /* 본문 최소선 */
--slate-400: #9ca4b4; /* 비텍스트 전용 */
--slate-300: #cacfd8;
--slate-200: #e1e4ea;
--slate-100: #eef0f4;
--slate-50: #f7f8fa;
--white: #ffffff;
/* 아이리스 — 브랜드 보라(옛). v0 시안에 흩어져 있던 7종을 이 넷으로 수렴했다
(#7174d4 #7c79dc #7476d3 #6e73d1 #8081dc #7777d6 #4f55b5) */
--iris-700: #5f62cf; /* 글자로 쓸 수 있는 유일한 보라
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--iris-500: #7174d4; /* 텍스트로 쓰지 마라. 채움 전용
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--iris-300: #8b8ddc; /* 보더·밑줄 전용
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--iris-50: #f0f0ff; /* legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
/* 상태색 — 지면·카드 양쪽에서 4.5:1 을 넘도록 낮춘 값 */
--green-600: #3a7e63;
--amber-700: #9f6432;
--red-700: #b42318; /* 오류 원색 · 흰 바탕 6.57:1 */
--red-50: #fdeceb; /* 오류 옅은 바탕 */
--pink-700: #c01f68; /* 내림 원색 · 흰 바탕 5.77:1, 옛 차트색 #d62a76 4.72:1 대체 */
/* 알파 — 그림자·오버레이. 색상 토큰과 섞지 않는다 */
--alpha-card-shadow: rgba(116, 118, 216, 0.2);
--alpha-art-shadow: rgba(41, 55, 90, 0.33);
--alpha-text-shadow: rgba(0, 0, 0, 0.2);
--alpha-white-strong: rgba(255, 255, 255, 0.7);
--alpha-white-soft: rgba(255, 255, 255, 0.33);
/* ══════════════════════════════════════════════════════════════════════════
2층 · SEMANTIC — 화면은 이것만 쓴다.
다크 모드를 얹을 때 재정의하는 것도 이 층뿐이다(1층은 그대로).
══════════════════════════════════════════════════════════════════════════ */
/* 지면 */
--color-bg: var(--slate-50);
--color-surface: var(--white);
--color-surface-sunken: var(--slate-50);
/* 글자 — 세 단. 그 아래는 없다 */
--color-text: var(--slate-950); /* 제목·값 */
--color-text-secondary: var(--slate-700); /* 본문·설명 */
--color-text-muted: #5c6880; /* 라벨·보조 */
/* 선 */
--color-border: var(--slate-200);
--color-border-strong: var(--slate-300);
--color-border-dashed: var(--slate-200);
/* 강조 — legacy(옛 보라). 옛 화면 9개 전용 — 새 화면은 아래 브랜드 강조(민트)만 쓴다 */
--color-accent: var(--iris-700); /* 링크·강조 텍스트 — 세 지면 모두 통과
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--color-accent-fill: var(--iris-500); /* 채움(아바타·칩) — 텍스트 아님
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--color-accent-line: var(--iris-300); /* 보더·활성 밑줄 — 텍스트 아님
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
--color-accent-soft: var(--iris-50); /* 배지·노트 지면
legacy — 2026-10-02 대표 결정 d2 — 2단계에서 민트로 */
/* 브랜드 강조 — 민트 (2026-10-02 대표 결정 d2). 액션 채움과 텍스트 링크를 구분한다 */
--color-brand-action-fill: #1bd3ce; /* 액션 채움 — 에메랄드 바탕. 텍스트·아이콘은 brand.action.on(흰색). */
--color-brand-action-on: #ffffff; /* 에메랄드 액션 버튼의 텍스트·아이콘 — 흰색(2026-10-07 사용자 지시) */
--color-brand-link-text: #00777d; /* 텍스트 링크 — 민트 글자로 작은 링크를 만들지 않고 이 진한 색을 쓴다(UI-GUIDE 03). 아이스 지면 미달 — contrast 예외 */
--color-brand-symbol-mint: #24d5cb; /* 심볼 민트 — 심볼 위쪽 그라디언트 시작색 · 홈 강조 */
/* 상태 */
--color-state-known: var(--green-600);
--color-state-uncollected: var(--amber-700);
--color-state-live: var(--green-600);
--color-danger: var(--red-700);
--color-danger-soft: var(--red-50);
--color-rise: #327055;
--color-fall: var(--pink-700);
/* 홀로 그라디언트 — 정의는 여기 하나뿐이다.
허용 자리 세 곳 (README 로고 규칙 4, 2026-08-21 개정):
① 어두운 지면의 워드마크 ② 실제 포일 판본의 카드 표면
③ 상단 3px 브랜드 밴드
그 외에 쓰지 마라. */
--gradient-holo: linear-gradient(
57deg,
var(--holo-aqua),
var(--holo-iris) 33.3%,
var(--holo-blossom) 66.7%,
var(--holo-amber)
);
--on-gradient: var(--ink); /* 그라디언트 위 글자는 잉크다. 흰 글자는 금지 — 대비 실측은 contrast 표 */
/* 그림자 */
--shadow-card: 0 24px 50px var(--alpha-card-shadow);
--shadow-art-text: 0 15px 22px var(--alpha-art-shadow);
/* ── 차트 계열색 — 마감 3종. 순서 고정, 순환 금지 ──
색은 마감(엔티티)을 따라간다. 필터로 계열이 줄어도 남은 것의 색은 안 바뀐다.
dataviz 검증기 실측(지면 #ffffff):
명도대역 PASS · 채도하한 PASS · 정상시각 ΔE 20.3 PASS · 지면대비 PASS
CVD 최악쌍 리버스↔홀로 ΔE 7.7(deutan) — 6~8 구간이라
**선 끝 직접 라벨이 필수**다. 범례만으로는 안 된다.
다크(지면 #191e2a): 명도대역·채도·정상시각 ΔE 17.4·지면대비 PASS / CVD 최악쌍 7.7(deutan)
→ 라이트와 같은 이유로 직접 라벨 필수 */
--chart-finish-base: #6f5bd8;
--chart-finish-holo: #0a97a6;
--chart-finish-reverse: #d62a76;
--chart-grid: var(--slate-100);
--chart-axis: var(--slate-300);
/* ══════════════════════════════════════════════════════════════════════════
활자 — 서체 · 크기 · 행간 · 자간 · 굵기
══════════════════════════════════════════════════════════════════════════ */
/* 서체 — IBM Plex 한 가족으로 Latin·한글·일본어·태국어를 덮는다.
중국어(TC/SC)만 IBM Plex 에 없어 Noto 로 보충한다.
⚠️ 스크립트별 스택은 아래 :lang() 이 갈아 끼운다 — 한 줄로 다 나열하면
한자가 겹쳐서 중국어가 일본어 글리프로 나온다. */
--font-sans: "IBM Plex Sans", "IBM Plex Sans KR", "IBM Plex Sans JP", sans-serif;
--font-display: var(--font-sans);
--font-mono: "IBM Plex Mono", "IBM Plex Sans KR", ui-monospace, SFMono-Regular, monospace;
/* Shared service scale: body 16, supporting text 14, captions 12; desktop/mobile headings use the same roles in every language. */
--text-display: 3.5rem; /* 3.5rem desktop / 2rem mobile */
--text-hero: 2rem; /* 2rem desktop / 1.625rem mobile */
--text-h2: 1.5rem; /* 24.0px */
--text-h3: 1.125rem; /* 18.0px */
--text-body: 1rem; /* 16px */
--text-data: 0.875rem; /* 14.0px */
--text-label: 0.75rem; /* 12 — 절대 하한 */
--text-price: 2.25rem; /* 36.0px */
--text-price-sub: 1.25rem; /* 20.0px */
--leading-tight: 1.25;
--leading-snug: 1.4;
--leading-normal: 1.6;
--tracking-display: -0.02em;
--tracking-kicker: 0.04em;
--weight-regular: 400;
--weight-medium: 500;
--weight-bold: 700;
--weight-black: 800;
--weight-semibold: 600;
/* ══════════════════════════════════════════════════════════════════════════
간격 — 4px 기반 12단. v0 시안의 padding 24종 · gap 20종을 여기 스냅했다.
══════════════════════════════════════════════════════════════════════════ */
--space-1: 0.25rem; /* 4px */
--space-2: 0.5rem; /* 8px */
--space-3: 0.75rem; /* 12px */
--space-4: 1rem; /* 16px */
--space-5: 1.25rem; /* 20px */
--space-6: 1.5rem; /* 24px */
--space-7: 2rem; /* 32px */
--space-8: 2.5rem; /* 40px */
--space-9: 3rem; /* 48px */
--space-10: 4rem; /* 64px */
--space-11: 5rem; /* 80px */
--space-12: 6rem; /* 96px */
/* 반경 — v0 의 5·8·9·10·12·17·26·999 를 다섯 단으로 */
--radius-sm: 6px;
--radius-md: 8px;
--radius-lg: 12px;
--radius-xl: 16px;
--radius-full: 999px;
/* 레이아웃 */
--layout-max: 1184px;
--layout-pad: var(--space-7); /* 모바일(≤760px)에서 space-5 */
--layout-pad-sm: var(--space-5);
--topbar-height: 74px;
/* 모션 — 150~300ms. 의미 없는 장식 애니메이션은 두지 않는다.
들어올 때는 ease-out(빠르게 시작해 부드럽게 안착), 나갈 때는 ease-in 으로 더 짧게.
transform 과 opacity 만 애니메이션한다 — width/height/top/left 는 매 프레임 레이아웃을 다시 계산한다. */
--motion-fast: 0.15s; /* 줄이기 설정에서 0.01ms */
--motion-base: 0.25s; /* 줄이기 설정에서 0.01ms */
--motion-ease: cubic-bezier(0.4, 0, 0.2, 1); /* 표준 */
--motion-enter: 0.2s; /* 손에 잡히는 순간 */
--motion-leave: 0.14s; /* 놓는 건 더 빨라야 미련이 없다 */
--ease-out: cubic-bezier(0.22, 0.9, 0.3, 1); /* 들어올 때 */
--ease-in: cubic-bezier(0.4, 0, 1, 1); /* 나갈 때 */
/* 카드를 집어 올리는 눈금. 이 셋이 「손으로 집었다」의 전부다 —
더 올리면 카드가 화면에서 뜯겨 나가고, 더 틀면 그리드가 흔들려 보인다. */
--lift-y: -10px; /* 뜨는 높이 */
--lift-tilt: -2.5deg; /* 왼쪽이 들린다(반대각). 기존 기울기에 더해진다.
⚠️ 음수 = 반시계 = 왼쪽 들림.
+2.5 로 되돌리지 마라 (2026-08-23 대표) */
--lift-scale: 1.03; /* 눈에 가까워진 만큼 */
--press-scale: 0.97; /* 손가락 아래서 눌리는 정도 */
--shadow-rest: 0 6px 16px var(--alpha-card-shadow);
--shadow-lift: 0 22px 40px var(--alpha-card-shadow);
/* 나머지 모션의 눈금. 전부 짧다 — 이 화면은 표와 그리드라 오래 끌면 읽을 수가 없다 */
--motion-tint: 0.12s; /* 색만 바뀌는 것(행·버튼·테두리) */
--motion-press: 0.08s; /* 누름 */
--motion-drop: 0.16s; /* 메뉴 열림 (닫힘은 --motion-press) */
--motion-reveal: 0.32s; /* 스크롤 진입 — 한 번만 */
--reveal-y: 12px; /* 진입할 때 아래에서 올라오는 거리 */
--reveal-step: 0.04s; /* 줄줄이 들어올 때 한 칸 간격 */
--set-bg: #f3f7f9; /* 아이스 */
--set-line: #dee8ee;
--set-panel: #eaf1f5;
--set-focus: #6e66d7;
--set-fan-duration: 400ms;
--brand-foil-cyan: #32dce8;
--brand-foil-violet: #8374f3;
--brand-foil-pink: #ef8fda;
--brand-foil-gold: #ffe9a1;
--brand-foil-green: #7ae1c0;
--brand-foil-blue: #57c9ee;
--brand-foil-mask-solid: #000;
--brand-foil-mask-soft: #000c;
--brand-foil-light-cyan: #b7eeff55;
--brand-foil-light-white: #fff;
--brand-foil-light-soft: #fff9;
--brand-foil-light-pink: #fcd9ff66;
--brand-foil-glow-soft: #fff5;
--brand-foil-pin: #718d98;
--motion-foil-sweep: 8s;
/* Service UI typography roles. Hero and cinematic card prices retain their own scale. */
--ui-page-size: var(--text-h2);
--ui-page-line: var(--space-7);
--ui-section-size: var(--text-h3);
--ui-group-size: var(--text-body);
--ui-body-size: var(--text-body);
--ui-body-line: var(--space-6);
--ui-support-size: var(--text-data);
--ui-support-line: var(--space-5);
--ui-label-size: var(--text-label);
--ui-label-line: var(--space-4);
--ui-summary-size: var(--text-h2);
--ui-summary-line: var(--space-7);
--ui-section-line: 1.625rem;
/* Shared service components: compact/descriptive rows, groups, summary, FAQ and contact form. */
--ui-gutter: var(--space-4);
--ui-group-radius: var(--radius-lg);
--ui-group-padding: var(--space-5);
--ui-group-gap: var(--space-3);
--ui-section-gap: var(--space-6);
--ui-label-gap: var(--space-3);
--ui-row-compact: var(--space-9);
--ui-row-descriptive: var(--space-10);
--ui-row-pad-y: var(--space-2);
--ui-icon-slot: var(--space-7);
--ui-icon-size: var(--space-6);
--ui-icon-gap: var(--space-3);
--ui-trailing-size: var(--space-4);
--ui-text-gap: var(--space-1);
--ui-control-height: 2.75rem;
--ui-control-radius: var(--radius-sm);
--ui-field-gap: var(--space-6);
--ui-chart-width: var(--space-12);
--ui-page-max: 40rem;
--ui-touch-min: 2.75rem;
--ui-submit-height: 3.25rem;
--ui-area-padding: var(--space-6);
/* 2026-10-18 user decision: one dominant hue per purpose, tonal light/shadow only. Replaces rainbow-per-icon rule. */
--icon-discovery: var(--color-brand-symbol-mint);
--icon-market: var(--color-brand-symbol-mint);
--icon-library: var(--color-brand-symbol-violet);
--icon-interest: var(--color-brand-symbol-pink);
--icon-premium: var(--color-brand-symbol-gold);
--icon-support: var(--holo-aqua);
--icon-account: #4c8fe6; /* Account/settings blue. Replaces gray after user feedback 2026-10-18. */
--color-brand-symbol-violet: #7760f5;
--color-brand-symbol-pink: #f08bda;
--color-brand-symbol-gold: #ffd17c;
--color-page-bg: #f3f7f9;
--color-panel: #eaf1f5;
--color-area-fill-start: #ffffff;
--color-area-stroke: #ffffff;
--color-scan-attention: #c2410c;
}
/* ══════════════════════════════════════════════════════════════════════════
다크 — 2층(semantic)만 다시 정의한다. 1층 primitive 는 건드리지 않는다(예외: 알파 그림자 2개).
대비는 **패널 지면(--color-surface) 기준**으로 맞췄다 — 실측과 미달 예외는 정본 JSON 의 contrast 표.
세 갈래를 모두 받는다:
① 사용자가 다크를 명시 → :root[data-theme="dark"]
② 시스템 설정이 다크 → prefers-color-scheme (라이트 명시는 제외)
③ 클래스 토글 → .dark
══════════════════════════════════════════════════════════════════════════ */
:root[data-theme="dark"],
.dark {
color-scheme: dark;
--color-bg: #10151e;
--color-surface: #191e2a;
--color-surface-sunken: #0c1018;
--color-text: #d8dbe1;
--color-text-secondary: #a1a9b8;
--color-text-muted: #7b869b;
--color-border: #313949;
--color-border-strong: #454f63;
--color-border-dashed: #313949;
--color-accent: #797cd6;
--color-accent-fill: #7174d4;
--color-accent-line: #585bcd;
--color-accent-soft: #25264b;
--color-state-known: #449373;
--color-state-uncollected: #b9753a;
--color-state-live: #449373;
--color-danger: #f2867e;
--color-danger-soft: #3a1d22;
--color-rise: #5fb38e;
--color-fall: #f07aa8;
/* 그라디언트와 그 위 글자는 다크에서도 그대로다 — 대비는 contrast 표 */
/* 차트 계열색 (다크) — 근거는 정본 JSON semantic.chart */
--chart-finish-base: #8274e0;
--chart-finish-holo: #0f9dad;
--chart-finish-reverse: #e05f92;
--chart-grid: #232b3a;
--chart-axis: #3b4557;
--on-gradient: var(--ink);
/* 다크에서는 보라 그림자가 탁해 보인다. 검정 기반으로 바꾼다 */
--alpha-card-shadow: rgba(0, 0, 0, 0.55);
--alpha-art-shadow: rgba(0, 0, 0, 0.5);
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
color-scheme: dark;
--color-bg: #10151e;
--color-surface: #191e2a;
--color-surface-sunken: #0c1018;
--color-text: #d8dbe1;
--color-text-secondary: #a1a9b8;
--color-text-muted: #7b869b;
--color-border: #313949;
--color-border-strong: #454f63;
--color-border-dashed: #313949;
--color-accent: #797cd6;
--color-accent-fill: #7174d4;
--color-accent-line: #585bcd;
--color-accent-soft: #25264b;
--color-state-known: #449373;
--color-state-uncollected: #b9753a;
--color-state-live: #449373;
--color-danger: #f2867e;
--color-danger-soft: #3a1d22;
--color-rise: #5fb38e;
--color-fall: #f07aa8;
/* 그라디언트와 그 위 글자는 다크에서도 그대로다 — 대비는 contrast 표 */
/* 차트 계열색 (다크) — 근거는 정본 JSON semantic.chart */
--chart-finish-base: #8274e0;
--chart-finish-holo: #0f9dad;
--chart-finish-reverse: #e05f92;
--chart-grid: #232b3a;
--chart-axis: #3b4557;
--on-gradient: var(--ink);
/* 다크에서는 보라 그림자가 탁해 보인다. 검정 기반으로 바꾼다 */
--alpha-card-shadow: rgba(0, 0, 0, 0.55);
--alpha-art-shadow: rgba(0, 0, 0, 0.5);
}
}
@media (max-width: 760px) {
:root {
--text-display: 2rem;
--text-hero: 1.625rem;
--text-body: 1rem;
--text-price: 1.75rem;
--layout-pad: var(--space-5);
--ui-section-gap: 0.5rem;
--ui-area-padding: 0.5rem;
}
}
@media (prefers-reduced-motion: reduce) {
:root {
--motion-fast: 0.01ms;
--motion-base: 0.01ms;
}
}
/* ══════════════════════════════════════════════════════════════════════════
언어별 서체 — 한자가 겹치므로 스크립트마다 스택을 갈아 끼운다.
카드 이름처럼 본문 언어와 다른 조각에는 그 자리에 lang 속성을 준다:
熱風のアリーナ
══════════════════════════════════════════════════════════════════════════ */
:lang(ko) {
--font-sans: "IBM Plex Sans KR", "IBM Plex Sans", "IBM Plex Sans JP", sans-serif;
}
:lang(ja) {
--font-sans: "IBM Plex Sans JP", "IBM Plex Sans", "IBM Plex Sans KR", sans-serif;
}
:lang(th) {
--font-sans: "IBM Plex Sans", "IBM Plex Sans Thai", system-ui, sans-serif;
}
:lang(zh-Hant),
:lang(zh-TW) {
--font-sans: "IBM Plex Sans", "Noto Sans TC", system-ui, sans-serif;
}
:lang(zh-Hans),
:lang(zh-CN) {
--font-sans: "IBM Plex Sans", "Noto Sans SC", system-ui, sans-serif;
}
:lang(en) {
--font-sans: "IBM Plex Sans", "IBM Plex Sans KR", "IBM Plex Sans JP", sans-serif;
font-family: var(--font-sans);
}
:lang(ko),
:lang(ja),
:lang(th),
:lang(zh-Hant),
:lang(zh-TW),
:lang(zh-Hans),
:lang(zh-CN) {
font-family: var(--font-sans);
}
/* /explore/set.css */
:root{--bg:var(--set-bg);--ink:var(--color-text);--mint:var(--color-brand-action-fill);--link:var(--color-brand-link-text);--muted:var(--slate-600);--line:var(--set-line);--panel:var(--set-panel);--paper:var(--white);--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--bg);color:var(--ink);font:var(--text-body)/1.6 var(--font-sans);-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button,select{cursor:pointer}button{border:0;background:none}button:disabled{cursor:default;opacity:.35}button,a,input,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--holo-iris)}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:var(--tracking-display);line-height:var(--leading-snug);word-break:keep-all}h2{font-size:27px}h3{font-size:20px}.wrap{width:calc(100% - 112px);max-width:1200px;margin:auto}.quiet,.section-footnote{font-size:var(--text-label);color:var(--muted)}.eyebrow{display:block;font:500 var(--text-label)/1.5 var(--font-sans);letter-spacing:var(--tracking-kicker);color:var(--muted)}.sr-only,.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip:focus{width:auto;height:auto;clip:auto;z-index:99;background:var(--paper);padding:16px}[hidden]{display:none!important}
.review-bar{min-height:54px;display:flex;align-items:center;gap:18px;padding:6px 24px;border-bottom:1px solid var(--line);background:var(--paper);position:relative;z-index:10}.review-label{font:500 var(--text-label) var(--font-sans);letter-spacing:var(--tracking-kicker);white-space:nowrap}.review-label b{background:var(--ink);color:var(--paper);padding:4px 6px;margin-left:4px}.review-bar select{font-size:var(--text-label);background:var(--bg);border:1px solid var(--line);padding:9px;border-radius:6px;min-height:40px}.review-modes{display:flex;gap:3px}.review-modes button{font-size:var(--text-label);min-height:40px;border-radius:6px;padding:6px 12px;white-space:nowrap}.review-modes button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.review-note{font-size:var(--text-label);color:var(--muted);margin-left:auto}.site-header{height:88px;display:flex;gap:68px;align-items:center}.logo{width:210px;height:auto}.site-header nav{display:flex;height:100%;gap:38px;font-weight:600;font-size:var(--text-data)}.site-header nav a{display:flex;align-items:center;position:relative}.site-header .active:after{content:'';position:absolute;bottom:18px;left:0;right:0;height:3px;background:var(--mint)}.header-right{margin-left:auto;font-size:var(--text-label);display:flex;gap:18px}.set-intro{display:flex;justify-content:space-between;align-items:center;min-height:112px;padding:0 0 14px}.set-intro h1{font-size:44px;letter-spacing:var(--tracking-display);margin:7px 0 12px}.set-intro .eyebrow{font-size:var(--text-label);letter-spacing:var(--tracking-kicker)}.set-meta{display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--muted);font-size:var(--text-data)}.set-meta b{font-weight:500;color:var(--ink)}#pack-art{height:114px;width:88px;object-fit:contain;margin-right:18px}.section-nav{display:flex;border-bottom:1px solid var(--line);gap:32px;align-items:center;margin-bottom:30px;font-size:var(--text-data)}.section-nav a{padding:13px 0;min-height:48px}.section-nav a:first-child{border-bottom:2px solid var(--ink);font-weight:600}.section-nav button{margin-left:auto;min-height:48px;font-size:var(--text-data)}.section-nav button span{margin-left:8px;color:var(--link)}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:22px}.section-heading h2{margin-top:6px}.highlight-section{margin-bottom:60px}.showcase{min-height:400px;display:grid;grid-template-columns:300px minmax(0,1fr);align-items:center;background:radial-gradient(ellipse at 74% 65%,color-mix(in srgb,var(--mint) 12%,transparent),transparent 60%),linear-gradient(120deg,var(--paper),var(--panel));border:1px solid color-mix(in srgb,var(--paper) 60%,var(--line));border-radius:18px;overflow:hidden;padding:25px 34px;gap:10px}.spotlight-rank{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:var(--text-label);margin-bottom:18px}.spotlight-rank>span:first-child{font:500 36px/1 var(--font-sans);color:var(--link);letter-spacing:var(--tracking-display)}.spotlight-badges{display:flex;gap:6px;margin-bottom:10px}.badge{display:inline-flex;align-items:center;min-height:23px;padding:2px 8px;font-size:var(--text-label);font-weight:600;background:var(--paper);border:1px solid var(--line);border-radius:4px;letter-spacing:var(--tracking-kicker)}.badge.special{color:var(--link);border-color:color-mix(in srgb,var(--mint) 50%,var(--line));background:color-mix(in srgb,var(--mint) 9%,var(--paper))}.spotlight-info h3{font-size:29px;margin-bottom:5px;overflow-wrap:anywhere}.spotlight-price{font-size:38px;font-weight:600;letter-spacing:var(--tracking-display);margin-top:15px;font-variant-numeric:tabular-nums}.price-caption{margin-top:-4px}.spotlight-actions{display:flex;gap:8px;margin-top:23px}.primary{background:var(--color-brand-action-fill);border-radius:8px;padding:11px 18px;font-weight:600;min-height:46px;font-size:var(--text-data);display:inline-flex;align-items:center;justify-content:center;gap:24px;color:var(--color-brand-action-on);}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--paper);border:1px solid var(--line);font-size:20px;flex-shrink:0}.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.icon-button[aria-pressed=true]{background:var(--color-brand-action-fill);border-color:var(--mint);color:var(--color-brand-action-on);}.icon-button[aria-pressed=true] svg{fill:currentColor}
.fan-area{min-width:0;text-align:center}.fan{height:296px;position:relative;isolation:isolate;touch-action:pan-y}.fan-card{position:absolute;left:50%;top:15px;width:175px;padding:0;aspect-ratio:63/88;transform:translateX(calc(-50% + var(--offset)*98px)) translateY(calc(var(--distance)*15px)) rotate(calc(var(--offset)*10deg)) scale(.86);transform-origin:50% 100%;transition:transform var(--set-fan-duration) var(--ease),filter var(--motion-enter);z-index:calc(10 - var(--distance));filter:drop-shadow(0 10px 8px color-mix(in srgb,var(--ink) 14%,transparent));border-radius:9px}.fan-card img{width:100%;height:100%;object-fit:contain;border-radius:8px;pointer-events:none}.fan-card[aria-pressed=true]{transform:translateX(-50%) translateY(-5px) rotate(0) scale(1.13);z-index:20;filter:drop-shadow(0 18px 12px color-mix(in srgb,var(--ink) 20%,transparent))}.fan-card:focus-visible{outline-offset:7px}.fan-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:3px}.fan-controls .icon-button{width:40px;height:44px;background:transparent}.fan-controls span{font:500 var(--text-label) var(--font-sans);letter-spacing:var(--tracking-kicker);font-variant-numeric:tabular-nums}.fan-hint{display:block;font-size:var(--text-label);color:var(--muted);margin-top:9px}.rank-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:14px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:color-mix(in srgb,var(--paper) 55%,transparent)}.rank-strip button{display:flex;align-items:center;text-align:left;gap:10px;padding:13px 12px;min-width:0;min-height:74px;border-right:1px solid var(--line)}.rank-strip button:last-child{border:0}.rank-strip button[aria-pressed=true]{background:color-mix(in srgb,var(--mint) 12%,var(--paper));box-shadow:inset 0 -3px var(--mint)}.rank-strip .rank{font:500 var(--text-data) var(--font-sans);color:var(--muted)}.rank-strip .rank-summary{min-width:0}.rank-strip strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-label);font-weight:500}.rank-strip small{font-size:var(--text-label);display:block;font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px}
.rarity-section{padding-top:3px;margin-bottom:58px}.text-button{color:var(--link);font-size:var(--text-label);min-height:44px}.rarity-shelves{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.rarity-shelf{border-top:1px solid var(--line);text-align:left;min-width:0;padding:18px 14px 15px;border-radius:0 0 12px 12px;background:linear-gradient(180deg,transparent,var(--panel))}.shelf-title{display:flex;justify-content:space-between;gap:8px;align-items:center}.shelf-title b{font:600 23px var(--font-sans);letter-spacing:var(--tracking-display)}.shelf-title span{font-size:var(--text-label);color:var(--muted)}.shelf-name{font-size:var(--text-label);color:var(--muted);display:block;margin-top:2px}.shelf-art{position:relative;height:174px;display:block;margin-top:10px}.shelf-art img{position:absolute;left:50%;top:16px;width:96px;height:135px;object-fit:contain;transform:translateX(calc(-50% + var(--i)*38px)) rotate(calc(var(--i)*9deg));transform-origin:50% 100%;transition:transform var(--motion-fast) var(--ease);filter:drop-shadow(0 6px 4px color-mix(in srgb,var(--ink) 12%,transparent));border-radius:5px}.shelf-action{display:flex;justify-content:space-between;font-size:var(--text-label);padding-top:7px}.all-rarities{display:flex;flex-wrap:wrap;gap:8px;margin:17px 0 12px}.all-rarities button{background:var(--paper);border:1px solid var(--line);border-radius:7px;min-height:44px;padding:9px 13px;font-size:var(--text-label)}.all-rarities button span{margin-left:10px;color:var(--muted)}.section-footnote{line-height:var(--leading-normal)}.collection-section{margin-bottom:40px}.collection-section h2>span{font:400 22px var(--font-sans);color:var(--muted);margin-left:7px}.view-switch{background:var(--panel);border:1px solid var(--line);display:flex;padding:3px;border-radius:8px}.view-switch button{min-height:38px;padding:7px 18px;font-size:var(--text-label);border-radius:5px}.view-switch button[aria-pressed=true]{background:var(--paper);box-shadow:0 1px 3px color-mix(in srgb,var(--ink) 8%,transparent)}.filter-row{display:flex;gap:9px;margin-top:22px;flex-wrap:wrap}.search-label{flex:1;min-width:210px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:8px;padding:0 14px;background:var(--paper)}.search-label svg{width:20px;height:20px;fill:none;stroke:var(--muted);stroke-width:1.6}.search-label input{width:100%;min-width:0;background:none;border:0;min-height:46px;font-size:var(--text-data)}.filter-row select,.filter-row>button{height:48px;padding:8px 14px;border:1px solid var(--line);background:var(--paper);border-radius:8px;font-size:var(--text-data)}.filter-row>button[aria-pressed=true]{background:var(--color-brand-action-fill);border-color:var(--mint);color:var(--color-brand-action-on);}.album-status{display:flex;align-items:center;justify-content:space-between;font-size:var(--text-label);color:var(--muted);min-height:51px}.album{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 24px;padding:28px;background:linear-gradient(90deg,var(--panel) 49.5%,var(--line) 49.8%,var(--paper) 50%,var(--panel) 50.4%);border:1px solid var(--line);border-radius:12px;box-shadow:0 4px 0 var(--bg),0 5px 0 var(--line);min-height:280px}.album-slot{position:relative;min-width:0;border:1px solid color-mix(in srgb,var(--paper) 75%,var(--line));border-radius:8px;padding:14px 14px 11px;background:color-mix(in srgb,var(--paper) 42%,transparent)}.album-slot .open-card{width:100%;padding:0;display:block;text-align:left}.album-slot .art:not(.is-loaded){background:var(--color-surface-sunken);border-radius:6px}.album-slot .art{display:flex;justify-content:center;align-items:center;height:220px;margin-bottom:14px}.album-slot img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 4px color-mix(in srgb,var(--ink) 10%,transparent))}.album-slot strong{font-size:var(--text-data);font-weight:500;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.album-slot .card-number{font-size:var(--text-label);color:var(--muted);display:block;margin-top:2px}.album-slot .card-price{font-size:var(--text-body);display:block;margin-top:5px;font-weight:600;letter-spacing:var(--tracking-display);font-variant-numeric:tabular-nums}.album-slot .badge{position:absolute;left:9px;top:9px;z-index:1}.save-small{position:absolute;right:5px;top:4px;width:44px;height:44px;z-index:2;background:color-mix(in srgb,var(--paper) 90%,transparent);border-radius:50%;display:flex;align-items:center;justify-content:center}.save-small svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}.save-small[aria-pressed=true]{background:var(--color-brand-action-fill);color:var(--color-brand-action-on);}.save-small[aria-pressed=true] svg{fill:currentColor}.pagination{display:flex;gap:25px;align-items:center;justify-content:center;margin:23px 0 18px;font-size:var(--text-label)}.pagination button{min-height:44px;border:1px solid var(--line);border-radius:7px;background:var(--paper);padding:9px 17px}.pagination span{font-variant-numeric:tabular-nums;color:var(--muted)}.album.list{display:flex;flex-direction:column;gap:0;background:var(--paper);padding:0 22px}.album.list .album-slot{border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:12px 50px 12px 0}.album.list .open-card{display:grid;grid-template-columns:52px minmax(0,1fr) 120px 120px;align-items:center;gap:18px}.album.list .art{height:68px;margin:0}.album.list strong{font-size:var(--text-data)}.album.list .card-number{font-size:var(--text-label)}.album.list .card-price{font-size:var(--text-body);text-align:right}.album.list .badge{position:static;margin-top:4px;width:fit-content}.album.list .save-small{top:25px;right:0}.empty-state{grid-column:1/-1;text-align:center;padding:70px 15px;color:var(--muted)}
footer{display:flex;align-items:center;gap:23px;padding:32px 0 36px;border-top:1px solid var(--line);font-size:var(--text-label);color:var(--muted)}footer img{width:160px}footer span{margin-left:auto}.report-heading{padding:38px 0 35px}.report-heading h1{font-size:38px;margin:10px 0 15px}.report-heading p{max-width:780px;color:var(--muted);line-height:var(--leading-normal)}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.comparison article{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--paper)}.comparison-label{padding:15px;display:flex;justify-content:space-between;font-size:var(--text-data)}.comparison-label span{color:var(--muted);font-size:var(--text-label)}.comparison img{width:100%;height:auto;display:block}.comparison-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:40px 0 54px}.comparison-notes h2,.comparison-notes h3{font-size:20px;margin:12px 0}.comparison-notes p{font-size:var(--text-data);color:var(--muted);line-height:var(--leading-normal)}.research-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.research-card{padding:26px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.research-card h2{font-size:22px;line-height:var(--leading-normal);margin:13px 0}.research-card p{font-size:var(--text-data);line-height:var(--leading-normal);color:var(--muted);margin-bottom:16px}.research-card a{font-size:var(--text-label);color:var(--link);text-decoration:underline;text-underline-offset:4px}.decision{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;font-size:var(--text-data);font-weight:500}.report-subtitle{margin:45px 0 22px;font-size:25px}.research-table{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--paper);margin-bottom:25px}.research-table table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--text-data);line-height:var(--leading-normal);min-width:620px}.research-table td,.research-table th{padding:17px 20px;border-bottom:1px solid var(--line);vertical-align:top}.research-table th{background:var(--panel);font-size:var(--text-label)}.research-table td:first-child{min-width:180px;font-weight:500}.research-table a{color:var(--link)}#research-view{padding-bottom:40px}
dialog{padding:38px;max-width:760px;width:calc(100% - 40px);border:1px solid var(--line);border-radius:17px;background:var(--bg);color:var(--ink);max-height:90svh;overflow:auto}dialog::backdrop{background:color-mix(in srgb,var(--ink) 55%,transparent);backdrop-filter:blur(7px)}.dialog-close{position:absolute;top:12px;right:12px;z-index:2}.detail{display:grid;grid-template-columns:230px minmax(0,1fr);gap:32px;align-items:center}.detail>img{width:230px;max-height:350px;object-fit:contain}.detail h2{font-size:27px;margin:15px 0 10px}.detail .amount{font-size:35px;letter-spacing:var(--tracking-display);font-weight:600;margin:15px 0}.detail .primary{margin-top:16px;width:100%;gap:8px}.detail .live-link{display:block;color:var(--link);font-size:var(--text-label);margin-top:15px}.detail .quiet{display:block}.guide-title{font-size:27px;margin-bottom:15px}.guide-row{display:grid;grid-template-columns:65px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:var(--text-data)}.guide-row b{font-family:var(--font-sans)}.guide-note{font-size:var(--text-data);line-height:var(--leading-normal);color:var(--muted);margin-top:18px}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);border-radius:8px;background:var(--ink);color:var(--paper);padding:12px 22px;font-size:var(--text-data);opacity:0;pointer-events:none;z-index:50;transition:opacity var(--motion-fast),transform var(--motion-fast);max-width:90vw;width:max-content}#toast.visible{opacity:1;transform:translate(-50%,0)}
@media(hover:hover) and (pointer:fine){.rarity-shelf:hover .shelf-art img{transform:translateX(calc(-50% + var(--i)*49px)) translateY(-5px) rotate(calc(var(--i)*11deg))}.fan-card:not([aria-pressed=true]):hover{filter:drop-shadow(0 13px 8px color-mix(in srgb,var(--ink) 22%,transparent));transform:translateX(calc(-50% + var(--offset)*98px)) translateY(calc(var(--distance)*15px - 10px)) rotate(calc(var(--offset)*10deg)) scale(.89)}.primary:hover{filter:brightness(1.03)}.album-slot:hover{background:color-mix(in srgb,var(--paper) 80%,transparent)}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.review-note{display:none}.showcase{grid-template-columns:260px minmax(0,1fr);padding:24px}.fan-card{width:153px;transform:translateX(calc(-50% + var(--offset)*70px)) translateY(calc(var(--distance)*15px)) rotate(calc(var(--offset)*10deg)) scale(.86)}.fan-card[aria-pressed=true]{transform:translateX(-50%) translateY(0) scale(1.12)}.fan{height:260px}.showcase{min-height:370px}.spotlight-info h3{font-size:25px}.spotlight-price{font-size:34px}.rank-strip button{padding:12px 9px;gap:7px}.shelf-art img{width:80px;height:112px;transform:translateX(calc(-50% + var(--i)*30px)) rotate(calc(var(--i)*9deg))}.shelf-art{height:154px}.album{padding:21px;gap:16px}.album-slot .art{height:175px}.album-slot{padding:13px 10px}.research-grid{gap:12px}.research-card{padding:20px}}
@media(max-width:760px){html{scroll-padding-top:20px}.wrap{width:calc(100% - 36px)}.review-bar{padding:8px 14px;gap:8px;flex-wrap:wrap}.review-label{font-size:var(--text-label)}.review-bar select{margin-left:auto;max-width:180px}.review-modes{order:3;flex-basis:100%;display:grid;grid-template-columns:repeat(3,1fr)}.review-modes button{padding:7px 4px;font-size:var(--text-label);min-height:44px}.site-header{height:77px;gap:30px}.logo{width:146px}.site-header nav{font-size:var(--text-label);gap:0}.site-header nav .how{display:none}.site-header .active:after{bottom:14px}.header-right{font-size:var(--text-label);gap:8px}.set-intro{min-height:105px;padding-bottom:15px;gap:10px}.set-intro h1{font-size:31px;margin:5px 0 10px}.set-intro .eyebrow{font-size:var(--text-label)}.set-meta{font-size:var(--text-label);gap:4px 10px;max-width:245px}.set-meta .release{display:none}#pack-art{width:74px;height:99px;margin:0}.section-nav{gap:21px;font-size:var(--text-label);margin-bottom:27px}.section-nav a{min-height:44px;padding:10px 0;white-space:nowrap}.section-nav button{font-size:var(--text-label);min-height:44px;white-space:nowrap}.section-nav button span{margin-left:3px}.section-heading{gap:8px;margin-bottom:17px;align-items:center}.section-heading h2{font-size:22px}.eyebrow{font-size:var(--text-label)}.section-heading>.quiet{font-size:var(--text-label);max-width:90px;text-align:right}.showcase{display:flex;flex-direction:column-reverse;padding:22px 20px 25px;gap:20px;border-radius:13px}.fan-area{width:100%;padding-top:5px}.fan{height:238px}.fan-card{width:142px;top:12px;transform:translateX(calc(-50% + var(--offset)*47px)) translateY(calc(var(--distance)*13px)) rotate(calc(var(--offset)*11deg)) scale(.81)}.fan-card[aria-pressed=true]{transform:translateX(-50%) translateY(-1px) scale(1.08)}.fan-controls{margin-top:5px;gap:24px}.fan-hint{display:none}.spotlight-info{width:100%;position:relative;border-top:1px solid var(--line);padding-top:18px;display:grid;grid-template-columns:1fr auto;column-gap:10px;align-items:center}.spotlight-rank{position:absolute;right:0;top:23px;margin:0;flex-direction:column;gap:3px;font-size:var(--text-label)}.spotlight-rank>span:first-child{font-size:29px}.spotlight-badges{grid-column:1; margin-bottom:7px}.spotlight-info h3{grid-column:1;font-size:23px;padding-right:30px;margin-bottom:4px}.spotlight-info>#spotlight-number{grid-column:1;font-size:var(--text-label)}.spotlight-price{grid-column:1;font-size:32px;margin-top:10px}.price-caption{grid-column:1;font-size:var(--text-label)}.spotlight-actions{grid-column:1/-1;margin-top:18px}.spotlight-actions .primary{flex:1}.rank-strip{grid-template-columns:repeat(5,minmax(0,1fr));margin-top:10px;overflow:hidden}.rank-strip button{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:8px 4px;text-align:center;height:76px;min-height:76px}.rank-strip .rank{font-size:var(--text-label)}.rank-strip .rank-summary{display:flex;flex:1;flex-direction:column;width:100%;gap:4px}.rank-strip strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:var(--leading-snug);font-size:var(--text-label);min-height:0;margin:0}.rank-strip .rank-summary small{margin-top:0;font-size:var(--text-label);line-height:var(--leading-snug);letter-spacing:var(--tracking-display);white-space:nowrap}.rank-strip small{font-size:var(--text-label);margin-top:0}.highlight-section{margin-bottom:42px}.rarity-shelves{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.rarity-shelf{padding:14px 11px 12px}.shelf-title b{font-size:22px}.shelf-title span,.shelf-name{font-size:var(--text-label)}.shelf-art{height:140px}.shelf-art img{width:78px;height:109px;transform:translateX(calc(-50% + var(--i)*26px)) rotate(calc(var(--i)*9deg))}.all-rarities{gap:7px;margin:14px 0 10px}.all-rarities button{font-size:var(--text-label);padding:8px 10px;min-height:44px}.all-rarities button span{margin-left:6px}.section-footnote{font-size:var(--text-label)}.rarity-section{margin-bottom:40px}.text-button{font-size:var(--text-label)}.collection-section h2>span{font-size:var(--text-h3)}.view-switch button{padding:7px 12px;min-height:38px}.filter-row{gap:8px;margin-top:15px}.search-label{flex-basis:100%;min-width:0}.search-label input{font-size:var(--text-body)}.filter-row select,.filter-row>button{font-size:var(--text-label);padding:8px 10px;height:44px}.filter-row>label:not(.search-label){flex:1}.filter-row select{width:100%}.album{grid-template-columns:repeat(2,minmax(0,1fr));padding:13px 11px;gap:13px 14px;background:linear-gradient(90deg,var(--panel) 49%,var(--line) 49.7%,var(--paper) 50%,var(--panel) 50.8%)}.album-slot{padding:12px 8px 10px}.album-slot .art{height:clamp(145px,43vw,245px);margin-bottom:9px}.album-slot strong{font-size:var(--text-label)}.album-slot .card-number{font-size:var(--text-label)}.album-slot .card-price{font-size:var(--text-data)}.badge{font-size:var(--text-label);min-height:21px;padding:1px 6px}.album-slot .badge{top:5px;left:4px}.save-small{top:1px;right:1px}.album.list{padding:0 12px}.album.list .open-card{grid-template-columns:42px minmax(0,1fr) 70px;gap:11px}.album.list .open-card>.card-number{display:none}.album.list strong{font-size:var(--text-label)}.album.list .card-price{font-size:var(--text-label)}.album.list .album-slot{padding-right:39px}.album.list .save-small{right:-8px}.album.list .art{height:60px}.pagination{gap:20px}.pagination button{padding:9px 12px}.report-heading{padding:23px 0}.report-heading h1{font-size:29px}.report-heading p{font-size:var(--text-data)}.comparison{grid-template-columns:1fr;gap:20px}.comparison-notes,.research-grid{grid-template-columns:1fr;gap:22px}.comparison-notes{margin:28px 0 40px}.research-card h2{font-size:22px}.report-subtitle{font-size:23px}.comparison-label{font-size:var(--text-data)}.detail{grid-template-columns:1fr;gap:21px}.detail>img{width:175px;max-height:260px;margin:auto}.detail h2{font-size:25px}.detail .amount{font-size:32px}dialog{padding:32px 24px}.detail .primary{min-height:46px}footer{flex-wrap:wrap;gap:14px}footer p{font-size:var(--text-label)}footer span{margin:0;font-size:var(--text-label)}footer img{width:146px}}
@media(max-width:359px){.wrap{width:calc(100% - 28px)}.site-header{gap:20px}.header-right{font-size:var(--text-label)}.section-nav{gap:13px;font-size:var(--text-label)}.section-nav button{font-size:var(--text-label)}.fan-card{width:126px;transform:translateX(calc(-50% + var(--offset)*40px)) translateY(calc(var(--distance)*14px)) rotate(calc(var(--offset)*11deg)) scale(.8)}.fan{height:217px}.showcase{padding:20px 14px}.spotlight-info h3{font-size:21px}.section-heading h2{font-size:20px}.rank-strip small{font-size:var(--text-label)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* The mobile highlight keeps the card and its price in the same first content view. */
@media(max-width:760px){.showcase{flex-direction:column}.spotlight-info{border-top:0;padding-top:0}.fan-area{border-top:1px solid var(--line);padding-top:12px}.fan{height:215px}.fan-card{width:130px}.fan-controls{margin-top:0}.showcase{gap:12px;padding-top:17px}.spotlight-info{padding-top:13px}.spotlight-rank{top:18px}.spotlight-price{margin-top:7px}.section-nav{gap:16px}.rank-strip small{letter-spacing:var(--tracking-display)}.eyebrow{font-size:var(--text-label)}.fan-hint{font-size:var(--text-label)}}
.rarity-shelf{overflow:hidden}@media(max-width:760px){.section-heading>#price-basis{white-space:nowrap;max-width:none;font-size:var(--text-label)}.highlight-section>.section-heading{align-items:start;flex-direction:column;gap:7px}.highlight-section>.section-heading>#price-basis{text-align:left}}
/* Set identity, editorial introduction and labeled collection facts. */
.set-intro{position:relative;isolation:isolate;overflow:visible;min-height:290px;padding:30px 40px 28px;margin:12px 0 26px;border:1px solid var(--white);border-radius:16px;background:linear-gradient(110deg,var(--paper) 35%,var(--panel));align-items:center}
.set-intro .intro-copy{position:relative;z-index:2;width:calc(100% - 290px)}
.set-intro .eyebrow{display:flex;align-items:center;gap:12px;font-size:var(--text-label);letter-spacing:var(--tracking-kicker);color:var(--muted)}
.game-label{display:flex;align-items:center;gap:8px}.game-label:before{content:'';width:5px;height:15px;border-radius:2px;background:var(--mint)}
.edition-label{padding:3px 7px;border:1px solid var(--line);border-radius:4px;font-size:var(--text-label);background:var(--white)}
.set-intro h1{font-size:52px;line-height:var(--leading-snug);letter-spacing:var(--tracking-display);margin:15px 0 10px}
.set-code{display:inline-flex;align-items:center;gap:8px;font:600 var(--text-data)/1.4 var(--font-sans);letter-spacing:var(--tracking-kicker);color:var(--ink)}
.set-code>span{font-size:var(--text-label);letter-spacing:var(--tracking-kicker);font-weight:500;padding:3px 5px;border:1px solid var(--line);border-radius:3px;color:var(--muted)}
.set-intro .set-meta{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:350px;margin:25px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.set-meta>div{padding:0 22px;border-left:1px solid var(--line)}.set-meta>div:first-child{padding-left:0;border:0}.set-meta dt{font-size:var(--text-label);color:var(--muted);margin-bottom:6px;white-space:nowrap}.set-meta dd{margin:0;color:var(--ink);font:500 27px/1.2 var(--font-sans);letter-spacing:var(--tracking-display);font-variant-numeric:tabular-nums}.set-meta dd small{font-size:var(--text-label);margin-left:5px;color:var(--muted);font-weight:400}.set-meta .meta-release dd{font-size:var(--text-h3);letter-spacing:0;padding-top:7px}
.set-intro #pack-art{position:absolute;z-index:3;right:35px;top:50%;width:265px;height:290px;max-width:none;margin:0;object-fit:contain;transform:translateY(-50%);opacity:1;pointer-events:none;user-select:none;mix-blend-mode:normal}
@media(max-width:1000px){.set-intro{padding:28px}.set-intro .intro-copy{width:calc(100% - 220px)}.set-intro #pack-art{width:230px;height:265px;right:5px}.set-intro h1{font-size:44px}.set-meta>div{padding:0 14px}}
@media(max-width:760px){.set-intro{padding:24px 20px;min-height:0;margin:10px 0 22px;display:block}.set-intro .intro-copy{width:100%}.intro-heading{width:60%;min-height:170px}.set-intro h1{font-size:33px;margin:15px 0 12px}.set-intro .eyebrow{align-items:flex-start;flex-direction:column;gap:8px;font-size:var(--text-label)}.game-label{gap:6px}.edition-label{font-size:var(--text-label);padding:2px 6px}.set-code{font-size:var(--text-label)}.set-intro #pack-art{width:153px;height:210px;right:-4px;top:104px;transform:translateY(-50%)}.set-intro .set-meta{max-width:none;grid-template-columns:1fr 1fr;margin:12px 0 0;padding-top:16px}.set-meta>div{padding:0 12px}.set-meta dt{font-size:var(--text-label)}.set-meta dd{font-size:25px}.set-meta dd small{font-size:var(--text-label);margin-left:3px}.set-meta .meta-release dd{font-size:var(--text-data);padding-top:9px;white-space:nowrap}}
@media(max-width:359px){.set-intro{padding:22px 15px}.intro-heading{width:61%}.set-intro h1{font-size:29px}.set-intro #pack-art{width:125px;height:190px;right:-4px;top:108px}.set-meta>div{padding:0 8px}.set-meta .meta-release dd{font-size:var(--text-label)}.set-meta dd{font-size:23px}.set-meta dt{font-size:var(--text-label)}}
/* Rarity selectors: stable alignment, distinct counts and persistent selection. */
.all-rarities button{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;transition:background var(--motion-fast)}
.all-rarities button b{font-weight:600;letter-spacing:var(--tracking-kicker)}
.all-rarities button span{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 4px;margin-left:0;border-radius:4px;background:var(--panel);font-size:var(--text-label);font-variant-numeric:tabular-nums}
.all-rarities button[aria-pressed=true]{background:var(--color-brand-action-fill);border-color:var(--line);box-shadow:none;color:var(--color-brand-action-on);}
.all-rarities button[aria-pressed=true] b{color:inherit}
@media(max-width:760px){
.all-rarities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0 10px}
.all-rarities button{min-width:0;min-height:46px;padding:7px 7px;gap:3px;border-radius:7px;font-size:var(--text-label)}
.all-rarities button span{margin-left:0;min-width:19px;height:21px;padding:0 3px;font-size:var(--text-label)}
}
@media(max-width:359px){.all-rarities button{padding:7px 5px;font-size:var(--text-label)}.all-rarities button span{min-width:17px;padding:0 2px}}
/* Shared control treatment; approved button radius/spacing/focus values. */
:root{--control-radius:10px;--control-height:44px;--control-focus:var(--set-focus)}
.ui-icon{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.ui-select{position:relative;min-width:0;display:block}
.select-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;height:var(--control-height);min-height:var(--control-height);padding:0 12px;border:1px solid var(--line);border-radius:var(--control-radius);background:var(--paper);font-size:var(--text-data);text-align:left;box-shadow:none}
.select-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.select-trigger>.ui-icon{color:var(--muted);margin:0}
.select-trigger[aria-expanded=true]>.ui-icon{transform:rotate(180deg)}
.select-trigger:hover:not(:disabled){background:var(--panel)}
.select-menu{position:fixed;inset:auto;margin:0;padding:4px;overflow-y:auto;overscroll-behavior:contain;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:var(--control-radius);box-shadow:none;min-width:0}
.select-menu:popover-open{display:flex;flex-direction:column;gap:0}
.select-menu>button{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;min-height:44px;padding:10px 12px;border-radius:6px;text-align:left;font-size:var(--text-data);line-height:var(--leading-normal);color:var(--ink);background:var(--paper);box-shadow:none}
.select-menu>button>span:first-child{min-width:0;overflow-wrap:anywhere}.option-check{display:flex;width:18px;flex-shrink:0}
.select-menu>button[aria-selected=true]{background:var(--panel);font-weight:600}
.select-menu>button:hover{background:var(--panel)}
.select-menu>button:focus-visible{outline:2px solid var(--control-focus);outline-offset:-2px}
button:focus-visible,a:focus-visible,input:focus-visible{outline-color:var(--control-focus)}
.review-bar>.ui-select{width:180px;flex-shrink:0}.review-bar .select-trigger{font-size:var(--text-label);background:var(--bg)}
.header-right{gap:0}.header-right .ui-select{width:120px}.header-right .select-trigger{background:transparent;border-color:transparent}
.filter-row{align-items:center;gap:8px}.filter-row>label:not(.search-label){min-width:0}.filter-row .ui-select{min-width:152px}
.search-label{height:44px;min-height:44px;border:1px solid var(--line);border-radius:var(--control-radius);padding:0 0 0 12px;gap:8px;background:var(--paper);box-shadow:none}
.search-label>svg{width:18px;height:18px;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--muted);flex-shrink:0}
.search-label input{height:42px;font-size:var(--text-data);padding:0;outline:none;min-width:0;width:100%;flex:1}
.search-label input::-webkit-search-cancel-button{-webkit-appearance:none}.search-label:focus-within{outline:3px solid var(--control-focus);outline-offset:4px;box-shadow:none}
.search-label input:focus-visible{outline:none}
#clear-search{display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:44px;height:42px;color:var(--muted);border-radius:0 var(--control-radius) var(--control-radius) 0}
#clear-search:hover{background:var(--panel)}
.filter-row>#saved-filter{height:44px;min-height:44px;border-radius:var(--control-radius);padding:0 12px;font-size:var(--text-data);box-shadow:none}
.primary,.pagination button{border-radius:var(--control-radius);min-height:44px}
.view-switch{border-radius:var(--control-radius);padding:4px;box-shadow:none}.view-switch button{min-height:36px;padding:6px 12px;box-shadow:none!important}.view-switch button[aria-pressed=true]{background:var(--paper)}
.text-button{min-height:44px;display:inline-flex;align-items:center;gap:8px}
.dialog-close .ui-icon,.fan-controls .ui-icon{width:18px;height:18px}
@media(max-width:760px){
.review-bar>.ui-select{margin-left:auto;width:165px}.site-header{gap:20px}.header-right .ui-select{width:94px}.header-right .select-trigger{font-size:var(--text-label);padding:0 4px;gap:8px}
.filter-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px}.search-label{grid-column:1/-1;width:100%}.search-label input{font-size:var(--text-body)}.filter-row .ui-select{min-width:0;width:100%}.filter-row .select-trigger{font-size:var(--text-label);padding:0 10px;gap:8px}.filter-row>#saved-filter{font-size:var(--text-label);padding:0 10px}.section-heading .text-button{flex-shrink:0}
}
@media(max-width:359px){.site-header{gap:12px}.site-header .logo{width:132px}.header-right .ui-select{width:82px}.header-right .select-trigger{gap:4px}.filter-row{gap:6px}.filter-row .select-trigger{padding:0 8px;gap:4px}.filter-row>#saved-filter{padding:0 8px}}
.select-menu{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.search-label input{min-height:42px}.pagination button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.filter-row>#saved-filter[aria-pressed=true]{border-color:var(--line)}
/* A single collection owns its rarity filters, search and results. */
.collection-section .section-heading{margin-bottom:16px}
.collection-section #collection-label{font-size:inherit;color:inherit;font-weight:inherit}
.collection-filters{border-top:1px solid var(--line);padding-top:12px}
.collection-filters .all-rarities{margin:4px 0 16px}
.collection-filters .filter-row{margin-top:0}
.collection-filters .album-status{margin-bottom:12px}
.rarity-section>.section-footnote{margin-top:12px}
@media(max-width:760px){.collection-filters .filter-row{grid-template-columns:minmax(0,1fr) auto}.collection-filters .search-label{grid-column:1/-1}.collection-filters .all-rarities{margin-bottom:12px}}
.collection-section .view-switch{flex-shrink:0}.view-switch button{white-space:nowrap}.collection-section .section-heading>div:first-child{min-width:0}
@media(max-width:760px){.collection-filters .all-rarities{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:0}}
/* Market table: price, percentage and sparkline each have their own column. */
.album.list{display:block;min-height:0;padding:0 16px;background:var(--paper);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.comparison-list{width:100%;border-collapse:collapse;table-layout:fixed;font-size:var(--text-data)}
.comparison-list th{text-align:left;height:44px;font-size:var(--text-label);font-weight:500;color:var(--muted);border-bottom:1px solid var(--line);white-space:nowrap}
.comparison-list td{height:64px;padding:6px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.comparison-list tbody tr:last-child td{border-bottom:0}
.comparison-list .list-number{width:76px;color:var(--muted);font-variant-numeric:tabular-nums}
.comparison-list .list-grade{width:68px;text-align:center}
.comparison-list .list-price{width:114px;text-align:right;font-variant-numeric:tabular-nums}
.comparison-list td.list-price{font-weight:600}
.comparison-list .list-change{width:100px;text-align:right;font-variant-numeric:tabular-nums}
.comparison-list .list-trend{width:160px;text-align:right;padding-left:28px;padding-right:12px}
.comparison-list .list-save{width:52px;text-align:center;padding-left:0;padding-right:0}
.list-card{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;text-align:left;padding:0 12px 0 0}
.list-card img{width:32px;height:45px;object-fit:contain;flex-shrink:0}.list-card>span{min-width:0}
.list-card strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--text-data);font-weight:500}
.comparison-list .mobile-number{display:none}.comparison-list .badge{position:static;margin:0;font-size:var(--text-label)}
.list-save-button{display:flex;align-items:center;justify-content:center;margin-inline:auto;width:44px;height:44px;border-radius:10px}
.list-save-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}.list-save-button[aria-pressed=true]{background:var(--color-brand-action-fill);color:var(--color-brand-action-on);}.list-save-button[aria-pressed=true] svg{fill:currentColor}
.trend-link{display:flex;align-items:center;justify-content:center;width:120px;max-width:100%;min-height:44px;margin-left:auto;color:var(--link)}
.sparkline{display:block;width:100%;height:36px}.spark-path{stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.trend-empty{display:block;text-align:center;color:var(--muted)}
.list-note{font-size:var(--text-label);color:var(--muted);padding:12px 0;border-top:1px solid var(--line)}
@media(hover:hover){.comparison-list tbody tr:hover{background:var(--bg)}}
@media(min-width:761px) and (max-width:1000px){.comparison-list .list-number{width:64px}.comparison-list .list-grade{width:52px}.comparison-list .list-price{width:94px}.comparison-list .list-change{width:80px}.comparison-list .list-trend{width:126px;padding-left:16px;padding-right:8px}}
@media(max-width:760px){
.album.list{padding:0 10px}.comparison-list thead,.comparison-list tbody{display:block}
.comparison-list tr{display:grid;grid-template-columns:minmax(0,1fr) 80px 44px;column-gap:8px}
.comparison-list thead tr{border-bottom:1px solid var(--line)}
.comparison-list tbody tr{padding:10px 0;border-bottom:1px solid var(--line);row-gap:2px}
.comparison-list tbody tr:last-child{border-bottom:0}
.comparison-list th,.comparison-list td{width:auto!important;border:0;height:auto;padding:0;min-width:0}
.comparison-list th{height:36px;display:flex;align-items:center}
.comparison-list .list-number,.comparison-list .list-grade{display:none}
.comparison-list .list-identity{grid-column:1;grid-row:1}
.comparison-list .list-price{grid-column:2;grid-row:1;align-self:center;justify-content:flex-end;font-size:var(--text-label)}
.comparison-list .list-save{grid-column:3;grid-row:1;align-self:center;justify-content:center}
.comparison-list thead .list-change,.comparison-list thead .list-trend{display:none}
.comparison-list td.list-trend{grid-column:1;grid-row:2;padding:0;align-self:center}
.comparison-list td.list-change{grid-column:2;grid-row:2;align-self:center;font-size:var(--text-label)}
.list-card{padding:0;min-height:38px;gap:0}.list-card img{display:none}.list-card strong{font-size:var(--text-label);line-height:var(--leading-snug)}
.comparison-list .mobile-number{display:flex;align-items:center;gap:8px;margin-top:2px;color:var(--muted);font-size:var(--text-label)}
.mobile-grade{color:var(--ink);font-size:var(--text-label)}
.trend-link{margin:0;width:108px;min-height:24px}.sparkline{height:24px}
.trend-empty{text-align:left;padding-left:4px}.list-save-button svg{width:16px;height:16px}
}
.mobile-th-extra{display:none}@media(max-width:760px){.mobile-th-extra{display:inline}.comparison-list th{font-size:var(--text-label)}}
#load-status{padding:80px 0}.header-right{align-items:center}.header-right .ui-select{width:94px}.site-header .acm-end .header-right{margin-left:0}
@media(max-width:760px){.section-nav{flex-wrap:wrap;gap:8px 14px}.section-nav #saved-shortcut{margin-left:0}.rarity-section .section-heading{align-items:flex-start;flex-wrap:wrap;gap:6px}.rarity-section .section-heading .text-button{min-height:32px}}
/* Light travels over stationary highlight cards without moving the artwork. */
.fan-card{isolation:isolate}
.fan-card:has(img)::before,.fan-card:has(img)::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background-size:220% 160%;animation:fan-foil-sweep var(--motion-foil-sweep) ease-in-out infinite alternate;animation-delay:calc(var(--offset)* -1 * var(--motion-foil-sweep)/5)}
.fan-card::before{background-image:linear-gradient(112deg,transparent 8%,var(--brand-foil-cyan) 23%,var(--brand-foil-violet) 35%,var(--brand-foil-pink) 46%,var(--brand-foil-gold) 56%,var(--brand-foil-green) 67%,var(--brand-foil-blue) 78%,transparent 94%);mix-blend-mode:hard-light;opacity:.32}
.fan-card::after{background-image:linear-gradient(115deg,transparent 32%,var(--brand-foil-light-cyan) 39%,var(--brand-foil-light-white) 47%,var(--brand-foil-light-soft) 50%,transparent 64%);mix-blend-mode:screen;opacity:.18}
.fan-card[aria-pressed=true]::before{opacity:.43}
.fan-card[aria-pressed=true]::after{opacity:.24}
@keyframes fan-foil-sweep{from{background-position:15% 35%}to{background-position:85% 65%}}
@media(prefers-reduced-motion:reduce){.fan-card:has(img)::before,.fan-card:has(img)::after{animation:none;background-position:45% 50%}}
/* Keep the entire fan inside the mobile showcase, including rotated corners. */
@media(max-width:700px){
.fan-area{container-type:inline-size}
.fan{height:clamp(180px,72cqw,230px)}
.fan-card,.fan-card:not([aria-pressed=true]):hover{width:min(130px,40cqw);top:12px;transform:translateX(calc(-50% + var(--offset)*8cqw)) translateY(calc(var(--distance)*12px)) rotate(calc(var(--offset)*8deg)) scale(.8)}
.fan-card[aria-pressed=true]{transform:translateX(-50%) translateY(-1px) rotate(0deg) scale(1.08)}
}
/* Server card index (deploy/front-auth/pages.py): every card of the set as a link — the album above is drawn by JS. */
.set-catalog{margin:var(--space-10) 0 var(--space-9);border-top:1px solid var(--line);padding-top:var(--space-7)}.set-catalog h2{font-size:18px;margin:0 0 var(--space-3)}.set-catalog h2 span{color:var(--muted);font-weight:500}.set-catalog .summary{margin:0 0 var(--space-5);color:var(--muted);font-size:14px;line-height:1.6}.set-card-links{list-style:none;margin:0;padding:0;columns:4 200px;column-gap:var(--space-7);font-size:13px}.set-card-links li{break-inside:avoid}.set-card-links a{display:block;padding:var(--space-2) 0;color:var(--ink)}.set-card-links a:hover{color:var(--link)}@media(max-width:760px){.set-card-links{columns:2 140px}.set-card-links a{min-height:44px;display:flex;align-items:center}}
#concept-view.pending>:not(.breadcrumb):not(.set-intro){display:none}#concept-view.pending #pack-art{display:none}
/* 불러오는 동안 화면 높이를 잡아 둔다 — 앨범 · 대표 카드가 나타나며 아래 서버 글(카드 목록 · 표 · 묻고 답하기)을 화면 밖으로 밀던 CLS(320px 0.22, SEO3 2026-10-18).
스크립트 없는 화면 · 불러오기 실패(.failed)는 그대로 */
@media (scripting:enabled){#concept-view.pending:not(.failed){min-height:100vh}}
/* 카드가 들어와도 바닥이 첫 화면 안에서 밀리지 않게 본문 자리를 먼저 잡는다 */
main#main.wrap{min-height:100vh;min-height:100svh}
/* FIXES-2b #3 · #9 · #10 · #11 — title by words, the share button under it on a phone; a shorter first phone screen; 44px targets */
.set-intro h1{word-break:keep-all;overflow-wrap:anywhere}
.view-switch button{min-height:44px}
.search-label{height:auto;min-height:46px}.search-label input{height:44px;min-height:44px}
@media(max-width:760px){
.intro-heading{width:calc(100% - 104px);min-height:0}
.set-intro .page-title{flex-wrap:wrap;row-gap:8px}.set-intro .page-title>h1{flex-basis:100%}
.set-intro #pack-art{width:96px;height:132px;top:20px;right:8px;transform:none}
.set-intro .set-meta{display:flex;flex-wrap:wrap;gap:4px 16px;padding-top:12px}
.set-meta>div,.set-meta>div:first-child{display:flex;align-items:baseline;gap:6px;padding:0;border:0}
.set-meta dt{margin:0}.set-meta dd,.set-meta .meta-release dd{font-size:var(--text-data);padding:0}
.collection-filters .all-rarities{display:flex;overflow-x:auto;scrollbar-width:none}.collection-filters .all-rarities button{flex:none;min-width:76px}
.section-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.section-nav>*{flex:none;white-space:nowrap}
.rarity-section .section-heading .text-button{min-height:44px}
.comparison-list tr{grid-template-columns:minmax(0,1fr) 56px 80px 44px}
.comparison-list .list-identity{grid-column:1;grid-row:1/3}.comparison-list td.list-trend{grid-column:2;grid-row:1/3}
.comparison-list .list-price{grid-column:3;grid-row:1;align-self:end}.comparison-list td.list-change{grid-column:3;grid-row:2;align-self:start;text-align:right}
.comparison-list .list-save{grid-column:4;grid-row:1/3}.trend-link{width:56px}
}
/* 판 배지(8번 · 2026-10-17) — 희귀도 배지 자리(absolute)와 겹치지 않게 가격 옆에 */.album-slot .card-price .badge.print-run,.list-price .badge.print-run{position:static;margin-left:6px;vertical-align:middle}.spotlight-price .badge.print-run{margin-left:10px;vertical-align:middle}
/* 세트 FAQ(SEO1 2026-10-18): 데이터로 답한 질문 — 격자 칸을 넓히지 않게(긴 영문 세트 이름 + 일본어 · ja 320px 넘침) */
.set-faq{min-width:0;max-width:100%;overflow-wrap:anywhere;margin:var(--space-9) 0 0}.set-faq h2{font-size:18px;margin:0 0 var(--space-3)}.set-faq h3{margin:var(--space-4) 0 var(--space-1);font-size:15px}.set-faq p{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.set-table-box{margin:var(--space-7) 0 0;min-width:0}.set-table-box>summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center}.set-table-box .set-table{overflow-x:auto}.set-table-box .set-table table{width:100%;border-collapse:collapse;font-size:13px}.set-table-box .set-table caption{text-align:left;font-weight:600;margin:0 0 var(--space-2)}.set-table-box .set-table :is(th,td){padding:6px 4px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
/* A set with no registered cards is not an unsuccessful filter search. */
.redesign-catalog #album.empty-set{display:block;min-height:0;padding:0;background:none;border:0;border-radius:12px;box-shadow:none}
.redesign-catalog #album.empty-set .empty-state{display:flex;align-items:flex-start;gap:12px;padding:16px;text-align:left;color:var(--color-text);font-size:16px;line-height:24px}
.redesign-catalog #album.empty-set .empty-state img{flex:0 0 24px}
.redesign-catalog #album.empty-set .empty-state strong{font-weight:600}
.redesign-catalog #collection .catalog-sort-chips button:disabled{cursor:default;opacity:.4}
.redesign-catalog #collection .catalog-sort-chips[data-empty=true] .catalog-filter-toggle{display:none}
/* /css/join-band.css */
/* 가입 개선 B#3 band (site/js/join-band.js) — card · set pages, signed-out only. Design tokens only. */
.join-band{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);margin:var(--space-3) 0;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);color:var(--color-text);font-size:var(--text-data)}
.join-band b{font-weight:var(--weight-semibold);white-space:nowrap}
.join-band ul{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-3);flex:1 1 220px;min-width:0;margin:0;padding:0;list-style:none;color:var(--color-text-muted)}
.join-band li{white-space:nowrap}
.join-band li::before{content:'✓';margin-right:var(--space-1);color:var(--color-text)}
.join-band .join-signin{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--space-4);border-radius:var(--radius-md);background:var(--color-brand-action-fill);color:var(--color-brand-action-on);font-weight:var(--weight-semibold);text-decoration:none;white-space:nowrap}
@media(max-width:480px){.join-band .join-signin{flex:1 1 100%}}
/* /css/scan-fab.css */
#scan-fab{position:fixed;right:max(28px,env(safe-area-inset-right));bottom:calc(28px + env(safe-area-inset-bottom));z-index:35;display:grid;place-items:center;width:58px;height:58px;border:1px solid color-mix(in srgb,var(--mint,var(--holo-aqua)) 65%,white);border-radius:50%;background:var(--mint,var(--holo-aqua));color:var(--ink);box-shadow:0 6px 22px color-mix(in srgb,var(--ink) 18%,transparent),inset 0 1px 0 color-mix(in srgb,white 55%,transparent);text-decoration:none}#scan-fab:hover{box-shadow:0 9px 26px color-mix(in srgb,var(--ink) 24%,transparent)}#scan-fab:focus-visible{outline:3px solid var(--ink);outline-offset:4px}@media(max-width:700px){#scan-fab{width:52px;height:52px;right:max(18px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){#scan-fab{transition:none}}
#scan-fab{background:var(--bg,var(--set-bg));border-color:color-mix(in srgb,var(--holo-aqua) 55%,var(--line,var(--set-line)));color:var(--ink)}#scan-fab .scan-brand{position:absolute;width:25px;height:34px;object-fit:contain;transform:rotate(12deg);pointer-events:none}
#scan-fab .scan-brand{display:block;isolation:isolate;mask:url('/assets/home-c/symbol.svg') center/contain no-repeat;-webkit-mask:url('/assets/home-c/symbol.svg') center/contain no-repeat}#scan-fab .scan-brand img{display:block;width:100%;height:100%;object-fit:contain}#scan-fab .scan-brand:after{content:'';position:absolute;inset:-55%;background:linear-gradient(115deg,transparent 26%,color-mix(in srgb,var(--holo-iris) 60%,transparent) 38%,color-mix(in srgb,var(--holo-aqua) 80%,transparent) 44%,white 49%,color-mix(in srgb,var(--holo-blossom) 80%,transparent) 54%,color-mix(in srgb,var(--holo-amber) 60%,transparent) 62%,transparent 73%);mix-blend-mode:screen;opacity:.75;animation:scan-holo var(--scan-holo-duration) var(--scan-holo-ease) infinite;pointer-events:none}#scan-fab{--scan-holo-duration:8.6s;--scan-float-duration:6.8s;--scan-holo-ease:cubic-bezier(.22,.61,.36,1);--scan-float-ease:cubic-bezier(.45,0,.55,1)}@keyframes scan-holo{0%,12%{transform:translateX(-55%) rotate(-8deg);opacity:0}28%{transform:translateX(-22%) rotate(-3deg);opacity:.12}40%{transform:translateX(-7%) rotate(2deg);opacity:.48}48%{transform:translateX(4%) rotate(5deg);opacity:.62}62%{transform:translateX(35%) rotate(9deg);opacity:.12}72%,100%{transform:translateX(65%) rotate(12deg);opacity:0}}#scan-fab{animation:scan-float var(--scan-float-duration) var(--scan-float-ease) infinite;transform-origin:center}@keyframes scan-float{0%,100%{transform:translateY(1px) rotate(-2deg)}28%{transform:translateY(-3px) rotate(3deg)}57%{transform:translateY(-1px) rotate(0deg)}78%{transform:translateY(2px) rotate(-3deg)}}@media(prefers-reduced-motion:reduce){#scan-fab .scan-brand:after{animation:none;transform:none;opacity:.2}}
@media(prefers-reduced-motion:reduce){#scan-fab .scan-brand{animation:none;transform:rotate(12deg)}}
@media(prefers-reduced-motion:reduce){#scan-fab{animation:none;transform:none}}
@media(max-width:700px){body:has(>#scan-fab){padding-bottom:calc(80px + env(safe-area-inset-bottom))}}
/* /css/global-header.css */
body>header.global-header{position:sticky;top:0;z-index:45;display:flex;align-items:center;justify-content:flex-start;gap:0;width:100%;max-width:none;height:64px;min-height:64px;margin:0;padding:0 max(24px,calc((100% - 1152px)/2));border:0;border-bottom:1px solid #dce5ea;background:rgba(243,246,248,.96);backdrop-filter:blur(14px);flex-wrap:nowrap}body>header.global-header>a{flex:none;display:flex;align-items:center}body>header.global-header>a:first-child img{display:block;width:160px;height:auto;max-width:none}body>header.global-header>nav{display:flex;align-items:center;align-self:stretch;gap:28px;height:100%;margin-left:auto;font-size:var(--text-data);font-weight:600}body>header.global-header>nav>a{display:flex;align-items:center;position:relative;height:100%;white-space:nowrap}body>header.global-header>nav>a.active:after{content:'';position:absolute;bottom:12px;left:0;right:0;height:2px;background:var(--mint)}body>header.global-header .acm-end{margin-left:32px}body>header.global-header .acm{align-self:center;align-items:center}body>header.global-header .acm-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent}body>header.global-header .acm-btn:hover{background:var(--panel,var(--bg))}body>header.global-header .acm-btn img{width:36px;height:36px}body>header.global-header .acm-btn svg{width:20px;height:20px}body>header.global-header .acm-menu{font-weight:400} @media(max-width:760px){body>header.global-header{height:56px;min-height:56px;padding:0 18px}body>header.global-header>a:first-child img{width:130px}body>header.global-header>nav{gap:14px;font-size:var(--text-label)}body>header.global-header>nav>a.how{display:flex}body>header.global-header .acm-end{margin-left:12px}body>header.global-header .acm-btn{width:40px;height:44px}body>header.global-header>nav>a.active:after{bottom:6px}}@media(max-width:360px){body>header.global-header>a:first-child img{width:112px}body>header.global-header>nav{gap:10px}}
@media(max-width:360px){body>header.global-header .acm-end{margin-left:8px}}
body>header.global-header>nav>a:is(.gnb-explore,.gnb-movers,.gnb-news){width:44px;justify-content:center}@media(max-width:360px){body>header.global-header>nav{gap:6px}body>header.global-header>nav>a:is(.gnb-explore,.gnb-movers,.gnb-news){width:32px}body>header.global-header .acm-btn{width:36px}}
body>header.global-header :is(.gnb-explore,.gnb-movers,.gnb-news) svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
:root{--site-content-width:1152px;--site-gutter:24px}
body>header.global-header{padding-inline:max(var(--site-gutter),calc((100% - var(--site-content-width))/2))}
body>main.wrap,body>footer.wrap{width:calc(100% - 2*var(--site-gutter));max-width:var(--site-content-width);margin-inline:auto}
body .journey>.viewport,body .journey>.how,body .journey>.questions,body>.brand-footer{max-width:calc(var(--site-content-width) + 2*var(--site-gutter));padding-inline:var(--site-gutter)}
@media(max-width:760px){:root{--site-gutter:18px}}
.legal-foot{width:calc(100% - 2*var(--site-gutter));max-width:var(--site-content-width);margin:0 auto;padding:0 0 28px;font-size:13px;color:var(--muted,#647c8d)}
.legal-foot nav{display:flex;flex-wrap:wrap;gap:0 20px}
.legal-foot a{display:inline-flex;align-items:center;min-height:44px;color:inherit;font-weight:600}
.legal-foot p{margin:0;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.legal-foot .biz{margin-top:6px}
p.biz,.biz span{font-family:system-ui,-apple-system,sans-serif}.biz span{display:inline-block}.biz span:not(:last-child)::after{content:" ·"}
body>header.global-header .gnb-label{display:none}@media(min-width:1024px){body>header.global-header>nav>a:is(.gnb-explore,.gnb-movers,.gnb-news){width:auto;gap:6px}body>header.global-header .gnb-label{display:inline}}
body>header.global-header>a:first-child{min-height:44px}body>header.global-header .acm-btn{width:44px;height:44px}
/* 375~400 휴대폰: 로그인 상단바(아이콘 3 + 계정)가 넘치지 않게 — 로고 · 간격만 줄이고 누르는 칸은 44px 그대로 */
@media(min-width:361px) and (max-width:400px){body>header.global-header>a:first-child img{width:112px}body>header.global-header>nav{gap:8px}body>header.global-header .acm-end{margin-left:8px}}
/* 바닥 · 같은 길 링크(로고 포함) 손가락 44px — 모든 화면 공통(2026-10-11 DOM 실측: 17~20px) */
body>footer a{display:inline-flex;align-items:center;min-height:44px}
/* Figma shared header: one width and menu order on every service screen. */
:root{--site-content-width:1184px;--site-gutter:16px}@media(min-width:1024px){:root{--site-gutter:48px}} /* 1024 이상 = max(48, (폭−1184)/2) — 125% 배율 노트북(CSS 1134)에서 왼쪽에 붙지 않게(대표 2026-10-23) */
body>header.global-header{background:color-mix(in srgb,var(--color-page-bg) 96%,transparent);padding-inline:max(var(--site-gutter),calc((100% - var(--site-content-width))/2))}
body>header.global-header>nav{gap:4px}
body>header.global-header>nav>a:is(.gnb-explore,.gnb-movers,.gnb-news,.gnb-my){min-width:44px;justify-content:center;gap:6px}
body>header.global-header>nav>a.active:after{bottom:0;left:0;right:0}
@media(min-width:1024px){body>header.global-header>nav{gap:24px}body>header.global-header .gnb-label{display:inline}body>header.global-header>nav>a{padding-inline:4px}}
@media(max-width:760px){body>header.global-header{padding-inline:16px}body>header.global-header>nav{gap:4px}body>header.global-header>a:first-child img{width:130px}}
@media(max-width:375px){body>header.global-header>a:first-child img{width:100px}}
body>header.global-header{color:var(--color-text)}body>header.global-header>nav>a{color:inherit;text-decoration:none}
/* Compact mobile gutters follow the approved 390px screens. */
@media(max-width:767px){:root{--site-gutter:8px}body>header.global-header{padding-inline:8px}}
@media(max-width:767px){html{scrollbar-width:none}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none}}
.gnb-profile-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:none}body.has-holo-pass .gnb-profile-icon:before{content:'';position:absolute;inset:-7px;border-radius:50%;padding:3.5px;background:conic-gradient(from 0deg,var(--icon-premium),var(--icon-market),var(--icon-library),var(--icon-interest),var(--icon-premium));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none}
/* /css/typography.css */
/* All customer pages share Plex and the canonical type scale. */
html { font-size: 100%; -webkit-text-size-adjust: 100%; }
body {
font-family: var(--font-sans);
font-size: var(--text-body);
line-height: var(--leading-normal);
letter-spacing: 0;
}
body :where(button, input, select, textarea, text) { font-family: var(--font-sans); }
body input:not([type=checkbox]):not([type=radio]), body textarea {
font-size: var(--text-body);
line-height: var(--leading-snug);
letter-spacing: 0;
}
body :where(h1, h2, h3) {
line-height: var(--leading-tight);
letter-spacing: var(--tracking-display);
font-weight: var(--weight-bold);
}
body .copy h1, body .story h1 { font-size: var(--text-display); }
body .intro h1, body .set-intro h1, body .stage-title h1,
body .my-welcome h1, body .acct h1 {
font-size: var(--text-hero);
line-height: var(--leading-tight);
letter-spacing: var(--tracking-display);
}
body .set-intro h1 { overflow-wrap: anywhere; }
body .section-heading h2, body .detail-copy h2, body .questions h2,
body .closing h2, body .history-head h2, body .settings-heading h2,
body .panel-title h2, body .detail-layout h2, body .story h2 {
font-size: var(--text-h2);
line-height: var(--leading-tight);
letter-spacing: var(--tracking-display);
}
body .set-intro h2, body .set-intro .compact-set-heading h2,
body .set-intro .desktop-set-heading h2 { font-size: var(--text-h2); line-height: var(--leading-tight); letter-spacing: var(--tracking-display); }
body .steps h3, body .spotlight-info h3, body .settings-panel h3,
body .answers h3, body .pack-tile h2, body .my-empty h3 {
font-size: var(--text-h3);
line-height: var(--leading-snug);
font-weight: var(--weight-semibold);
}
body .copy .intro, body .section-heading > p, body .steps p,
body .detail-copy p, body .answers p, body .closing p, body .story .description {
font-size: var(--text-body);
line-height: var(--leading-normal);
letter-spacing: 0;
}
body .intro > p, body .acct-legal, body .acct-note,
body .data-note, body .guide-note { font-size: var(--text-data); line-height: var(--leading-normal); }
body .cta, body .text-link, body .idp, body .btn,
body .collection-tabs button, body .control {
font-size: var(--text-data);
line-height: var(--leading-snug);
letter-spacing: 0;
font-weight: var(--weight-semibold);
}
body > header.global-header > nav { font-size: var(--text-data); line-height: var(--leading-snug); letter-spacing: 0; }
body .spotlight-price, body .value-summary .total-value strong,
body .stage .current-price, body .stage .attached-tag .current-price,
body .art .current-price, body .story .price strong {
font-size: var(--text-price);
font-weight: var(--weight-semibold);
line-height: var(--leading-tight);
letter-spacing: var(--tracking-display);
font-variant-numeric: tabular-nums;
}
body .stage .no-price, body .art .no-price { font-size: var(--text-body); font-weight: var(--weight-regular); }
body .album-slot strong, body .card-item strong, body .set-card strong,
body .my-card-link strong, body .discovery-info strong { font-size: var(--text-data); line-height: var(--leading-snug); }
body .album-slot .card-price, body .album.list .card-price,
body .card-item .card-price, body .my-table .value, body .set-card .card-price,
body .discovery-info b {
font-size: var(--text-body);
font-weight: var(--weight-semibold);
line-height: var(--leading-snug);
letter-spacing: 0;
font-variant-numeric: tabular-nums;
}
/* The 3D experience is an exported page; keep its type overrides here. */
body .story :where(.eyebrow, .stage-top, .object-caption, .counter, .price > div,
.price p, .example, .quiet, .detail-note > span, .detail-note p,
.scan-state small, .scroll-cue) {
font-family: var(--font-sans);
font-size: var(--text-label);
line-height: var(--leading-snug);
letter-spacing: var(--tracking-kicker);
}
body .story .object-caption span + span { font-size: var(--text-label); letter-spacing: 0; }
@media (max-width: 760px) {
body .history-head .periods { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; }
body .history-head .periods button { min-width:0; padding:8px 4px; }
body .set-intro .intro-heading { width: 55%; }
body .stage .tag-hanger > .attached-tag { width: 132px; }
body .stage .attached-tag .price-tag { min-height: 70px; }
}
@media (max-width: 360px) {
body .stage .tag-hanger > .attached-tag { width: 116px; }
body > header.global-header > a:first-child img { width: 100px; }
body > header.global-header > nav { margin-left: 8px; }
body > header.global-header .acm-end { margin-left: auto; }
}
/* /css/ui-system.css */
/* Service UI components. Values: docs/design/tokens/snapholo.tokens.json.
Opt in by class; cinematic home and card-stage typography are separate. */
.ui-page{box-sizing:border-box;width:calc(100% - 2 * var(--ui-gutter));max-width:var(--ui-page-max);margin:var(--space-6) auto 0;color:var(--color-text);font-family:var(--font-sans)}
.ui-page *{box-sizing:border-box}
.ui-page-title{font-size:var(--ui-page-size);line-height:var(--ui-page-line);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-display);margin:0 0 var(--space-6)}
.ui-section{margin-block:var(--ui-section-gap)}
.ui-section-label{font-size:var(--ui-support-size);line-height:var(--ui-support-line);font-weight:var(--weight-medium);color:var(--color-text-muted);margin:0 0 var(--ui-label-gap);padding-inline:var(--ui-group-padding)}
.ui-surface,.ui-menu-group,.ui-faq{background:var(--color-surface);border:0;border-radius:var(--ui-group-radius)}
.ui-menu-group{padding-block:var(--space-2);overflow:hidden}
.ui-menu-row{display:grid;grid-template-columns:var(--ui-icon-slot) minmax(0,1fr) auto;align-items:center;column-gap:var(--ui-icon-gap);min-height:var(--ui-row-compact);padding:var(--ui-row-pad-y) var(--ui-group-padding);color:inherit;text-decoration:none;transition:background-color var(--motion-fast) var(--motion-ease)}
.ui-menu-row--descriptive{min-height:var(--ui-row-descriptive)}
.ui-menu-icon{display:flex;align-items:center;justify-content:center;width:var(--ui-icon-slot);height:var(--ui-icon-slot);flex:none}
.ui-menu-icon>img{width:var(--ui-icon-size);height:var(--ui-icon-size);object-fit:contain}
.ui-row-copy{display:grid;gap:var(--ui-text-gap);min-width:0}
.ui-menu-label{font-size:var(--ui-body-size);line-height:var(--ui-body-line);font-weight:var(--weight-medium);overflow-wrap:anywhere}
.ui-menu-tail{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);color:var(--color-text-muted);font-size:var(--ui-support-size);line-height:var(--ui-support-line);text-align:right;max-width:12ch;overflow-wrap:anywhere}
.ui-menu-description,.ui-field-note{display:block;color:var(--color-text-secondary);font-size:var(--ui-support-size);line-height:var(--ui-support-line);font-weight:var(--weight-regular)}
.ui-menu-row .chevron{width:var(--ui-trailing-size);height:var(--ui-trailing-size);flex:none}
.ui-back{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--ui-touch-min);color:var(--color-text-secondary);font-size:var(--ui-support-size);line-height:var(--ui-support-line);text-decoration:none;margin-bottom:var(--space-3)}
.ui-page :where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--set-focus);outline-offset:3px}
.ui-form{display:grid;gap:var(--ui-field-gap);padding:var(--ui-group-padding)}
.ui-field{display:grid;gap:var(--space-2)}
.ui-field>label{font-size:var(--ui-support-size);line-height:var(--ui-support-line);font-weight:var(--weight-medium)}
.ui-input{width:100%;min-height:var(--ui-control-height);padding:calc(var(--space-3) - 1px) var(--space-3);border:1px solid var(--color-border);border-radius:var(--ui-control-radius);background:var(--color-surface-sunken);color:var(--color-text);font:inherit;font-size:var(--ui-body-size);line-height:var(--ui-body-line)}
textarea.ui-input{resize:vertical;min-height:calc(var(--ui-control-height) * 3)}
.ui-button{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--ui-control-height);padding:var(--space-3) var(--space-5);border:0;border-radius:var(--ui-control-radius);background:var(--color-brand-action-fill);color:var(--color-brand-action-on);font:inherit;font-size:var(--ui-body-size);line-height:var(--ui-body-line);font-weight:var(--weight-semibold);cursor:pointer}
.ui-button--submit{min-height:var(--ui-submit-height)}
.ui-button:disabled{opacity:.6;cursor:wait}
.ui-faq{overflow:hidden;margin-bottom:var(--ui-group-gap)}
.ui-faq details+details{border-top:1px solid var(--color-border)}
.ui-faq summary{cursor:pointer;font-size:var(--ui-body-size);line-height:var(--ui-body-line);font-weight:var(--weight-medium);padding:var(--space-3) var(--ui-group-padding);min-height:var(--ui-row-compact)}
.ui-faq p{font-size:var(--ui-support-size);line-height:var(--ui-support-line);color:var(--color-text-secondary);margin:0;padding:0 var(--ui-group-padding) var(--ui-group-padding)}
@media(hover:hover){.ui-menu-row:hover{background:var(--color-surface-sunken)}}
@media(prefers-reduced-motion:reduce){.ui-menu-row{transition:none}}
/* Controls own interaction states; the passive icon frame never does. */
.ui-button,.ui-button:hover,.ui-button:focus-visible,.ui-button:active{text-decoration:none}
.ui-button:focus-visible{outline:3px solid var(--set-focus);outline-offset:3px}
.ui-button:not(:disabled):active{transform:translateY(1px)}
@media(hover:hover){.ui-button:not(:disabled):hover{background:color-mix(in srgb,var(--color-brand-action-fill) 92%,black)}}
.ui-button--outline{background:transparent;border:1px solid var(--color-border-strong);color:var(--color-text)}
.ui-button.ui-button--outline .sh-ui-icon{filter:none}
@media(hover:hover){.ui-button--outline:not(:disabled):hover{background:var(--color-surface-sunken)}}
/* /css/ui-icons.css */
/* Passive icon frame: fixed visual canvas, never a control by itself. */
.sh-icon-frame{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;flex:none;vertical-align:middle;width:var(--ui-icon-slot,2rem);height:var(--ui-icon-slot,2rem);border:1px solid var(--color-border,#dee8ee);border-radius:var(--ui-control-radius,.375rem);background:transparent;box-shadow:none;pointer-events:none}
.sh-icon-frame>.sh-ui-icon,.sh-icon-frame>img{display:block;width:var(--ui-icon-size,1.5rem);height:var(--ui-icon-size,1.5rem);object-fit:contain;margin:0}
/* SnapHolo customer icon family. Color for destinations, ink for tiny operations. */
.sh-ui-icon{display:inline-block;vertical-align:middle;flex:none;width:24px;height:24px;object-fit:contain}
.control .sh-ui-icon,.cta .sh-ui-icon{margin-right:7px}.control .sh-ui-icon[src*="/plus.svg"]{width:18px;height:18px}
.ui-button .sh-ui-icon,.primary .sh-ui-icon,.cta .sh-ui-icon,.glass .sh-ui-icon{filter:brightness(0) invert(1)}
.icon-button .sh-ui-icon,.icon-btn .sh-ui-icon,.page-share .sh-ui-icon{margin:0}
body>header:is(.brand-header,.global-header){height:64px;min-height:64px;gap:12px}
body>header:is(.brand-header,.global-header)>a:first-child img{width:160px}
body>header:is(.brand-header,.global-header)>nav{display:flex;align-self:center;align-items:center;gap:10px;margin-left:auto;height:44px}
body>header:is(.brand-header,.global-header)>nav>a{display:flex!important;align-items:center;justify-content:center;width:44px!important;height:44px;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0}
body>header:is(.brand-header,.global-header)>nav>a .sh-ui-icon{width:20px;height:20px}
body>header:is(.brand-header,.global-header)>nav>a.active:after{bottom:-8px;left:13px;right:13px;height:2px;background:#10b7ba}
body>header:is(.brand-header,.global-header) .acm-moved{position:absolute!important;width:1px!important;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:760px){body>header:is(.brand-header,.global-header){height:56px;min-height:56px;padding-inline:8px}body>header:is(.brand-header,.global-header)>a:first-child img{width:130px}body>header:is(.brand-header,.global-header)>nav{gap:4px}body>header:is(.brand-header,.global-header)>nav>a.active:after{bottom:-4px}}
@media(max-width:360px){body>header:is(.brand-header,.global-header){padding-inline:8px;gap:4px}body>header:is(.brand-header,.global-header)>a:first-child img{width:100px}body>header:is(.brand-header,.global-header)>nav{gap:0}}
@media(min-width:1024px){body>header:is(.brand-header,.global-header)>nav{gap:24px}body>header:is(.brand-header,.global-header)>nav>a{width:auto!important;padding-inline:4px!important}}
@media(max-width:760px){:root{--site-gutter:8px}}
/* /css/service-ui.css */
/* Service screens share a density and control scale; the home/card art stages keep their own layout. */
body.service-ui :where(button,input,select,textarea){font-family:var(--font-sans)}
body.service-ui :where(main h1){font-size:var(--ui-page-size);line-height:var(--ui-page-line);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-display)}
.ui-page{margin-top:var(--space-4)}.ui-page-title{margin-bottom:var(--space-4)}.ui-back{margin-bottom:var(--space-2)}
.ui-button{min-height:var(--ui-touch-min);padding-block:var(--space-2)}.ui-button .sh-ui-icon{width:20px;height:20px}
.ui-icon-button{display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--ui-control-radius);background:transparent;cursor:pointer;color:var(--color-text);font:inherit}
.ui-icon-button img{width:16px;height:16px}.collection-add.ui-button{padding:var(--space-2);width:44px;height:44px;min-height:44px}.collection-tools .ui-button{padding:var(--space-2);width:44px;height:44px}
body.service-ui .catalog-page{padding-block:var(--space-4) var(--space-6)}body.service-ui .catalog-page h1{margin:0 0 var(--space-4)}
body.service-ui .market-toolbar{gap:var(--space-3);margin-bottom:var(--space-3)}body.service-ui .market-basis{margin:var(--space-2) 0 var(--space-3);font-size:var(--ui-label-size);line-height:var(--ui-label-line)}body.service-ui .market-board{gap:var(--space-3)}
body.service-ui .market-panel{border-radius:var(--ui-group-radius)}body.service-ui .market-switch{border-radius:var(--ui-control-radius)}body.service-ui .market-switch button{border-radius:var(--ui-control-radius)}body.service-ui .market-card{min-height:92px;padding-block:var(--space-3)}
body.service-ui .market-numbers strong{font-weight:var(--weight-semibold)}
body.service-ui .acct{padding:var(--space-5) var(--ui-gutter) var(--space-6)}body.service-ui .acct h1{margin-bottom:var(--space-4)}body.service-ui .acct h2{font-size:var(--ui-section-size);line-height:var(--ui-section-line);font-weight:var(--weight-semibold);margin:var(--space-5) 0 var(--space-3)}
body.service-ui .acct-who{gap:var(--space-3);margin-bottom:var(--space-4)}body.service-ui .acct-who img{width:40px;height:40px}body.service-ui .acct-who span{font-size:var(--ui-body-size);font-weight:var(--weight-semibold)}body.service-ui .rows{border-radius:var(--ui-group-radius)}body.service-ui .rows>li{padding:var(--space-3) var(--space-4)}body.service-ui .row__name{font-weight:var(--weight-medium)}body.service-ui :where(.btn,.idp,.acct-note){border-radius:var(--ui-control-radius)}
body.service-ui .hero{padding:var(--space-5) 0 var(--space-6)}body.service-ui .hero h1{margin:0 0 var(--space-3)}body.service-ui .lead{font-size:var(--ui-body-size);line-height:var(--ui-body-line)}body.service-ui .sec{gap:var(--space-3);padding-block:var(--space-5)}body.service-ui .sec h2{font-size:var(--ui-section-size);line-height:var(--ui-section-line);font-weight:var(--weight-semibold)}
body.service-ui .support-intro{margin-bottom:var(--space-4)}body.service-ui .hub-footer{margin-top:var(--space-4);padding-bottom:var(--space-5)}
body.service-ui .site-foot{margin-top:var(--space-6)}
/* A sheet title and a close action share one header. Fixed glyph size does not shrink touch targets. */
dialog.ui-dialog,dialog#collection-dialog,dialog#profile-dialog,dialog#guide-dialog{width:calc(100% - 2 * var(--ui-gutter));max-width:32rem;max-height:85dvh;margin:auto;padding:var(--ui-group-padding);border:0;border-radius:var(--ui-group-radius);background:var(--color-surface);color:var(--color-text);font-family:var(--font-sans);overflow:auto}
dialog .dialog-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}dialog .dialog-head h2{margin:0;font-size:var(--ui-section-size);line-height:var(--ui-section-line);font-weight:var(--weight-semibold)}
dialog :where(.close,.dialog-close,.sheet-close,.my-icon,#close-profile){width:44px;height:44px;min-width:44px;min-height:44px;padding:var(--space-2);border-radius:var(--ui-control-radius)}dialog :where(.close,.dialog-close,.sheet-close,.my-icon,#close-profile) .sh-ui-icon{width:16px;height:16px}
dialog .collection-actions{display:grid;gap:var(--space-3);margin:0}dialog .collection-actions a{display:flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;border:1px solid var(--color-border);border-radius:var(--ui-control-radius);background:transparent;color:var(--color-text);text-decoration:none;font-size:var(--ui-body-size)}
dialog :where(input,select,textarea){border-radius:var(--ui-control-radius);font:inherit;font-size:var(--ui-body-size)}
dialog.quota-sheet{border-radius:var(--ui-group-radius) var(--ui-group-radius) 0 0}.quota-pro{border-radius:var(--ui-control-radius);margin-top:var(--space-4)}.quota-body{padding:var(--space-5) var(--ui-group-padding) max(var(--space-5),env(safe-area-inset-bottom))}.quota-sheet :where(.quota-app,.quota-close,.quota-login){border-radius:var(--ui-control-radius)}
.my-tile-wrap{position:relative}.is-managing .my-tile-wrap{padding-bottom:var(--space-9)}
@media(min-width:768px){dialog.quota-sheet{border-radius:var(--ui-group-radius)}}
@media(hover:hover){.collection-row:hover,.pro-option:hover{background:var(--color-surface-sunken)}}
/* News has one category navigation; sidebar branding/tags repeated the same destinations. */
:root[data-snapholo-news] .s-sidebar-about,:root[data-snapholo-news] .s-sidebar-tags,:root[data-snapholo-news] .s-latest-head .s-quick-filters{display:none}
:root[data-snapholo-news]{--corner-radius:var(--ui-control-radius);--corner-radius-lg:var(--ui-group-radius)}
:root[data-snapholo-news] .s-news-tabs{min-height:44px;padding-block:0}
:root[data-snapholo-news] .s-content{padding-top:var(--space-4)}
:root[data-snapholo-news] .s-latest-head{margin-bottom:var(--space-3);gap:var(--space-3)}
:root[data-snapholo-news] .s-sidebar-content{padding:var(--space-4);border-radius:var(--ui-group-radius)}
:root[data-snapholo-news] .s-home-top{gap:var(--space-5)}
:root[data-snapholo-news] .s-card-content{padding:var(--space-4)}
:root[data-snapholo-news] .s-content.s-home{margin-top:0}
:root[data-snapholo-news] .s-container{row-gap:var(--space-5)}
@media(max-width:700px){
body.service-ui .market-numbers{display:grid;gap:var(--space-1)}
body.service-ui .market-before{display:none}
body.service-ui .market-numbers small:after{content:none}
body.service-ui .market-identity strong{font-size:var(--ui-body-size);line-height:var(--ui-body-line);white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.service-ui .market-numbers strong{font-size:var(--ui-section-size);line-height:var(--ui-section-line)}
}
body.service-ui .money-currency{font-size:var(--ui-label-size);font-weight:var(--weight-regular);line-height:1;color:var(--color-text-secondary)}
body.service-ui :where(a.control,a.btn,a.cta):is(:hover,:focus-visible,:active){text-decoration:none}
dialog.sheet,body[data-frame] .sheet{border-radius:var(--ui-group-radius) var(--ui-group-radius) 0 0}
body[data-frame] .sheet{padding-inline:var(--ui-group-padding)}body[data-frame] .sheet-head h2{font-size:var(--ui-section-size);line-height:var(--ui-section-line);font-weight:var(--weight-semibold)}
body[data-frame] :where(.top-pick,.candidate-option){border-radius:var(--ui-control-radius)}
body[data-frame] :where(.scan-save-footer button,.review-tabs button,.btn){border-radius:var(--ui-control-radius)}
@media(min-width:1024px){body[data-frame] .sheet{border-radius:var(--ui-group-radius) 0 0 var(--ui-group-radius)}}
body.service-ui .editions button{min-width:44px;min-height:44px;flex-shrink:0}body.service-ui .editions button[data-edition=all]{padding-inline:8px}
/* Account status and actions use natural text height, including browser text zoom. */
body.service-ui .acct .btn,body.service-ui .acct .idp{padding-block:var(--space-3);white-space:normal;text-align:center}body.service-ui .acct .badge{white-space:normal;border-radius:var(--ui-control-radius);font-weight:var(--weight-medium)}
body.service-ui .account-methods{background:var(--color-surface);border-radius:var(--ui-group-radius);margin-top:var(--space-3);overflow:hidden}body.service-ui .account-methods h2{margin:0;padding:var(--space-4) var(--space-4) var(--space-2);font-size:var(--ui-support-size)}body.service-ui .account-methods .rows{border:0}body.service-ui .acct .row__act{max-width:100%}
body.service-ui .grade-table{margin-top:var(--space-4);margin-bottom:var(--space-4)}body.service-ui .grade-table caption{font-size:var(--ui-section-size);font-weight:var(--weight-semibold);color:var(--color-text)}body.service-ui .grade-table tbody td:nth-child(2){font-size:var(--ui-section-size);font-weight:var(--weight-semibold)}
/* Shared Figma role: the currency symbol and amount form one number. */
body.service-ui .money-currency{font:inherit;color:inherit;line-height:inherit}
body.service-ui{background-color:var(--color-page-bg)}
/* Approved density: keep readable text and control hit areas, remove nested gutters. */
dialog .dialog-head{position:relative;justify-content:center;min-height:44px;padding-inline:52px}
dialog .dialog-head h2{flex:1;text-align:center}
dialog .dialog-head :is(.close,.dialog-close,.sheet-close,#close-profile){position:absolute;right:0;top:50%;transform:translateY(-50%)}
.quota-body{text-align:center}.quota-pro{display:flex;flex-direction:column;align-items:center}.quota-actions{justify-content:center}
@media(max-width:767px){
body.service-ui .ui-page{margin-top:8px}
body.service-ui :is(.ui-page-title,.support-intro){margin-bottom:8px}
body.service-ui :is(.ui-section,.group.ui-menu-group){margin-block:8px}
body.service-ui .ui-section-label{padding-inline:8px}
body.service-ui .ui-form{gap:8px}
body.service-ui .acct{padding-block:8px}
body.service-ui .rows>li{padding-inline:8px}
body.service-ui .sec{padding-block:8px;gap:8px}
body.service-ui .site-foot{margin-top:8px}
}
@media(max-width:767px){
:root[data-snapholo-news] :is(.s-content,.s-container){padding-inline:8px;column-gap:8px;row-gap:8px}
:root[data-snapholo-news] :is(.s-card-content,.s-sidebar-content){padding:8px}
}
/* /explore/catalog-redesign.css */
/* Approved catalog panels: 02–09, responsive 390 / 1440. Shared header and tokens are owned by the shell. */
.redesign-catalog{background:var(--color-page-bg);color:var(--color-text)}
.redesign-catalog main#main.wrap{min-height:0;width:calc(100% - 2*var(--site-gutter,16px));max-width:1184px;padding:16px 0 0;margin:0 auto}
.redesign-catalog .catalog-area{padding:12px;background:linear-gradient(107deg,var(--color-area-fill-start),var(--color-area-fill-start) 35%,var(--color-panel));border:.8px solid var(--color-area-stroke);border-radius:16px;margin-bottom:12px;min-width:0;box-shadow:none}
.redesign-catalog main h1{font-size:24px;line-height:32px;letter-spacing:-.24px;font-weight:600;margin:0 0 12px;color:var(--color-text)}
.redesign-catalog .catalog-area>h2,.redesign-catalog .catalog-area>.section-heading h2,.redesign-catalog .catalog-eyebrow,.redesign-catalog .game-top>h2{font-size:12px;line-height:18px;letter-spacing:.48px;font-weight:500;color:var(--color-text-muted);display:flex;align-items:center;gap:6px;margin:0 16px 12px}
.redesign-catalog .catalog-area>h2:before,.redesign-catalog .catalog-area>.section-heading h2:before,.redesign-catalog .catalog-eyebrow:before{content:'';display:block;flex:none;width:5px;height:15px;border-radius:2px;background:var(--color-brand-action-fill)}
.redesign-catalog main a{color:var(--color-text);text-decoration:none}
.redesign-catalog .catalog-expand{display:block;margin:8px auto 0;min-height:44px;font-family:inherit;font-size:13px;line-height:20px;font-weight:600;color:var(--color-brand-link-text);background:none;border:0;cursor:pointer}
.redesign-catalog .catalog-area .chart-table{margin:0;padding:0;border:0;background:none;border-radius:0;box-shadow:none;overflow:visible}
.redesign-catalog .catalog-area table{width:100%;border-collapse:separate;border-spacing:0 8px;table-layout:fixed;background:none}
.redesign-catalog .catalog-area th,.redesign-catalog .catalog-area td{border:0;background:none;font-size:14px;line-height:20px;padding:12px 16px;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-catalog .catalog-area thead th{font-size:12px;font-weight:500;color:var(--color-text-secondary);padding-block:4px}
.redesign-catalog .catalog-area tbody tr{background:var(--color-page-bg)}
.redesign-catalog .catalog-area tbody th:first-child{border-radius:8px 0 0 8px;font-weight:600}
.redesign-catalog .catalog-area tbody td:last-child{border-radius:0 8px 8px 0;font-weight:600}
.redesign-catalog .catalog-area td{text-align:right;font-variant-numeric:tabular-nums}
.redesign-catalog .catalog-area small{display:block;font-size:12px;line-height:18px;color:var(--color-text-secondary);font-weight:400}
.redesign-catalog .catalog-faq{padding:12px 28px}
.redesign-catalog .catalog-faq>h2{margin-left:0}
.redesign-catalog .catalog-question{border:0;border-top:1px solid var(--color-border);background:none;padding:0;margin:0;min-width:0}
.redesign-catalog .catalog-question:first-of-type{border-top:0}
.redesign-catalog .catalog-question summary{display:block;list-style:none;position:relative;cursor:pointer;padding:12px 24px 12px 0;min-height:48px;color:var(--color-text);font-size:16px;font-weight:500;line-height:24px}
.redesign-catalog .catalog-question summary::-webkit-details-marker{display:none}
.redesign-catalog .catalog-question summary:after{content:'';width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);position:absolute;right:3px;top:18px}
.redesign-catalog .catalog-question[open] summary:after{transform:rotate(225deg)}
.redesign-catalog .catalog-question-title{display:block;overflow-wrap:anywhere}
.redesign-catalog .catalog-answer-preview{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--color-text-muted);font-size:13px;font-weight:400;margin-top:4px}
.redesign-catalog .catalog-question[open] .catalog-answer-preview{display:none}
.redesign-catalog .catalog-question>p{font-size:14px;line-height:22px;font-weight:400;margin:0 0 12px;color:var(--color-text-secondary)}
/* 02: input + existing game/edition controls; one compact set panel. */
.redesign-catalog main.catalog-explore{min-height:0;padding-bottom:0}
.redesign-catalog .catalog-explore .catalog-sets{margin-bottom:0}
.redesign-catalog .intro{padding:0;margin:0 0 12px;min-height:0}
.redesign-catalog .intro h1{margin:0}
.redesign-catalog .brand-mark{width:48px;height:54px;opacity:.12;right:12px;top:0}
.redesign-catalog .catalog-search #search-form{margin:0 0 12px;gap:8px}
.redesign-catalog .catalog-search .search-box{height:44px;padding:0 12px;gap:8px;border-radius:8px}
.redesign-catalog .catalog-search .search-box>svg{width:20px;height:20px}
.redesign-catalog #search-form .search-submit{min-width:44px;width:44px;height:44px;padding:10px;flex:none}
.redesign-catalog .catalog-search .search-box input{font-size:16px;line-height:22px}
.redesign-catalog .catalog-search .filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:7px;row-gap:12px;margin:0;padding:0;border:0}
.redesign-catalog .catalog-search .game-icons{grid-column:1;grid-row:1;width:84px}
.redesign-catalog .catalog-search .editions{grid-column:1/-1;grid-row:1;width:calc(100% - 91px);margin:0 0 0 91px;height:44px;min-height:44px;gap:3px;padding:3px}
.redesign-catalog .catalog-search .product-type{grid-column:1}
.redesign-catalog .catalog-search .filters .filter-select:not(.game-icons) .filter-trigger,.redesign-catalog .catalog-search .game-icons .filter-trigger{width:100%;height:44px;min-height:44px;background:var(--color-page-bg);border:1px solid var(--color-border);border-radius:6px;padding:0 12px;display:flex;gap:6px;align-items:center}
.redesign-catalog .catalog-search .filter-caption{display:none}
.redesign-catalog .catalog-search .filter-trigger strong{font-size:12px;line-height:16px;font-weight:500;min-width:0;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.redesign-catalog .catalog-search .filter-arrow{position:static;flex:none;width:16px;height:16px;transform:none}
.redesign-catalog .catalog-search .filters .editions button{flex:1;min-width:0;min-height:38px;height:38px;border:0;background:none;color:var(--color-text-muted)}
.redesign-catalog .catalog-search .editions button[aria-pressed=true]{background:color-mix(in srgb,var(--color-brand-action-fill) 5%,transparent);color:var(--color-brand-link-text)}
.redesign-catalog .catalog-search .editions button:not([aria-pressed=true]) .edition-badge{opacity:.55}
.redesign-catalog .catalog-search .editions .edition-name{display:none}
.redesign-catalog .catalog-result-sort{float:right;margin:-43px 16px 0 0;position:relative;z-index:2;width:120px}
.redesign-catalog .catalog-result-sort .filter-trigger{border:0;background:none;font-size:13px;color:var(--color-text-muted);height:44px;min-height:44px;padding:0;gap:6px;justify-content:flex-end}
.redesign-catalog .catalog-result-sort .filter-caption{display:none}
.redesign-catalog .catalog-result-sort strong{font-size:13px;font-weight:500}
.redesign-catalog .catalog-result-sort .filter-arrow{position:static;transform:none;width:16px;height:16px}
.redesign-catalog #filter-summary{margin:0 16px 12px;min-height:32px;font-size:12px;line-height:32px;color:var(--color-text-muted);padding:0}
.redesign-catalog #packs{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0 16px}
.redesign-catalog .pack-tile{border:0;background:var(--color-page-bg);box-shadow:none;border-radius:12px;padding:8px;min-width:0;display:flex;flex-direction:column;gap:8px}
.redesign-catalog .pack-tile.selected:after{border-color:var(--color-brand-action-fill)}
.redesign-catalog .pack-tile:focus-visible{outline:none}
.redesign-catalog .pack-tile:focus-visible:after{outline:3px solid var(--set-focus);outline-offset:4px}
.redesign-catalog .pack-tile .pack-art{height:auto;aspect-ratio:81/123.6375;width:100%;padding:0;margin:0;background:none;min-height:0}
.redesign-catalog .pack-tile .pack-art img{height:100%;width:100%;object-fit:contain;transform:none;filter:drop-shadow(0 5px 5px color-mix(in srgb,var(--color-text) 15%,transparent))}
/* 팩 그림 없는 세트 — 그림 칸과 같은 크기의 옅은 판 + 가운데 작은 로고(위 img 규칙이 로고를 칸 전체로 키워 넘치던 것, 관제 10-23) */
.redesign-catalog .pack-tile .pack-art .no-art{width:100%;height:100%;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--color-text) 4%,transparent)}
.redesign-catalog .pack-tile .pack-art .no-art img{width:36%;height:auto;margin:0;opacity:.35;filter:none}
.redesign-catalog .pack-tile h2{font-size:13px;line-height:18px;height:36px;min-height:36px;margin:0;font-weight:600;letter-spacing:0;word-break:break-all;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-align:left}
.redesign-catalog .pack-tile p{font-size:12px;line-height:17px;margin:-4px 0 0;color:var(--color-text-secondary);white-space:nowrap;text-align:left;letter-spacing:0;overflow:visible}
.redesign-catalog .pack-release{display:inline;font-size:inherit}
.redesign-catalog .release-day{display:none}
.redesign-catalog .set-drawer{grid-column:1/-1;margin:8px 0;background:var(--color-page-bg);border:0;border-radius:12px}
.redesign-catalog .set-drawer #set-panel{background:none;border:0;padding:12px;margin:0}
.redesign-catalog .set-drawer .card-grid,.redesign-catalog #results.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.redesign-catalog .set-drawer .card-tile,.redesign-catalog #results .card-tile{padding:8px;min-width:0;background:var(--color-panel);border:0;border-radius:12px}
.redesign-catalog .set-drawer .card-tile h3{font-size:12px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.redesign-catalog .status:empty{display:none}
/* 03/04/07/08: values remain real server HTML, compact lists expand in place. */
.redesign-catalog .game-actions[hidden]{display:none}
.redesign-catalog .game-grid{display:flex;flex-direction:column;gap:8px;padding:0;margin:0;list-style:none}
.redesign-catalog .game-grid>li{background:var(--color-page-bg);border-radius:8px;min-width:0}
.redesign-catalog .game-grid>li>a{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 16px;min-height:64px;background:none;border:0}
.redesign-catalog .game-grid img{width:34px;height:48px;object-fit:contain;grid-row:1}
.redesign-catalog .game-grid span{font-size:15px;line-height:22px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.redesign-catalog .game-grid strong{font-size:15px;line-height:22px;font-weight:600;text-align:right}
.redesign-catalog .game-characters .char-links{display:flex;gap:8px;flex-wrap:wrap;margin:0;font-size:0}
.redesign-catalog .game-characters .char-links a,.redesign-catalog .char-links>a{font-size:12px;line-height:18px;padding:8px 12px;border-radius:999px;background:var(--color-page-bg)}
.redesign-catalog .game-sets>details>summary{display:none}
.redesign-catalog .char-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:0;margin:0;list-style:none}
.redesign-catalog .char-grid>li{min-width:0;background:var(--color-page-bg);border-radius:12px;padding:8px}
.redesign-catalog .char-grid a{display:flex;flex-direction:column;gap:8px}
.redesign-catalog .char-grid img{display:block;width:100%;height:auto;aspect-ratio:63/88;object-fit:contain}
.redesign-catalog .char-grid span,.redesign-catalog .char-grid b{font-size:12px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.redesign-catalog .catalog-characters .chart-table th:nth-child(3){display:none}
.redesign-catalog .catalog-characters .chart-table td:nth-child(3){display:none}
/* 09 retains the approved existing leader boards; only the lower table and FAQ adopt panels. */
.redesign-catalog .market-date,.redesign-catalog .market-basis{display:none}
.redesign-catalog .movers-table{padding:12px;background:linear-gradient(107deg,var(--color-area-fill-start),var(--color-area-fill-start) 35%,var(--color-panel));border:.8px solid var(--color-area-stroke);border-radius:16px;margin:12px 0}
.redesign-catalog .movers-table>summary{font-size:12px;font-weight:500;letter-spacing:.48px;color:var(--color-text-muted);padding:0 16px 12px}
.redesign-catalog .movers-table table{border-collapse:separate;border-spacing:0 8px;background:none}
.redesign-catalog .movers-table tbody tr{background:var(--color-page-bg)}
@media(max-width:767px){
.redesign-catalog .catalog-page .catalog-area .chart-table thead{display:none}
.redesign-catalog .catalog-page .catalog-area tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin-bottom:8px;border-radius:8px;padding:12px 16px}
.redesign-catalog .catalog-page .catalog-area tbody th,.redesign-catalog .catalog-page .catalog-area tbody td{padding:0;white-space:normal;font-size:13px;line-height:18px;min-width:0}
.redesign-catalog .catalog-page .catalog-area tbody th{grid-column:1;grid-row:1/3;font-size:15px;line-height:22px;align-self:center;white-space:nowrap}
.redesign-catalog .catalog-page .catalog-area tbody td{grid-column:2;text-align:right}
.redesign-catalog .catalog-page .catalog-area tbody td:last-child{font-size:15px;line-height:22px;grid-row:1}
.redesign-catalog .catalog-page .catalog-area tbody td:nth-child(2){color:var(--color-text-secondary);font-size:12px}
}
@media(min-width:768px){
.redesign-catalog main#main.wrap{padding:24px 0 48px}
.redesign-catalog .catalog-area{padding:24px;margin-bottom:24px}
.redesign-catalog main h1{margin-bottom:24px}
.redesign-catalog main.catalog-explore{padding-bottom:48px}
.redesign-catalog .catalog-search .filters{display:flex;align-items:center;gap:12px}
.redesign-catalog .catalog-search .game-icons{width:144px;flex:none}
.redesign-catalog .catalog-search .editions{width:285px;margin:0;padding:5px;gap:4px;flex:none}
.redesign-catalog .catalog-search .filters .editions button{min-height:32px;height:32px;padding:0;gap:8px}
.redesign-catalog .catalog-search .search-box input{font-size:14px;line-height:20px}
.redesign-catalog .catalog-search .editions .edition-name{display:inline;font-size:12px}
.redesign-catalog .catalog-search .filters>label{width:126px;flex:none;min-width:0}
.redesign-catalog .catalog-search .filters>.game-icons{width:144px}
.redesign-catalog .catalog-search .game-icons .filter-trigger strong{display:flex;align-items:center;gap:8px}
.redesign-catalog #packs{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.redesign-catalog .pack-tile{padding:12px}
.redesign-catalog .pack-tile .pack-art{height:auto;aspect-ratio:287/362}
.redesign-catalog .pack-tile h2{font-size:14px;line-height:20px;height:40px}
.redesign-catalog .release-day{display:inline}
.redesign-catalog .set-drawer .card-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.redesign-catalog .catalog-game-top{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px;align-items:start}
.redesign-catalog .catalog-game-primary,.redesign-catalog .catalog-game-aside{min-width:0}
.redesign-catalog .catalog-game-aside .chart-table td{font-size:13px;padding:8px}
.redesign-catalog .catalog-game-aside .chart-table th{padding:8px;width:40%}
.redesign-catalog .char-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.redesign-catalog .char-grid span,.redesign-catalog .char-grid b{font-size:14px;line-height:20px}
.redesign-catalog .catalog-characters .chart-table th:first-child{width:auto}
.redesign-catalog .catalog-characters .chart-table th:nth-child(2),.redesign-catalog .catalog-characters .chart-table th:last-child{width:140px}
.redesign-catalog .catalog-edition{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:24px;align-items:start}
.redesign-catalog .catalog-edition>.page-title,.redesign-catalog .catalog-edition>h1{grid-column:1/-1}
.redesign-catalog .catalog-faq{padding-inline:40px}
}
/* 05: retained live fan, ranked three cards, compact album and native sort source. */
.redesign-catalog #concept-view{padding:0;min-height:0}
body.redesign-catalog main#main.wrap:has(#concept-view[hidden]),body.redesign-catalog main#main.wrap:has(#concept-view.pending:not(.failed)){min-height:100svh}
.redesign-catalog #concept-view>.set-intro,.redesign-catalog #highlights,.redesign-catalog #collection,.redesign-catalog .set-faq{padding:12px;background:linear-gradient(107deg,var(--color-area-fill-start),var(--color-area-fill-start) 35%,var(--color-panel));border:.8px solid var(--color-area-stroke);border-radius:16px;margin:0 0 12px;box-shadow:none}
.redesign-catalog #concept-view>.set-intro{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:16px;padding:24px 28px}
.redesign-catalog .set-intro .intro-copy{width:100%}
.redesign-catalog .set-intro:before,.redesign-catalog .set-intro:after{display:none}
.redesign-catalog .set-intro h1{font-size:24px;line-height:32px;margin:8px 0;font-weight:600;letter-spacing:-.24px}
.redesign-catalog #pack-art{position:static;width:96px;height:132px;object-fit:contain;transform:none;inset:auto}
.redesign-catalog .set-intro .eyebrow{font-size:12px;line-height:18px;color:var(--color-text-muted)}
.redesign-catalog .set-code{font-size:12px;line-height:18px;color:var(--color-text-secondary)}
.redesign-catalog .set-meta{font-size:12px;line-height:18px;margin:12px 0 0;gap:12px;display:flex;flex-wrap:wrap}
.redesign-catalog .set-meta>div{display:flex;gap:4px}
.redesign-catalog .section-nav,.redesign-catalog #rarities,.redesign-catalog #price-basis,.redesign-catalog #spotlight-badges,.redesign-catalog .fan-hint,.redesign-catalog .spotlight-rank>span:not(#rank-number),.redesign-catalog .set-intro .set-copy,.redesign-catalog #data-note{display:none}
.redesign-catalog #highlights .section-heading,.redesign-catalog #collection .section-heading{margin:0 16px 8px;min-height:18px;display:flex;align-items:center;justify-content:space-between}
.redesign-catalog #highlights h2,.redesign-catalog #collection h2{font-size:12px;line-height:18px;letter-spacing:.48px;font-weight:500;margin:0;color:var(--color-text-muted)}
.redesign-catalog #highlights h2:before,.redesign-catalog #collection h2:before{content:'';display:inline-block;width:5px;height:15px;border-radius:2px;background:var(--color-brand-action-fill);vertical-align:middle;margin-right:6px}
.redesign-catalog .showcase{display:flex;flex-direction:column-reverse;min-height:0;padding:16px 16px 20px;gap:24px;border:0;border-radius:0;background:none}
.redesign-catalog .fan-area{padding:0;border:0;width:100%;position:relative}
.redesign-catalog .fan{height:260px;margin:0;overflow:visible}
.redesign-catalog .fan-card{width:150px;top:12px;transform:translateX(calc(-50% + var(--offset)*48px)) translateY(calc(var(--distance)*50px)) rotate(calc(var(--offset)*12deg)) scale(.8)}
.redesign-catalog .fan-card[aria-pressed=true]{transform:translateX(-50%);z-index:5}
.redesign-catalog .fan-controls{position:absolute;inset:100px 0 auto;display:flex;justify-content:space-between;margin:0;pointer-events:none}
.redesign-catalog .fan-controls button{width:36px;height:36px;min-height:36px;border:0;background:var(--color-page-bg);border-radius:999px;box-shadow:0 4px 12px color-mix(in srgb,var(--color-text) 10%,transparent);pointer-events:auto}
.redesign-catalog #fan-count{display:none}
.redesign-catalog .spotlight-info{display:block;padding:0;position:relative;min-width:0;width:100%;border:0}
.redesign-catalog .spotlight-info h3{font-size:18px;line-height:26px;font-weight:600;margin:0 52px 8px 0}
.redesign-catalog #spotlight-number{display:block;font-size:13px;line-height:20px;color:var(--color-text-muted)}
.redesign-catalog .spotlight-rank{position:absolute;right:0;top:0;margin:0;padding:0;background:none}
.redesign-catalog #rank-number img{width:44px;height:44px;object-fit:contain}
.redesign-catalog .spotlight-price{font-size:28px;line-height:35px;margin:12px 0 6px;font-weight:600;color:var(--color-text)}
.redesign-catalog .price-caption{font-size:12px;line-height:18px;color:var(--color-text-muted)}
.redesign-catalog .spotlight-actions{display:flex;gap:8px;margin-top:16px}
.redesign-catalog .spotlight-actions .primary{display:flex;flex:1;justify-content:center;align-items:center;min-height:44px;color:var(--color-brand-action-on);background:var(--color-brand-action-fill);border-radius:12px;font-size:14px}
.redesign-catalog .spotlight-actions .icon-button{width:44px;height:44px;background:var(--color-page-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text)}
.redesign-catalog .rank-strip{display:none}
.redesign-catalog .collection-filters{margin:0;padding:0 16px;border:0;background:none}
.redesign-catalog .catalog-sort-chips{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:4px}
.redesign-catalog .catalog-sort-chips button{font-family:inherit;font-size:13px;font-weight:500;min-height:44px;border:0;background:none;color:var(--color-text-muted);padding:6px 10px;border-radius:999px}
.redesign-catalog .catalog-sort-chips button[aria-pressed=true]{background:color-mix(in srgb,var(--color-brand-action-fill) 5%,transparent);color:var(--color-brand-link-text);box-shadow:inset 0 0 0 1px var(--color-brand-action-fill)}
.redesign-catalog #collection .all-rarities{margin:0 0 8px;gap:4px;flex-wrap:nowrap;overflow:auto;scrollbar-width:none}
.redesign-catalog #collection .all-rarities button{font-size:12px;min-height:32px;padding:6px 10px;background:var(--color-page-bg);border:0;border-radius:999px;white-space:nowrap}
.redesign-catalog #collection .all-rarities button[aria-pressed=true]{background:color-mix(in srgb,var(--color-brand-action-fill) 5%,transparent);color:var(--color-brand-link-text)}
.redesign-catalog #collection .filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.redesign-catalog #collection .filter-row>label:has(#sort){display:none}
.redesign-catalog #collection .search-label{flex:1;min-width:0;background:var(--color-area-fill-start);border:1px solid var(--color-border);height:44px}
.redesign-catalog #search{font-size:16px;min-height:44px}
.redesign-catalog .album-status{margin:4px 0;font-size:12px;line-height:20px;min-height:32px;padding:0;align-items:center}
.redesign-catalog #collection .album{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:0;margin:0;background:none;border:0;box-shadow:none}
.redesign-catalog #collection .album-slot{padding:8px;border:0;border-radius:12px;background:var(--color-page-bg);min-width:0}
.redesign-catalog .album-slot .art{display:block;width:100%;height:auto;aspect-ratio:63/88;padding:1px;margin:0;background:none;min-height:0}
.redesign-catalog .album-slot .art img{display:block;width:100%;height:100%;object-fit:contain;max-height:none}
.redesign-catalog .album-slot .open-card{display:flex;flex-direction:column;gap:8px;padding:0}
.redesign-catalog .album-slot .open-card>span:not(.art){display:block;min-width:0}
.redesign-catalog .album-slot strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:20px;font-weight:600}
.redesign-catalog .album-slot .badge,.redesign-catalog .album-slot .card-number{display:none}
.redesign-catalog .album-slot .card-price{font-size:14px;line-height:20px;margin:0;white-space:nowrap}
.redesign-catalog .album-slot .save-small{width:32px;height:32px;right:4px;top:4px;min-height:32px;opacity:0}
.redesign-catalog .album-slot:hover .save-small,.redesign-catalog .album-slot .save-small:focus-visible,.redesign-catalog .album-slot .save-small[aria-pressed=true]{opacity:1}
.redesign-catalog #collection .album.list{display:block;grid-template-columns:none}
.redesign-catalog .catalog-card-link,.redesign-catalog .catalog-set-link{display:flex;align-items:center;gap:12px;min-width:0}
.redesign-catalog .catalog-card-link img,.redesign-catalog .catalog-set-link img{width:34px;height:48px;object-fit:contain;flex:none}
.redesign-catalog .catalog-card-link span,.redesign-catalog .catalog-set-link span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.redesign-catalog .movers-table tr[hidden]{display:none}
.redesign-catalog .movers-table .up{color:var(--color-rise)}
.redesign-catalog .movers-table .down{color:var(--color-fall)}
@media(min-width:768px){
.redesign-catalog #concept-view>.set-intro,.redesign-catalog #highlights,.redesign-catalog #collection{padding:24px;margin-bottom:24px}
.redesign-catalog #concept-view>.set-intro{min-height:208px;grid-template-columns:minmax(0,1fr) 96px;padding:40px}
.redesign-catalog #pack-art{width:96px;height:132px}
.redesign-catalog .showcase{display:grid;grid-template-columns:1fr 1fr;min-height:400px;padding:32px 40px}
.redesign-catalog .fan{height:360px}
.redesign-catalog .fan-card{width:240px;transform:translateX(calc(-50% + var(--offset)*95px)) translateY(calc(var(--distance)*80px)) rotate(calc(var(--offset)*12deg)) scale(.75)}
.redesign-catalog .fan-card[aria-pressed=true]{transform:translateX(-50%)}
.redesign-catalog .fan-controls{top:140px}
.redesign-catalog .spotlight-info{align-self:center}
.redesign-catalog .spotlight-info h3{font-size:28px;line-height:36px;margin-right:0}
.redesign-catalog .spotlight-rank{position:static;margin-bottom:12px}
.redesign-catalog #rank-number img{width:52px;height:52px}
.redesign-catalog .spotlight-price{font-size:36px;line-height:45px}
.redesign-catalog .spotlight-actions .primary{flex:none;min-width:144px}
.redesign-catalog .rank-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border:0;padding:0 16px}
.redesign-catalog .rank-strip button{min-height:64px;padding:8px 12px;display:flex;gap:8px;background:none;border:0;border-radius:0;border-bottom:2px solid transparent;min-width:0}
.redesign-catalog .rank-strip button[aria-pressed=true]{border-bottom-color:var(--color-brand-action-fill);background:none}
.redesign-catalog .rank-strip .rank-summary{display:flex;flex-direction:column;gap:4px;min-width:0}
.redesign-catalog #collection .album{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.redesign-catalog .album-slot strong,.redesign-catalog .album-slot .card-price{font-size:14px;line-height:20px}
.redesign-catalog #collection .search-label{max-width:420px}
.redesign-catalog .movers-table th:first-child{width:40px}
.redesign-catalog .movers-table th:nth-child(2){width:auto}
.redesign-catalog .movers-table th:nth-child(n+3){width:140px;text-align:right}
}
@media(max-width:767px){
.redesign-catalog .catalog-page .movers-table tbody tr{grid-template-columns:minmax(0,1fr) auto;align-items:center}
.redesign-catalog .catalog-page .movers-table tbody th{grid-column:1;grid-row:1/3}
.redesign-catalog .catalog-page .movers-table tbody td:first-child,.redesign-catalog .catalog-page .movers-table tbody td:nth-child(3),.redesign-catalog .catalog-page .movers-table tbody td:nth-child(5){display:none}
.redesign-catalog .catalog-page .movers-table tbody td:nth-child(4){grid-row:1;grid-column:2;font-size:15px;font-weight:600}
.redesign-catalog .catalog-page .movers-table tbody td:nth-child(6){grid-row:2;grid-column:2;font-size:13px}
}
.redesign-catalog .set-intro .intro-heading{width:100%;max-width:none}
.redesign-catalog .album-slot .open-card>span.card-number{display:none}
.redesign-catalog .album-slot .open-card>span .badge{display:none}
.redesign-catalog .catalog-area tbody tr[hidden],.redesign-catalog .game-grid>li[hidden]{display:none}
.redesign-catalog .movers-table>.chart-table{margin:0;border:0;background:none;padding:0}
.redesign-catalog .movers-table th,.redesign-catalog .movers-table td{padding:12px 16px;border:0;font-size:14px;line-height:20px;white-space:nowrap}
.redesign-catalog .movers-table td{text-align:right;font-variant-numeric:tabular-nums}
.redesign-catalog .movers-table tbody td:first-child{border-radius:8px 0 0 8px;color:var(--color-text-secondary)}
.redesign-catalog .movers-table tbody td:last-child{border-radius:0 8px 8px 0}
.redesign-catalog .movers-table thead th{font-size:12px;font-weight:500;color:var(--color-text-secondary)}
.redesign-catalog .catalog-sets{position:relative;display:flow-root}
.redesign-catalog .catalog-result-sort{position:absolute;right:28px;top:40px;margin:0;float:none}
.redesign-catalog #packs{width:auto;clear:both}
.redesign-catalog .catalog-search .product-type,.redesign-catalog .catalog-search .series-filter,.redesign-catalog .catalog-search .year-filter{grid-row:2;width:auto}
.redesign-catalog .catalog-search .product-type{grid-column:1}
.redesign-catalog .catalog-search .series-filter{grid-column:2}
.redesign-catalog .catalog-search .year-filter{grid-column:3}
.redesign-catalog .catalog-result-sort .filter-trigger{display:flex;align-items:center;gap:4px;justify-content:flex-end;padding:0;min-height:32px;height:32px}
.redesign-catalog .catalog-result-sort .filter-trigger strong{line-height:18px}
.redesign-catalog #filter-summary b{font-weight:400}
.redesign-catalog .catalog-result-sort .filter-arrow svg{width:16px;height:16px}
.redesign-catalog .catalog-result-sort .filter-trigger strong{flex:none}
.redesign-catalog .data-note{display:none}
@media(min-width:768px){.redesign-catalog .catalog-result-sort{top:52px;right:40px}}
.redesign-catalog .catalog-move-tabs{display:flex;justify-content:center;gap:8px;margin:0 16px 8px}
.redesign-catalog .catalog-move-tabs button{flex:1;min-height:44px;background:none;border:0;border-bottom:1px solid var(--color-border);font-family:inherit;font-size:13px;font-weight:500;color:var(--color-text-secondary)}
.redesign-catalog .catalog-move-tabs button[aria-pressed=true]{border-bottom:2px solid var(--color-brand-link-text);color:var(--color-text)}
.redesign-catalog .catalog-game-moves .game-movers{background:none;border:0;padding:0;margin:0}
.redesign-catalog .catalog-game-moves .game-movers>h2{display:none}
.redesign-catalog .catalog-game-moves .game-movers[hidden]{display:none}
.redesign-catalog .game-characters .catalog-expand{font-size:13px}
.redesign-catalog .set-drawer .card-item{padding:8px;min-width:0;background:var(--color-panel);border:0;border-radius:12px;gap:8px}
.redesign-catalog .set-drawer .card-item .card-identity{display:block;min-width:0}
.redesign-catalog .set-drawer .card-item strong{font-size:12px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.redesign-catalog .set-drawer .card-item .card-price{font-size:12px;line-height:18px;white-space:nowrap}
.redesign-catalog .catalog-page tbody tr[hidden]{display:none}
@media(max-width:767px){
.redesign-catalog .catalog-game{display:flex;flex-direction:column}
.redesign-catalog .catalog-game-top,.redesign-catalog .catalog-game-primary,.redesign-catalog .catalog-game-aside{display:contents}
.redesign-catalog .catalog-game>.page-title,.redesign-catalog .catalog-game>h1{order:0}
.redesign-catalog .catalog-game .game-top{order:1}
.redesign-catalog .game-editions tbody th,.redesign-catalog .game-sets tbody th{grid-row:1!important}
.redesign-catalog .game-editions tbody td:nth-child(2),.redesign-catalog .game-sets tbody td:nth-child(2){grid-row:2;grid-column:1!important;text-align:left!important}
.redesign-catalog .game-editions tbody td:nth-child(3),.redesign-catalog .game-sets tbody td:nth-child(3){grid-row:1;grid-column:2;font-size:15px!important;font-weight:600}
.redesign-catalog .game-editions tbody td:nth-child(4),.redesign-catalog .game-sets tbody td:nth-child(4){grid-row:2!important;grid-column:2;font-size:12px!important;font-weight:400!important;color:var(--color-text-secondary)}
.redesign-catalog .game-editions tbody td:nth-child(2):before{content:'세트 '}
.redesign-catalog .game-editions tbody td:nth-child(4):before{content:'시세 '}
.redesign-catalog:lang(en) .game-editions tbody td:nth-child(2):before{content:'Sets '}
.redesign-catalog:lang(en) .game-editions tbody td:nth-child(4):before{content:'Priced '}
.redesign-catalog:lang(ja) .game-editions tbody td:nth-child(2):before{content:'セット '}
.redesign-catalog:lang(ja) .game-editions tbody td:nth-child(4):before{content:'価格あり '}
.redesign-catalog .game-sets tbody td:nth-child(2){margin-left:46px}
.redesign-catalog .catalog-page .game-grades tbody td:nth-child(2){display:none}
.redesign-catalog .catalog-page .game-grades tbody td:nth-child(3){grid-column:1;grid-row:2;text-align:left;color:var(--color-text-muted);font-size:12px}
.redesign-catalog .catalog-page .game-grades tbody th{grid-row:1}
.redesign-catalog .catalog-page .game-grades tbody td:nth-child(4){grid-column:2;grid-row:2;font-size:12px;color:var(--color-text-muted)}
}
.redesign-catalog .catalog-character-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;font-size:0}
.redesign-catalog .catalog-character-chips a{font-size:12px;line-height:18px;background:var(--color-page-bg);border-radius:999px;padding:8px 12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-card .price-ranges{display:none}
.redesign-card .chart-table tr[hidden]{display:none}
.redesign-card .catalog-expand{display:block;min-height:44px;margin:8px auto 0;border:0;background:none;color:var(--color-brand-link-text);font-size:13px;font-family:inherit;font-weight:600;cursor:pointer}
@media(max-width:767px){
.redesign-catalog .catalog-character .catalog-folded-cell{display:none}
.redesign-catalog .catalog-character .character-table-0 tbody th{grid-row:1/3!important}
.redesign-catalog .catalog-character .character-table-0 .catalog-main-price{grid-row:1!important;font-size:15px!important;font-weight:600}
.redesign-catalog .catalog-character .character-table-0 .catalog-secondary-price{grid-row:2!important;font-size:12px!important;color:var(--color-text-secondary);font-weight:400!important}
.redesign-catalog .catalog-character .character-table-1 tbody td:last-child{grid-row:1!important}
.redesign-catalog .catalog-character .character-table-1 tbody td:nth-child(2){grid-row:2!important}
.redesign-catalog .catalog-character .character-table-2 tbody td:nth-child(2){grid-row:1!important;font-size:15px!important;font-weight:600;color:var(--color-text)}
.redesign-catalog .catalog-character .character-table-2 tbody td:last-child{grid-row:2!important;font-size:12px!important;font-weight:400;color:var(--color-text-secondary)}
}
.redesign-catalog .set-table-box{display:none}
.redesign-catalog .fan-dots{display:flex;justify-content:center;min-height:44px;gap:0;margin:0}
.redesign-catalog .fan-dots button{display:flex;align-items:center;justify-content:center;width:32px;min-height:44px;background:none;border:0;cursor:pointer}
.redesign-catalog .fan-dots button:before{content:'';display:block;width:6px;height:6px;border-radius:999px;background:var(--color-border)}
.redesign-catalog .fan-dots button[aria-pressed=true]:before{background:var(--color-brand-action-fill)}
.redesign-catalog .fan-controls{inset:100px 0 auto}
@media(min-width:768px){.redesign-catalog .fan-dots{display:none}.redesign-catalog .fan-controls{inset:140px 0 auto}}
.redesign-catalog .catalog-game>.page-title{display:flex;align-items:center;justify-content:space-between;gap:12px}
.redesign-catalog .catalog-game>.page-title h1{min-width:0;flex:1;margin:0}
.redesign-catalog .catalog-game-picker{display:flex;align-items:center;position:relative;flex:none;height:44px;border:1px solid var(--color-border);border-radius:6px;background:var(--color-page-bg);padding-left:12px}
.redesign-catalog .catalog-game-picker img{width:24px;height:24px;pointer-events:none}
.redesign-catalog .catalog-game-picker select{height:44px;max-width:116px;font-family:inherit;font-size:12px;border:0;background:transparent;padding:0 12px 0 8px;color:var(--color-text);cursor:pointer}
@media(max-width:767px){.redesign-catalog .catalog-game-picker{width:64px;padding-left:10px}.redesign-catalog .catalog-game-picker select{width:30px;padding:0;font-size:0}.redesign-catalog .catalog-game-picker option{font-size:14px}.redesign-catalog .catalog-game>.page-title{margin-bottom:12px}}
/* Additional catalog parity: six market columns, optional filters, two-column desktop FAQ. */
.redesign-catalog .collection-filters #all-rarities[hidden],.redesign-catalog .collection-filters .filter-row[hidden]{display:none}
.redesign-catalog .catalog-sort-chips .catalog-filter-toggle{margin-left:auto;color:var(--color-brand-link-text)}
@media(min-width:768px){
.redesign-catalog .movers-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
.redesign-catalog .movers-faq>h2{grid-column:1/-1}
.redesign-catalog .movers-faq .catalog-question:nth-of-type(2){border-top:0}
.redesign-catalog .game-movers .chart-table th:first-child{width:44px}
.redesign-catalog .game-movers .chart-table th:nth-child(2){width:auto}
.redesign-catalog .game-movers .chart-table th:nth-child(n+3){width:140px;text-align:right}
}
@media(max-width:767px){
.redesign-catalog .catalog-page .game-movers tbody td:first-child,.redesign-catalog .catalog-page .game-movers tbody td:nth-child(3),.redesign-catalog .catalog-page .game-movers tbody td:nth-child(5){display:none}
.redesign-catalog .catalog-page .game-movers tbody th{display:block;grid-column:1;grid-row:1/3}
.redesign-catalog .catalog-page .game-movers tbody td:nth-child(4){grid-column:2;grid-row:1;font-size:15px;font-weight:600}
.redesign-catalog .catalog-page .game-movers tbody td:nth-child(6){grid-column:2;grid-row:2;font-size:13px}
}
/* Tablet fan must fit its half-width panel before the full desktop artwork size. */
@media(min-width:768px) and (max-width:1023px){
.redesign-catalog .fan{height:300px}
.redesign-catalog .fan-card{width:180px;transform:translateX(calc(-50% + var(--offset)*50px)) translateY(calc(var(--distance)*40px)) rotate(calc(var(--offset)*12deg)) scale(.75)}
.redesign-catalog .fan-card[aria-pressed=true]{transform:translateX(-50%)}
}
@media(min-width:768px) and (max-width:1023px){.redesign-catalog .catalog-search .filters{flex-wrap:wrap}.redesign-catalog .catalog-search .editions{flex:1}.redesign-catalog .catalog-search .filters>label:not(.game-icons){flex:1}}
/* Set intro and album: neutralize previous mobile editorial layout rules. */
.redesign-catalog #concept-view>.set-intro .intro-heading{min-height:0}
.redesign-catalog #concept-view>.set-intro .eyebrow{flex-direction:row;align-items:center;gap:16px;white-space:nowrap;font-size:12px;line-height:18px;height:18px}
.redesign-catalog #concept-view>.set-intro .edition-label{padding:0 6px;font-size:12px;line-height:16px}
.redesign-catalog #concept-view>.set-intro h1{margin:8px 0;font-size:24px;line-height:32px;word-break:normal;overflow-wrap:normal}
.redesign-catalog #concept-view>.set-intro .set-meta{margin-top:16px;gap:4px 16px}
.redesign-catalog #concept-view>.set-intro .set-meta time{font-variant-numeric:tabular-nums}
.redesign-catalog #collection .section-heading{position:relative}
.redesign-catalog #collection-title #total-count{display:none}
.redesign-catalog #collection .view-switch{position:absolute;right:0;top:84px;z-index:1;border:0;padding:0;background:none;display:flex;gap:8px}
.redesign-catalog #collection .view-switch button{font-size:0;width:16px;height:32px;min-height:32px;padding:0;background:none;border:0}
.redesign-catalog #collection .view-switch button:before{content:'';display:block;width:16px;height:16px;background:var(--color-text-muted);mask:center/contain no-repeat}
.redesign-catalog #collection .view-switch button[data-layout=album]:before{mask-image:url('/assets/ui-icons/grid.svg')}
.redesign-catalog #collection .view-switch button[data-layout=list]:before{mask-image:url('/assets/ui-icons/list.svg')}
.redesign-catalog #collection .view-switch button[aria-pressed=true]:before{background:var(--color-brand-action-fill)}
.redesign-catalog .album-status #reset-filters{width:32px;font-size:0;min-height:32px}
.redesign-catalog .catalog-sort-chips{gap:4px;flex-wrap:nowrap;position:relative;padding-right:24px}
.redesign-catalog .catalog-sort-chips button{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;min-height:32px;padding:6px 8px;background:var(--color-page-bg);border:1px solid var(--color-border);border-radius:999px;line-height:18px;white-space:nowrap}
.redesign-catalog .catalog-sort-chips .catalog-filter-toggle{position:absolute;right:-8px;width:24px;height:32px;min-width:0;border:0;background:none;padding:0;font-size:0;}
.redesign-catalog .catalog-sort-chips .catalog-filter-toggle:after{content:'';display:block;width:16px;height:16px;background:var(--color-text-muted);mask:url('/assets/ui-icons/filter.svg') center/contain no-repeat}
@media(max-width:767px){
.redesign-catalog .fan{height:248px}
.redesign-catalog .fan-card{width:127.334px;height:177.249px;top:-2.448px;left:calc(50% - 2.264px);z-index:calc(3 - var(--distance));transform:translateX(calc(-50% + var(--offset)*23.557px)) translateY(calc(var(--distance)*12.304px)) rotate(calc(var(--offset)*8deg)) scale(.740741)}
.redesign-catalog .fan-card:not([aria-pressed=true]):hover{transform:translateX(calc(-50% + var(--offset)*23.557px)) translateY(calc(var(--distance)*12.304px)) rotate(calc(var(--offset)*8deg)) scale(.740741)}
.redesign-catalog .fan-card[aria-pressed=true]{transform:translateX(-50%);z-index:5}
.redesign-catalog #collection .collection-filters{padding-inline:16px}
.redesign-catalog #collection .album-status{min-height:32px;margin:4px 0 12px}
}
.redesign-catalog #concept-view>.set-intro{grid-template-columns:minmax(0,1fr) 96px;column-gap:12px;row-gap:12px;padding:20px 28px}
.redesign-catalog #concept-view>.set-intro .intro-copy{display:contents}
.redesign-catalog #concept-view>.set-intro .intro-heading{grid-column:1;grid-row:1}
.redesign-catalog #concept-view>.set-intro #pack-art{grid-column:2;grid-row:1}
.redesign-catalog #concept-view>.set-intro .set-meta{grid-column:1/-1;grid-row:2;display:flex;max-width:none;width:100%;margin:0;padding-top:12px;border-top:1px solid var(--color-border)}
.redesign-catalog #concept-view>.set-intro .set-meta>div{display:flex;align-items:center;gap:6px;padding:0;border:0}
.redesign-catalog #concept-view>.set-intro .set-meta dt{font-size:13px;line-height:18px}
.redesign-catalog #concept-view>.set-intro .set-meta dd,.redesign-catalog #concept-view>.set-intro .set-meta .meta-release dd{font-size:14px;line-height:20px;padding:0;font-weight:600;white-space:nowrap}
.redesign-catalog #concept-view>.set-intro .set-meta small{font:inherit;margin:0;color:inherit}
.redesign-catalog #collection .album-status #reset-filters{margin-right:44px}
.redesign-catalog #collection .album-slot .art{margin-bottom:0}
.redesign-catalog .fan-card:has(img):before,.redesign-catalog .fan-card:has(img):after{display:none}
@media(min-width:768px){
.redesign-catalog #concept-view>.set-intro{grid-template-columns:minmax(0,1fr) 116px;padding:32px 40px}
.redesign-catalog #concept-view>.set-intro #pack-art{width:116px;height:160px}
}
.redesign-catalog #highlights .section-heading>div{width:100%;text-align:left}
.redesign-catalog #highlights .section-heading h2{display:flex;align-items:center;justify-content:flex-start;gap:6px}
.redesign-catalog #highlights .section-heading h2:before{margin:0;flex:none}
/* 03: live metadata in the approved compact rows and right-aligned mover chips. */
.redesign-catalog .game-grid .game-card-copy{display:block;min-width:0}
.redesign-catalog .game-grid .game-card-copy b{display:block;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:20px}
.redesign-catalog .game-grid .game-card-copy small{display:block;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:18px;font-weight:400}
.redesign-catalog .game-grid strong{font-size:14px;line-height:20px}
.redesign-catalog .catalog-game-moves{position:relative}
.redesign-catalog .catalog-game-moves .catalog-move-tabs{position:absolute;right:28px;top:8px;margin:0;gap:4px}
.redesign-catalog .catalog-game-moves .catalog-move-tabs button{flex:none;min-height:28px;padding:4px 8px;border:0;font-size:12px;line-height:18px;border-radius:999px}
.redesign-catalog .catalog-game-moves .catalog-move-tabs button[aria-pressed=true]{background:color-mix(in srgb,var(--color-brand-action-fill) 5%,transparent);color:var(--color-brand-link-text)}
.redesign-catalog .game-grades>h2:after{content:'PSA 10 기준';margin-left:auto;font-size:12px;line-height:18px;letter-spacing:0}
.redesign-catalog:lang(en) .game-grades>h2:after{content:'PSA 10'}
.redesign-catalog:lang(ja) .game-grades>h2:after{content:'PSA 10 基準'}
@media(max-width:767px){
.redesign-catalog .catalog-game .chart-table tbody a{min-height:0}
.redesign-catalog .catalog-game .game-editions tbody tr,.redesign-catalog .catalog-game .game-sets tbody tr{position:relative}
.redesign-catalog .catalog-game .game-sets .catalog-set-link{padding-left:46px}
.redesign-catalog .catalog-game .game-sets .catalog-set-link img{position:absolute;left:16px;top:10px}
.redesign-catalog .catalog-game .game-grades tbody td:nth-child(2){display:block;grid-row:2;grid-column:1;text-align:left;font-size:12px;color:var(--color-text-muted)}
.redesign-catalog .catalog-game .game-grades tbody td:nth-child(3){grid-row:2;grid-column:2;text-align:right;font-size:12px;font-weight:400}
.redesign-catalog .catalog-game .game-grades tbody td:nth-child(3):before{content:'미감정 '}
.redesign-catalog:lang(en) .catalog-game .game-grades tbody td:nth-child(3):before{content:'Raw '}
.redesign-catalog:lang(ja) .catalog-game .game-grades tbody td:nth-child(3):before{content:'未鑑定 '}
.redesign-catalog .catalog-game .game-grades tbody td:nth-child(4){display:none}
}
@media(min-width:768px){.redesign-catalog .catalog-game-moves .catalog-move-tabs{top:20px;right:40px}}
.redesign-catalog .game-grid .game-card-copy .game-card-edition{display:flex;align-items:center;gap:4px}
.redesign-catalog .game-card-edition:before{content:'';display:inline-block;flex:none;width:14px;height:14px;background:center/contain no-repeat url('/assets/ui-icons/language.svg')}
.redesign-catalog .game-card-edition[data-card-edition=ko]:before{background-image:url('/assets/filter-icons/kr.svg')}
.redesign-catalog .game-card-edition[data-card-edition=ja]:before{background-image:url('/assets/filter-icons/jp.svg')}
@media(max-width:767px){.redesign-catalog .catalog-game .game-editions tbody th,.redesign-catalog .catalog-game .game-editions tbody td{height:auto}.redesign-catalog .catalog-game .game-editions tbody td:nth-child(3){line-height:22px}.redesign-catalog .catalog-game .game-editions tbody td:nth-child(4){line-height:18px}}
/* 09: the approved six-row board retains access to the full TOP 20. */
.redesign-catalog .market-card:before{content:''}
.redesign-catalog .market-board .market-card{min-height:120px}
.redesign-catalog .market-panel .market-numbers strong{font-size:17px;line-height:24px}
.redesign-catalog .market-before{font-size:12px;line-height:20px}
@media(max-width:767px){
.redesign-catalog .market-board .market-card{min-height:98px;padding:12px;gap:8px}
.redesign-catalog .market-panel .market-identity strong{font-size:16px;line-height:24px;white-space:nowrap;display:block}
.redesign-catalog .market-panel .market-numbers strong{font-size:18px;line-height:26px}
.redesign-catalog .market-panel .market-card .market-before{display:none}
}
.redesign-catalog .market-panel .market-numbers{gap:3px}.redesign-catalog .market-panel .market-change{line-height:23px}.redesign-catalog .market-panel .market-numbers small{font-size:12px;line-height:20px}
.redesign-catalog .market-panel .market-numbers>small{display:block}@media(max-width:767px){.redesign-catalog .market-panel .market-change{line-height:20.8px}}
.redesign-catalog:not(.market-all-editions) .market-card-language{display:none}
.redesign-catalog .movers-table-count{margin-left:auto;font-size:12px;letter-spacing:0;font-weight:400}
.redesign-catalog .movers-data-table .market-table-meta{display:flex;align-items:center;gap:4px;font-size:12px;line-height:18px}
.redesign-catalog .movers-data-table .market-table-meta:before{content:'';display:block;flex:none;width:14px;height:14px;background:center/contain no-repeat url('/assets/ui-icons/language.svg')}
.redesign-catalog .movers-data-table .market-table-meta[data-card-edition=ko]:before{background-image:url('/assets/filter-icons/kr.svg')}
.redesign-catalog .movers-data-table .market-table-meta[data-card-edition=ja]:before{background-image:url('/assets/filter-icons/jp.svg')}
.redesign-catalog .movers-data-table .mv-before{display:none}
@media(max-width:767px){
.redesign-catalog .movers-data-table .mv-edition{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.redesign-catalog .movers-data-table .mv-before{display:inline}
}
/* 04 language-edition home: server counts and compact, dated set rows. */
body.redesign-catalog main#main.wrap.catalog-edition{padding:16px 0 24px;min-height:0}
.redesign-catalog .catalog-edition>.edition-title{padding:12px 28px;margin:0 0 12px;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.redesign-catalog .catalog-edition .edition-title h1{margin:0}
.redesign-catalog .catalog-edition .edition-count{font-size:14px;line-height:20px;color:var(--color-text-muted);margin:0}
.redesign-catalog .catalog-edition .chart-table tbody th,.redesign-catalog .catalog-edition .chart-table tbody td{height:64px;padding:8px 16px}
.redesign-catalog .catalog-edition .chart-table tbody a{min-height:0;height:48px}
.redesign-catalog .catalog-edition .catalog-set-link img{border:1px solid var(--color-border);border-radius:8px;padding:4px;background:var(--color-page-bg)}
/* 팩 그림 없는 세트 — 그림 칸과 같은 틀 + 옅은 로고(탐색 세트 자리표와 같은 규칙 · 원피스 한국판 Heroines Edition 이 이름만 왼쪽에 붙던 것, 10-23 화면 점검) */
.redesign-catalog .catalog-edition .edition-set-noart{display:block;flex:none;width:34px;height:48px;border:1px solid var(--color-border);border-radius:8px;padding:4px;background:var(--color-page-bg)}.redesign-catalog .catalog-edition .edition-set-noart::before{content:"";display:block;height:100%;background:url(/assets/home-c/symbol.svg) center/60% auto no-repeat;opacity:.35}
.redesign-catalog .catalog-edition .edition-set-copy{display:block;min-width:0}
.redesign-catalog .catalog-edition .edition-set-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-catalog .catalog-edition .edition-set-date{display:none}
@media(min-width:768px){
body.redesign-catalog main#main.wrap.catalog-edition{padding:32px 0 40px}
.redesign-catalog .catalog-edition>.edition-title{padding:24px 40px;flex-direction:row;align-items:center;gap:8px}
.redesign-catalog .catalog-edition .chart-table th:first-child{width:57%}
.redesign-catalog .catalog-edition .chart-table th:nth-child(2){width:24%}
.redesign-catalog .catalog-edition .chart-table tbody td:last-child{font-weight:400}
}
@media(max-width:767px){
.redesign-catalog .catalog-edition .chart-table table{border-spacing:0}
.redesign-catalog .catalog-edition .chart-table tbody{display:grid;gap:8px}
.redesign-catalog .catalog-edition .chart-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) max-content;min-height:64px;padding:0;margin:0;gap:0}
.redesign-catalog .catalog-edition .chart-table tbody th{grid-column:1;grid-row:1;display:flex;align-items:center;min-width:0}
.redesign-catalog .catalog-edition .chart-table tbody td:nth-child(2){display:none}
.redesign-catalog .catalog-edition .chart-table tbody td:last-child{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:flex-end;min-width:72px;font-size:14px;line-height:20px;white-space:nowrap}
.redesign-catalog .catalog-edition .catalog-set-link{width:100%;font-size:16px;line-height:24px;font-weight:500}
.redesign-catalog .catalog-edition .edition-set-date{display:block;font-size:14px;line-height:20px;font-weight:400;color:var(--color-text-muted)}
.redesign-catalog .catalog-edition .catalog-expand{margin-top:12px}
}
@media(min-width:768px){.redesign-catalog .catalog-edition>.catalog-area{margin-bottom:0}}
.redesign-catalog .catalog-edition>.catalog-area:last-child{margin-bottom:0}
/* 07: 52px title component, 64/72px rows and a separate count unit on phones. */
body.redesign-catalog main#main.wrap.catalog-characters{padding:16px 0 24px}
body.redesign-catalog .catalog-characters>h1{height:52px;display:flex;align-items:center;margin:0 0 12px}
body.redesign-catalog .catalog-characters>h1{overflow-wrap:anywhere} /* ja 원피스 제목은 한 구절(auto-phrase)이라 390 에서 5px 넘쳤다 — 들어갈 자리가 없을 때만 끊는다(2026-10-22) */
.redesign-catalog .catalog-characters>.catalog-area{margin-bottom:0}
.redesign-catalog .catalog-characters .chart-table>div{max-height:none;overflow:visible}
.redesign-catalog .catalog-characters .chart-table table{border-spacing:0}
.redesign-catalog .catalog-characters .chart-table small{font-size:13px;line-height:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.redesign-catalog .catalog-characters .chart-table tbody th>a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-catalog .character-count-mobile{display:none}
@media(max-width:767px){
.redesign-catalog .catalog-characters .chart-table tbody{display:grid;gap:8px}
.redesign-catalog .catalog-characters .chart-table tbody tr{height:64px;min-height:64px;gap:2px 12px;margin:0;padding:12px 16px}
.redesign-catalog .catalog-characters .chart-table tbody th,.redesign-catalog .catalog-characters .chart-table tbody td:last-child{font-size:15px;line-height:20px}
.redesign-catalog .catalog-characters .chart-table tbody td:nth-child(2){font-size:13px;line-height:18px}
.redesign-catalog .catalog-characters .character-count-desktop{display:none}
.redesign-catalog .catalog-characters .character-count-mobile{display:inline}
}
@media(min-width:768px){
body.redesign-catalog main#main.wrap.catalog-characters{padding:12px 0}
body.redesign-catalog .catalog-characters>h1{margin-bottom:24px}
.redesign-catalog .catalog-characters .chart-table table{border-spacing:0 8px;margin:-8px 0}
.redesign-catalog .catalog-characters .chart-table thead th{height:28px;padding:0 16px 12px;font-size:12px;line-height:16px}
.redesign-catalog .catalog-characters .chart-table tbody tr{height:72px}
.redesign-catalog .catalog-characters .chart-table tbody th,.redesign-catalog .catalog-characters .chart-table tbody td:last-child{font-size:16px;line-height:22px}
.redesign-catalog .catalog-characters .chart-table tbody td:nth-child(2){font-size:13px;line-height:18px;font-weight:400}
}
/* 05 widget geometry measured from920:534219 and916:314844. */
.redesign-catalog #collection .section-heading h2{display:flex;align-items:center;gap:6px}
.redesign-catalog #collection .section-heading h2:before{margin:0;flex:none}
.redesign-catalog #collection-label{font:inherit;margin:0}
.redesign-catalog #collection .view-switch{top:70px}
.redesign-catalog .album-slot .open-card{gap:4px}
.redesign-catalog #collection .album-slot .art{margin-bottom:4px}
.redesign-catalog #load-more.pagination{height:1px;min-height:1px;margin:0;padding:0}
.redesign-catalog #loaded-count{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.redesign-catalog .set-code{font-size:14px;line-height:20px;font-weight:600}
@media(max-width:767px){
.redesign-catalog main#main:has(#concept-view){padding-top:12px}
.redesign-catalog #highlights{padding:20px 12px}
.redesign-catalog .showcase{padding:17px 16px 16px;gap:12px}
.redesign-catalog .fan-area{padding-top:5px}
.redesign-catalog .fan{width:299px;max-width:100%;height:212.224px}
.redesign-catalog .fan-controls{inset:93.112px -4px auto}
.redesign-catalog .fan-dots{height:14px;min-height:14px}
.redesign-catalog .fan-dots button{height:14px;min-height:14px;width:12px;padding:0}
.redesign-catalog .spotlight-info{padding-top:13px}
.redesign-catalog .spotlight-info h3{margin-bottom:4px}
.redesign-catalog #spotlight-number{font-size:12px;line-height:20px}
.redesign-catalog .spotlight-price{margin:7px 0 0}
.redesign-catalog .price-caption{line-height:20px;margin:-4px 0 0}
.redesign-catalog .spotlight-actions{margin-top:18px;align-items:flex-start}
.redesign-catalog .spotlight-actions .primary{height:45px;min-height:45px;line-height:23px}
}
/* Closed questions show only the question; the full answer remains in the disclosure. */
.redesign-catalog .catalog-faq.catalog-area{padding:12px}
.redesign-catalog .catalog-faq.catalog-area>h2{margin:0 16px 12px}
.redesign-catalog .catalog-question summary{display:grid;grid-template-columns:minmax(0,1fr) 24px;column-gap:12px;row-gap:12px;padding:12px 16px 16px}
.redesign-catalog .catalog-question summary:after{display:none}
.redesign-catalog .catalog-question-title{grid-column:1;grid-row:1}
.redesign-catalog .catalog-question-caret{grid-column:2;grid-row:1;align-self:center;width:24px;height:24px;stroke:currentColor;stroke-width:1.5;fill:none}
.redesign-catalog .catalog-question[open] .catalog-question-caret{transform:rotate(180deg)}
.redesign-catalog .catalog-question .catalog-answer-preview{grid-column:1/-1;grid-row:2;font-size:14px;line-height:20px;margin:0}
.redesign-catalog .catalog-question[open] summary{padding-bottom:12px;row-gap:0}
.redesign-catalog .catalog-question>p{font-size:14px;line-height:20px;margin:0;padding:0 16px 16px}
@media(min-width:768px){.redesign-catalog .catalog-faq.catalog-area{padding:24px}}
.redesign-catalog .fan-controls button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}
/* 05 desktop widget: 920:534369 keeps the art fan behind the selected card. */
@media(min-width:768px){
.redesign-catalog #highlights .section-heading{margin-bottom:12px}
.redesign-catalog .showcase{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;min-height:453px;margin-top:22px;padding:25px 34px}
.redesign-catalog .fan{height:403px}
.redesign-catalog .fan-card{width:227.412px;height:317.078px;top:24px;left:50%;z-index:calc(3 - var(--distance));transform:translateX(calc(-50% + var(--offset)*133.689px)) translateY(calc(var(--distance)*62.785px)) rotate(calc(var(--offset)*11deg)) scale(.75)}
.redesign-catalog .fan-card:not([aria-pressed=true]):hover{transform:translateX(calc(-50% + var(--offset)*133.689px)) translateY(calc(var(--distance)*62.785px)) rotate(calc(var(--offset)*11deg)) scale(.75)}
.redesign-catalog .fan-card[aria-pressed=true]{transform:translateX(-50%);z-index:5}
.redesign-catalog .fan-controls{opacity:0;transition:opacity var(--motion-fast)}
.redesign-catalog .fan-area:hover .fan-controls,.redesign-catalog .fan-area:focus-within .fan-controls{opacity:1}
.redesign-catalog .spotlight-rank{margin-bottom:8px}
.redesign-catalog .spotlight-info h3{font-size:18px;line-height:26px;margin:0 0 4px}
.redesign-catalog #spotlight-number{font-size:12px;line-height:20px;min-height:25.6px;display:flex;align-items:flex-end}
.redesign-catalog .spotlight-price{margin:15px 0 0}
.redesign-catalog .price-caption{line-height:20px;margin:-4px 0 0}
.redesign-catalog .spotlight-actions{margin-top:23px}
.redesign-catalog .spotlight-actions .primary{height:44.4px;min-height:44.4px;min-width:146px;border-radius:8px}
.redesign-catalog .spotlight-actions .icon-button{border-radius:999px}
.redesign-catalog .rank-strip{gap:0;padding:0;margin:14px 0 0}
.redesign-catalog .rank-strip button{height:74px;min-height:74px;padding:12px;gap:10px;align-items:center}
.redesign-catalog .rank-strip .rank-art{display:block;flex:none;width:34px;height:48px}
.redesign-catalog .rank-strip .rank-art img{display:block;width:100%;height:100%;object-fit:contain}
.redesign-catalog .rank-strip .rank-summary{gap:2px;text-align:left}
.redesign-catalog .rank-strip .rank-summary strong{font-size:12px;line-height:18px;font-weight:600}
.redesign-catalog .rank-strip .rank-summary small{font-size:14px;line-height:20px;font-weight:600}
.redesign-catalog .catalog-sort-chips{justify-content:flex-start}
.redesign-catalog .catalog-sort-chips button{flex:none}
}
.redesign-catalog .fan-card{transform-origin:50% 50%}
.redesign-catalog #concept-view>.set-intro .edition-label{background:var(--color-page-bg);border:0;border-radius:999px;padding:2px 8px;letter-spacing:0;color:var(--color-text);font-weight:500}
.redesign-catalog .set-code{letter-spacing:0;color:var(--color-text)}
.redesign-catalog .set-code>span{padding:2px 8px;line-height:17px;background:var(--color-page-bg);border:0;border-radius:999px;font-weight:400;letter-spacing:0}
.redesign-catalog #concept-view>.set-intro .set-meta dt{margin:0}
@media(min-width:768px){
.redesign-catalog main#main:has(#concept-view){padding-top:32px;padding-bottom:40px}
.redesign-catalog #concept-view>.set-intro{padding:24px 40px}
.redesign-catalog .rank-strip{background:transparent;border-radius:0}
.redesign-catalog .rank-strip button[aria-pressed=true]{box-shadow:none}
}
/* 03 page title and picker use the same 52px line in both approved layouts. */
.redesign-catalog .catalog-game>.page-title{height:52px;min-height:52px}
.redesign-catalog .catalog-game-picker{width:84px;height:48px;padding:3px 12px;gap:8px;border:0}
.redesign-catalog .catalog-game-picker img{width:36px;height:36px}
.redesign-catalog .catalog-game-picker select{width:16px;max-width:none;height:42px;padding:0;font-size:0}
.redesign-catalog .catalog-game-picker option{font-size:14px}
@media(max-width:767px){.redesign-catalog main#main.catalog-game{padding-top:12px}}
@media(min-width:768px){.redesign-catalog .catalog-game>.page-title{margin-bottom:24px}}
@media(min-width:1024px){.redesign-catalog .catalog-game-top{grid-template-columns:minmax(0,1fr) 360px}}
.redesign-catalog .movers-data-table .chart-table>div{max-height:none;overflow:visible}
.redesign-catalog .movers-data-table>h2{line-height:20px;margin-bottom:12px}
.redesign-catalog .movers-data-table table{border-spacing:0}
.redesign-catalog .movers-data-table .catalog-expand{margin:12px auto 0}
@media(max-width:767px){
.redesign-catalog .catalog-page .movers-data-table tbody tr{min-height:64px;padding:8px 16px;margin-bottom:8px}
.redesign-catalog .catalog-page .movers-data-table tbody tr:nth-last-child(1 of tr:not([hidden])){margin-bottom:0}
.redesign-catalog .catalog-page .movers-data-table tbody th{font-size:16px;line-height:24px}
.redesign-catalog .movers-data-table .market-table-meta{font-size:14px;line-height:20px}
}
@media(min-width:768px){
.redesign-catalog .movers-data-table tbody tr{height:80px}
.redesign-catalog .movers-data-table thead th{height:32px;padding:0 16px}
.redesign-catalog .movers-data-table thead th:first-child{width:64px}
.redesign-catalog .movers-data-table tbody td:first-child{padding:0 8px;text-align:center;white-space:nowrap;text-overflow:clip}
}
.redesign-catalog .game-grid-head{display:none}
.redesign-catalog .game-characters .catalog-character-chips a{display:inline-flex;align-items:center;min-height:44px;padding:12px;border:1px solid var(--color-border)}
.redesign-catalog .game-characters .char-links+p{margin:12px 0 0}
.redesign-catalog .game-characters .char-links+p .catalog-expand{margin:0}
@media(min-width:768px){
.redesign-catalog .game-grid-head{display:flex;justify-content:space-between;font-size:12px;line-height:16px;color:var(--color-text-muted);padding:0 16px;margin-bottom:8px}
.redesign-catalog .game-top>h2{margin-bottom:8px}
.redesign-catalog .catalog-game .game-sets .chart-table thead,.redesign-catalog .catalog-game .game-editions .chart-table thead{display:none}
.redesign-catalog .catalog-game .game-sets .chart-table table,.redesign-catalog .catalog-game .game-editions .chart-table table{display:block;border-spacing:0}
.redesign-catalog .catalog-game .game-sets .chart-table tbody,.redesign-catalog .catalog-game .game-editions .chart-table tbody{display:block}
.redesign-catalog .catalog-game .game-sets tbody tr,.redesign-catalog .catalog-game .game-editions tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;position:relative;min-height:64px;margin-bottom:8px;padding:8px 16px;border-radius:8px;background:var(--color-page-bg)}
.redesign-catalog .catalog-game .game-sets tbody tr:nth-last-child(1 of tr:not([hidden])),.redesign-catalog .catalog-game .game-editions tbody tr:last-child{margin-bottom:0}
.redesign-catalog .catalog-game .game-sets tbody th,.redesign-catalog .catalog-game .game-sets tbody td,.redesign-catalog .catalog-game .game-editions tbody th,.redesign-catalog .catalog-game .game-editions tbody td{height:auto;width:auto;padding:0;border:0;font-size:14px;line-height:20px;min-width:0}
.redesign-catalog .catalog-game .game-sets tbody th,.redesign-catalog .catalog-game .game-editions tbody th{grid-row:1;grid-column:1}
.redesign-catalog .catalog-game .game-sets tbody td:nth-child(2),.redesign-catalog .catalog-game .game-editions tbody td:nth-child(2){grid-row:2;grid-column:1;text-align:left;font-size:12px;line-height:18px;color:var(--color-text-muted)}
.redesign-catalog .catalog-game .game-sets tbody td:nth-child(3),.redesign-catalog .catalog-game .game-editions tbody td:nth-child(3){grid-row:1;grid-column:2;text-align:right;font-weight:600}
.redesign-catalog .catalog-game .game-sets tbody td:nth-child(4),.redesign-catalog .catalog-game .game-editions tbody td:nth-child(4){grid-row:2;grid-column:2;text-align:right;font-size:12px;line-height:18px;color:var(--color-text-muted)}
.redesign-catalog .catalog-game .game-sets .catalog-set-link{padding-left:44px}
.redesign-catalog .catalog-game .game-sets .catalog-set-link img{position:absolute;left:16px;top:10px;width:32px;height:44px}
.redesign-catalog .catalog-game .game-sets tbody td:nth-child(2){margin-left:44px}
.redesign-catalog .catalog-game .game-grades tbody tr{height:80px}
.redesign-catalog .catalog-game .game-grades thead th,.redesign-catalog .catalog-game .game-movers thead th{height:32px;padding:0 16px}
}
@media(min-width:768px){
.redesign-catalog .movers-faq{gap:8px}
.redesign-catalog .movers-faq>h2{margin-bottom:4px}
.redesign-catalog .movers-faq .catalog-question{border:0;background:var(--color-page-bg);border-radius:12px}
.redesign-catalog .movers-faq .catalog-question summary{padding:16px;row-gap:0}
.redesign-catalog .movers-faq .catalog-answer-preview{display:none}
}
.redesign-catalog .game-characters .catalog-character-chips a{min-width:calc((100% - 16px)/3 + 1px)}
.redesign-catalog .catalog-game .game-sets .catalog-set-link{padding-left:0}
.redesign-catalog .catalog-game .game-sets tbody td:nth-child(2){margin-left:0}
/* 08 character detail: 920:536334 / 920:537417. */
body.redesign-catalog main#main.catalog-character{padding:16px 0 24px}
.redesign-catalog .catalog-character>.page-title{height:52px;display:flex;align-items:center;margin-bottom:12px}
body.redesign-catalog .catalog-character>.page-title h1{margin:0}
body.redesign-catalog .catalog-character>h1{height:52px;display:flex;align-items:center;margin:0 0 12px}
.redesign-catalog .catalog-character .chart-table>div{max-height:none;overflow:visible}
.redesign-catalog .catalog-character .chart-table table{display:block;border-spacing:0}
.redesign-catalog .catalog-character .chart-table tbody{display:grid;gap:8px}
.redesign-catalog .catalog-character .chart-table tbody tr{height:64px;margin:0;padding:12px 16px;gap:2px 12px;align-content:center}
.redesign-catalog .catalog-character .chart-table tbody th,.redesign-catalog .catalog-character .chart-table tbody td{padding:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-catalog .catalog-character .chart-table tbody th{font-size:15px;line-height:20px}
.redesign-catalog .catalog-character .chart-table tbody th>a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.redesign-catalog .catalog-character .chart-table small{font-size:13px;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.redesign-catalog .catalog-character .chart-table tbody .catalog-character-set{display:none}
.redesign-catalog .catalog-character .catalog-price-label,.redesign-catalog .catalog-character .catalog-character-edition,.redesign-catalog .catalog-character .catalog-count-unit{display:none}
.redesign-catalog .catalog-character .catalog-character-chips{padding:0 16px}
.redesign-catalog .catalog-character .catalog-character-chips a{display:inline-flex;align-items:center;min-height:44px;border:1px solid var(--color-border);padding:0 14px;font-size:13px;line-height:18px;font-weight:500}
@media(max-width:767px){
.redesign-catalog .catalog-character .char-grid{display:flex;flex-direction:column;gap:8px}
.redesign-catalog .catalog-character .char-grid>li{padding:0;border-radius:8px}
.redesign-catalog .catalog-character .char-grid a{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 16px;height:72px}
.redesign-catalog .catalog-character .char-grid img{width:34px;height:48px;object-fit:contain;border-radius:4px}
.redesign-catalog .catalog-character .char-grid span,.redesign-catalog .catalog-character .char-grid b{font-size:15px;line-height:20px;font-weight:600}
.redesign-catalog .catalog-character .char-grid b{text-align:right}
.redesign-catalog .catalog-character .catalog-price-label,.redesign-catalog .catalog-character .catalog-character-edition,.redesign-catalog .catalog-character .catalog-count-unit{display:inline}
.redesign-catalog .catalog-character .character-table-0 tbody tr{grid-template-columns:minmax(0,1fr) auto}
.redesign-catalog .catalog-character .character-table-0 .catalog-main-price{font-size:15px!important;line-height:20px;font-weight:600}
.redesign-catalog .catalog-character .character-table-0 .catalog-secondary-price{font-size:13px!important;line-height:18px}
.redesign-catalog .catalog-character .character-table-1 tbody td:nth-child(2){font-size:13px;line-height:18px;color:var(--color-text-muted)}
.redesign-catalog .catalog-character .character-table-1 tbody td:last-child,.redesign-catalog .catalog-character .character-table-2 tbody td:nth-child(2){font-size:15px!important;line-height:20px}
.redesign-catalog .catalog-character .character-table-2 tbody td:last-child{font-size:13px!important;line-height:18px}
.redesign-catalog .catalog-character .catalog-character-chips{flex-direction:column;align-items:flex-start}
}
@media(min-width:768px){
body.redesign-catalog main#main.catalog-character{padding:12px 0}
.redesign-catalog .catalog-character>.page-title{margin-bottom:24px}
body.redesign-catalog .catalog-character>h1{margin-bottom:24px}
.redesign-catalog .catalog-character .char-grid>li{padding:12px}
.redesign-catalog .catalog-character .char-grid a{gap:4px}
.redesign-catalog .catalog-character .char-grid img{aspect-ratio:264/369;border:1px solid var(--color-border);border-radius:8px;margin-bottom:4px}
.redesign-catalog .catalog-character .chart-table thead{display:block;margin:0 0 12px}
.redesign-catalog .catalog-character .chart-table thead tr,.redesign-catalog .catalog-character .chart-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) 140px 140px;gap:12px;padding-inline:16px;align-items:center}
.redesign-catalog .catalog-character .chart-table .character-table-0 tr{grid-template-columns:minmax(0,1fr) 140px 140px 140px}
.redesign-catalog .catalog-character .chart-table .character-table-0:not(:has(.catalog-secondary-price)) tr{grid-template-columns:minmax(0,1fr) 140px 140px}
.redesign-catalog .catalog-character .chart-table thead th{padding:0;font-size:12px;line-height:16px;height:16px}
.redesign-catalog .catalog-character .chart-table tbody tr{height:72px;padding-block:12px;border-radius:8px}
.redesign-catalog .catalog-character .chart-table tbody th,.redesign-catalog .catalog-character .chart-table tbody td{font-size:16px;line-height:22px}
.redesign-catalog .catalog-character .character-table-0 thead th:nth-child(2),.redesign-catalog .catalog-character .character-table-1 thead th:nth-child(3){display:none}
.redesign-catalog .catalog-character .character-table-0 td:nth-child(3),.redesign-catalog .catalog-character .character-table-1 td:nth-child(2){font-size:13px;line-height:18px;font-weight:400;color:var(--color-text-muted)}
.redesign-catalog .catalog-character .catalog-main-price,.redesign-catalog .catalog-character .character-table-2 tbody td:nth-child(2){font-weight:600}
.redesign-catalog .catalog-character .char-faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.redesign-catalog .catalog-character .char-faq>h2{grid-column:1/-1;margin-bottom:4px}
.redesign-catalog .catalog-character .char-faq .catalog-question{border:0;background:var(--color-page-bg);border-radius:12px}
.redesign-catalog .catalog-character .char-faq summary{padding:16px;row-gap:0}
.redesign-catalog .catalog-character .char-faq .catalog-answer-preview{display:none}
.redesign-catalog .catalog-character .char-faq .catalog-question-title{display:flex;gap:12px;align-items:center}
.redesign-catalog .catalog-character .char-faq .catalog-question-title:before{content:'Q';color:var(--color-brand-link-text);font-weight:600;flex:none}
}
.redesign-catalog .game-grades>h2:after{display:none}
@media(max-width:767px){.redesign-catalog .game-grade-set{display:none}}
@media(min-width:768px){
.redesign-catalog .catalog-game .game-grades .chart-table table,.redesign-catalog .catalog-game .game-grades .chart-table thead,.redesign-catalog .catalog-game .game-movers .chart-table table,.redesign-catalog .catalog-game .game-movers .chart-table thead{display:block;border-spacing:0}
.redesign-catalog .catalog-game .game-grades .chart-table tbody,.redesign-catalog .catalog-game .game-movers .chart-table tbody{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.redesign-catalog .catalog-game .game-grades .chart-table tr{display:grid;grid-template-columns:minmax(0,1fr) repeat(4,156px)}
.redesign-catalog .catalog-game .game-movers .chart-table tr{display:grid;grid-template-columns:48px minmax(0,1fr) repeat(4,140px)}
.redesign-catalog .catalog-game .game-grades .chart-table tbody tr,.redesign-catalog .catalog-game .game-movers .chart-table tbody tr{height:72px;align-items:center;border-radius:8px}
.redesign-catalog .catalog-game .game-grades .chart-table th,.redesign-catalog .catalog-game .game-grades .chart-table td,.redesign-catalog .catalog-game .game-movers .chart-table th,.redesign-catalog .catalog-game .game-movers .chart-table td{width:auto;min-width:0}
.redesign-catalog .catalog-game .game-grades .chart-table thead th,.redesign-catalog .catalog-game .game-movers .chart-table thead th{height:16px;padding:0 16px;line-height:16px}
.redesign-catalog .game-grades tbody th a{font-size:16px;line-height:24px}
.redesign-catalog .game-grades tbody td:not(:nth-child(2)){font-size:16px;line-height:24px;font-weight:600}
.redesign-catalog .game-grades .catalog-expand,.redesign-catalog .game-movers .catalog-expand{margin-top:12px}
.redesign-catalog .catalog-game-moves>.catalog-eyebrow{min-height:28px}
}
@media(max-width:767px){
.redesign-catalog .game-grades .game-grade-set{display:none}
.redesign-catalog .catalog-game .game-editions table,.redesign-catalog .catalog-game .game-sets table,.redesign-catalog .catalog-game .game-grades table,.redesign-catalog .catalog-game .game-movers table{border-spacing:0}
.redesign-catalog .catalog-game .game-editions tbody tr,.redesign-catalog .catalog-game .game-sets tbody tr,.redesign-catalog .catalog-game .game-grades tbody tr{min-height:64px;padding:8px 16px}
.redesign-catalog .catalog-game .chart-table tbody tr:nth-last-child(1 of tr:not([hidden])){margin-bottom:0}
.redesign-catalog .catalog-game .catalog-expand{margin-top:12px}
}
/* Native controls reserve the enhanced controls’ final geometry before deferred scripts load. */
.redesign-catalog .catalog-search .filter-select>select:not([hidden]){width:100%;min-width:0;height:44px;min-height:44px;box-sizing:border-box}
.redesign-catalog .catalog-result-sort>select:not([hidden]){width:100%;height:32px;min-height:32px}
/* One inset per surface; titles start on the surface content edge. */
.redesign-catalog .catalog-area>h2,.redesign-catalog .catalog-eyebrow{margin-inline:0;margin-bottom:8px}
.redesign-catalog #highlights .section-heading,.redesign-catalog #collection .section-heading{margin-inline:0}
.redesign-catalog .catalog-search #search-form{margin-bottom:8px}
.redesign-catalog .catalog-search .filters{row-gap:8px}
.redesign-catalog #filter-summary{margin:0 0 8px}
.redesign-catalog .catalog-result-sort{margin-right:0}
.redesign-catalog #packs{margin-inline:0;column-gap:8px;row-gap:40px;padding-top:32px;overflow:visible}
.redesign-catalog .pack-tile{padding:8px 4px;gap:8px;border-radius:6px;overflow:visible;position:relative;isolation:isolate;background:none}
/* Paint selection behind the overflowing pack, with the check badge above it. */
.redesign-catalog .pack-tile:after{content:'';position:absolute;inset:0;background:var(--color-page-bg);border:1px solid transparent;border-radius:inherit;z-index:-1;pointer-events:none}
.redesign-catalog .pack-tile .pack-art{aspect-ratio:106/137.79;overflow:visible}
.redesign-catalog .pack-tile .pack-art>img{position:absolute;left:-10%;bottom:0;width:120%;height:calc(100% + 32px);max-width:none;max-height:none;object-fit:contain;transform:none}
.redesign-catalog .pack-tile .pack-art .no-art img{position:static;width:36%;height:auto}
@media(max-width:767px){
.redesign-catalog main#main.wrap{padding-top:8px}
.redesign-catalog .catalog-area{padding:8px;border-radius:8px;margin-bottom:8px}
.redesign-catalog .intro{margin-bottom:8px}
.redesign-catalog :is(.game-grid>li>a,.chart-table th,.chart-table td){padding-inline:8px}
.redesign-catalog .set-drawer #set-panel{padding:8px}
}
@media(min-width:768px){
.redesign-catalog .catalog-area{padding:24px}
.redesign-catalog #packs{padding-top:56px;row-gap:56px}
.redesign-catalog .pack-tile{padding:12px;isolation:isolate;background:none}
.redesign-catalog .pack-tile:after{content:'';position:absolute;inset:-24px 0 0;background:var(--color-page-bg);border-radius:8px;z-index:-1}
.redesign-catalog .pack-tile .pack-art{aspect-ratio:153/184.955}
.redesign-catalog .pack-tile .pack-art>img{left:-20%;width:140%;height:calc(100% + 56px)}
}
.redesign-catalog .pack-tile .pack-art{position:relative}
.redesign-catalog .pack-tile h2{word-break:keep-all;overflow-wrap:anywhere}
.catalog-set-head{display:flex;align-items:center;gap:8px;min-height:44px}
.redesign-catalog .catalog-set-head .catalog-eyebrow{margin:0;flex:none}
.redesign-catalog .catalog-set-head #filter-summary{flex:1;min-width:0;line-height:20px;margin:0}
.redesign-catalog .catalog-set-head .catalog-result-sort{float:none;margin:0;flex:none;width:80px}
.redesign-catalog .catalog-set-head .catalog-result-sort{position:static;inset:auto}
.redesign-catalog .pack-tile .pack-art>img{left:-22%;top:auto;bottom:-16px;width:144%;height:140.9%;object-fit:contain}
@media(min-width:768px){.redesign-catalog .pack-tile .pack-art>img{left:-34%;bottom:-20px;width:168%;height:146.06%}}
/* Keep the pack overhang vertical; its transparent canvas must not widen the page. */
.redesign-catalog .catalog-sets{overflow-x:clip}
/* Column widths include padding. Essential numeric values never use ellipsis. */
@media(min-width:768px){
.redesign-catalog .catalog-game :is(.game-grades,.game-movers) .chart-table :is(th,td){padding-inline:8px}
.redesign-catalog .catalog-game :is(.game-grades,.game-movers) .chart-table thead th{padding-inline:8px;text-align:right}
.redesign-catalog .catalog-game .game-grades .chart-table :is(th,td):first-child,.redesign-catalog .catalog-game .game-movers .chart-table :is(th,td):nth-child(2){text-align:left}
.redesign-catalog .catalog-game .game-movers .chart-table :is(th,td):first-child{padding-inline:4px;text-align:center;overflow:visible}
.redesign-catalog .catalog-game :is(.game-grades,.game-movers) .chart-table td{overflow:visible;text-overflow:clip;white-space:nowrap}
.redesign-catalog .movers-data-table thead th:first-child{text-align:center;padding-inline:8px}
}
@media(max-width:767px){
.redesign-catalog .catalog-faq.catalog-area{padding:8px}
.redesign-catalog .catalog-faq.catalog-area>h2{margin:0 0 8px}
.redesign-catalog .catalog-area>.section-heading h2{margin-inline:0}
}
.redesign-catalog .catalog-faq.catalog-area>h2{margin-inline:0}