/* /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/style.css */
:root{--bg:#f3f7f9;--ink:#142531;--muted:#778b9b;--mint:#1bd3ce;--line:#dee8ee;--panel:#eaf1f5}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 4%,#e7f7f733,transparent 42%),var(--bg);color:var(--ink);font:var(--text-body)/1.6 var(--font-sans);-webkit-font-smoothing:antialiased}html{scroll-behavior:smooth;scroll-padding-top:28px}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button,select{cursor:pointer}button{border:0}button:disabled{cursor:wait;opacity:.5}a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #6e66d7;outline-offset:4px}button,a{ -webkit-tap-highlight-color:transparent}.wrap{max-width:1200px;width:calc(100% - 112px);margin:auto}.site-header{height:100px;display:flex;align-items:center;gap:70px}.logo{display:block;width:210px;height:auto}.site-header nav{display:flex;align-self:stretch;gap:38px;font-weight:600}.site-header nav a{display:flex;align-items:center;position:relative}.site-header nav .active:after{content:'';height:3px;background:var(--mint);position:absolute;bottom:20px;left:0;right:0}.ui-language{margin-left:auto}.ui-language select{border:0;background:transparent;font-size:var(--text-data);padding:8px}.intro{position:relative;min-height:96px;display:flex;align-items:center;margin:4px 0 16px}.intro h1{font-size:clamp(30px,3.6vw,48px);line-height:var(--leading-snug);letter-spacing:var(--tracking-display);margin:0 0 9px;font-weight:700}.intro p{color:var(--muted);font-size:21px;margin:0;letter-spacing:var(--tracking-display)}.brand-mark{width:110px;height:100px;object-fit:contain;position:absolute;right:16px;opacity:.22;transform:rotate(12deg);z-index:-1}#search-form{display:flex;gap:14px}.search-box{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);border-radius:11px;height:61px;padding:0 19px;flex:1;min-width:0;box-shadow:0 4px 25px #294a6703}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;flex-shrink:0}input{border:0;outline:0!important;background:transparent;min-width:0;flex:1;font-size:var(--text-body)}input::placeholder{color:#8195a5}.search-box:focus-within{border-color:var(--mint);box-shadow:0 0 0 3px #1bd3ce18}.search-submit{background:none;font-size:22px;color:var(--muted);padding:5px;min-width:44px;min-height:44px}.scan{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:13px 27px;background:var(--color-brand-action-fill);border-radius:10px;font-weight:600;white-space:nowrap;color:var(--color-brand-action-on);}.scan:hover{background:#35e0d9}.filters{display:flex;align-items:center;gap:18px;margin:24px 0 25px}.filters select,.editions button{background:#fff;border:1px solid var(--line);border-radius:9px;padding:10px 17px;height:47px;font-size:var(--text-data)}.editions{display:flex;gap:9px}.editions button{display:flex;gap:10px;align-items:center;color:#607384;font-weight:500}.editions button[aria-pressed=true]{border-color:var(--mint);background:#ebfcfc;color:#008b91;box-shadow:inset 0 0 0 3px #fff}.flag.jp{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#cd0045 0 34%,#fff 36%);box-shadow:0 0 0 1px #eee}.sort{margin-left:auto}.status{font-size:var(--text-data);color:var(--muted);margin:0 0 13px;min-height:0}.status:empty{display:none}.pack-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.pack-tile{position:relative;text-align:left;padding:19px 21px 17px;border-radius:14px;background:linear-gradient(140deg,#eaf1f5,#e9f0f3);border:1px solid transparent;min-width:0;transition:background .2s,border-color .2s,transform .2s}.pack-tile:hover{background:#e2eff1;transform:translateY(-3px)}.pack-tile.selected{border-color:var(--mint);background:linear-gradient(125deg,#e5fafa,#edf8fa);box-shadow:inset 0 0 0 3px #faffff}.pack-tile.selected:before{content:'✓';position:absolute;top:17px;left:17px;color:white;background:var(--mint);border:2px solid #fff;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;z-index:1}.pack-art{height:265px;display:grid;place-items:center;margin:0 0 17px;overflow:hidden}.pack-art img{width:85%;height:91%;object-fit:contain;mix-blend-mode:multiply;filter:drop-shadow(7px 12px 7px #1a2f3a21);transform:rotate(5deg);transition:transform .3s}.pack-tile:nth-child(3n) img{transform:rotate(8deg)}.pack-tile:hover img{transform:rotate(2deg) translateY(-3px)}.pack-tile h2{font-size:var(--text-h3);line-height:var(--leading-snug);letter-spacing:var(--tracking-display);margin:0 0 5px;overflow-wrap:break-word}.pack-tile p{font-size:var(--text-label);color:var(--muted);margin:0 0 6px}.pack-tile .view{font-size:var(--text-data);font-weight:500}.view span{padding-left:12px}.no-art{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;height:100%;color:#8295a3}.no-art img{width:55px;height:66px;opacity:.35;filter:none;margin-bottom:13px}.no-art strong{font-size:23px;font-weight:500}.no-art small{font-size:var(--text-label)}.more{display:block;padding:10px 28px;margin:24px auto;background:transparent;border:1px solid #cddce5;border-radius:9px;font-size:var(--text-data)}.more:hover{background:#e9f3f6}.card-panel{margin:26px 0 0;padding:24px 26px;background:#ffffffeb;border:1px solid #e4edf2;border-radius:13px;scroll-margin-top:25px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 21px}.panel-title h2{font-size:21px;letter-spacing:var(--tracking-display);margin:0}.panel-title p,.panel-title>span{color:var(--muted);font-size:var(--text-label);margin:5px 0 0}.text-button{font-size:var(--text-data);background:transparent;white-space:nowrap;padding:8px}.card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:25px}.card-item{background:transparent;min-width:0;text-align:center;border-radius:8px;padding:2px 8px 10px}.card-item:hover{background:#f0f8fa}.card-image{height:216px;display:grid;place-items:center;margin-bottom:12px}.card-image img{height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 4px 4px #1730440a)}.card-item strong{display:block;font-size:var(--text-data);line-height:var(--leading-normal)}.card-item small{display:block;color:var(--muted);font-size:var(--text-label);margin:2px 0 6px}.card-item span{font-size:var(--text-label)}.data-note{font-size:var(--text-label);color:var(--muted);text-align:right;margin:18px 0 0}footer{display:flex;align-items:center;gap:22px;padding:30px 0 36px;color:var(--muted);font-size:var(--text-label)}footer .logo{width:160px}footer p{margin:0}footer>a.how{margin-left:auto}footer>span{font-size:var(--text-label)}.skeleton{height:375px;border-radius:14px;background:linear-gradient(110deg,#e6eef3 20%,#f8fbfc 45%,#e6eef3 70%);background-size:200% 100%;animation:shimmer 1.5s infinite}.empty{padding:45px 20px;text-align:center;color:var(--muted);grid-column:1/-1}.retry{background:transparent;text-decoration:underline;padding:8px;color:#007b83}dialog{border:1px solid var(--line);border-radius:20px;padding:42px;max-width:820px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 24px 90px #14253125}dialog::backdrop{background:#102a3c70;backdrop-filter:blur(7px)}.close{position:absolute;right:12px;top:9px;background:transparent;font-size:30px;line-height:1;padding:8px;color:#607080}#card-detail{min-height:250px}.detail-layout{display:grid;grid-template-columns:220px 1fr;gap:35px;align-items:start}.detail-layout>img{width:100%;max-height:350px;object-fit:contain}.detail-layout h2{font-size:27px;line-height:var(--leading-snug);margin:12px 0}.detail-layout p{color:var(--muted);font-size:var(--text-data)}.quote{border-top:1px solid var(--line);padding:13px 0}.quote strong{display:block;font-size:29px;line-height:var(--leading-snug)}.quote small{display:block;color:var(--muted);font-size:var(--text-label)}.quote .price-kind{font-size:var(--text-label);color:#0a8b89}.sr-only,.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip:focus{clip:auto;width:auto;height:auto;z-index:100;padding:15px;background:white}[hidden]{display:none!important}@keyframes shimmer{to{background-position:-200% 0}}@media(min-width:1500px){.wrap{max-width:1280px}.pack-art{height:295px}}@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.site-header{gap:40px}.logo{width:185px}.pack-grid{gap:13px}.pack-tile{padding:14px}.pack-art{height:220px}.pack-tile h2{font-size:var(--text-body)}.card-image{height:180px}.card-grid{gap:14px}.brand-mark{width:130px}.intro h1{font-size:38px}}@media(max-width:700px){.wrap{width:calc(100% - 36px)}.site-header{height:77px;gap:22px;flex-wrap:wrap}.logo{width:146px}.site-header nav{gap:18px;font-size:var(--text-label)}.site-header nav .active:after{bottom:14px}.site-header nav .how{display:none}.ui-language select{font-size:var(--text-label);padding:5px;max-width:78px}.intro{margin:14px 0 21px;min-height:104px}.intro h1{font-size:29px;max-width:290px}.intro p{font-size:var(--text-data)}.brand-mark{width:88px;height:100px;right:0;opacity:.14}.search-box{height:53px;padding:0 12px;gap:9px}input{font-size:var(--text-label)}.search-box svg{width:19px}#search-form{gap:8px}.scan{padding:11px 13px;font-size:var(--text-label);gap:6px}.scan svg{width:19px}.filters{gap:9px;margin:18px 0;flex-wrap:wrap}.filters select,.editions button{font-size:var(--text-label);height:39px;padding:8px 10px}.editions{gap:6px}.editions button{gap:6px}.sort{margin-left:auto}.pack-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pack-tile{padding:12px 13px 15px;border-radius:11px}.pack-art{height:205px;margin-bottom:13px}.pack-art img{width:92%;height:92%}.pack-tile h2{font-size:var(--text-body)}.pack-tile p{font-size:var(--text-label)}.pack-tile .view{font-size:var(--text-label)}.pack-tile.selected:before{width:23px;height:23px;font-size:var(--text-label);top:10px;left:10px}.card-panel{padding:19px 15px;margin-top:23px}.panel-title{align-items:flex-start;gap:8px}.panel-title h2{font-size:var(--text-body)}.panel-title p{font-size:var(--text-label)}.text-button{font-size:var(--text-label);padding:4px 0}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}.card-image{height:195px}.card-item{padding:0 3px 7px}.card-item strong{font-size:var(--text-label)}.card-item small{font-size:var(--text-label)}.data-note{font-size:var(--text-label);text-align:left}footer{flex-wrap:wrap;gap:14px;padding:27px 0}footer .logo{width:140px}footer p{font-size:var(--text-label)}footer>a.how{margin-left:0}.detail-layout{grid-template-columns:1fr;gap:15px}.detail-layout>img{width:170px;max-height:240px;margin:auto}.detail-layout h2{font-size:23px}dialog{padding:34px 24px;max-height:90svh}.skeleton{height:310px}.status{font-size:var(--text-label)}.no-art strong{font-size:var(--text-h3)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
/* Explicit image frames prevent intrinsic image dimensions from growing grid tracks. */
.pack-art,.card-image{position:relative;display:block}.card-image:not(.is-loaded){background:var(--color-surface-sunken);border-radius:8px}.pack-art>img{position:absolute;left:7.5%;top:5%;width:85%;height:90%;max-height:90%;filter:none}.card-image>img{position:absolute;inset:0;width:100%;height:100%;max-height:100%;object-fit:contain}.pack-tile h2{min-height:2.8em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pack-tile{display:flex;flex-direction:column}.pack-tile .view{margin-top:auto}.filters{flex-wrap:wrap}.product-type{margin-left:0}@media(max-width:700px){.pack-art>img{left:5%;width:90%;height:90%}.product-type select{max-width:160px}.pack-tile h2{min-height:2.8em}.pack-art{flex-shrink:0}.card-image{height:190px}}
@media(max-width:700px){.intro h1{word-break:keep-all;max-width:320px;font-size:28px;line-height:var(--leading-snug)}.intro{min-height:115px}.card-image{background:#f8fafb;border-radius:8px}.card-image img{mix-blend-mode:multiply}}
/* One accordion spans the gallery directly after the selected pack's row. */
.set-drawer{grid-column:1/-1;min-width:0;overflow:hidden;overflow-anchor:none}.set-drawer>.card-panel{margin:0;border-color:#b8e9e8;background:#fff}.pack-tile[aria-expanded=true] .view span{display:inline-block;transform:rotate(90deg)}
/* Product artwork includes its calibrated tilt and shadow. Do not transform it twice. */
.pack-tile .pack-art img{width:100%;height:100%;mix-blend-mode:normal;filter:none;transform:none}
.pack-tile:hover .pack-art img{transform:translateY(-3px)}
@media(prefers-reduced-motion:reduce){.pack-tile:hover .pack-art img{transform:none}}
/* Gallery: each pack image is a tile-wide canvas with the pack and its shadow baked at the mockup
position (tools/set-art/layout.json, 287x380 at a 287px tile), so the art box spans the full tile
width and scales with it. The canvas runs 18px past the box so the shadow fades under the title. */
.pack-tile{--pad-t:14px;--pad-x:18px;padding:var(--pad-t) var(--pad-x) 16px}
.pack-art{height:auto;aspect-ratio:287/362;margin:calc(-1*var(--pad-t)) calc(-1*var(--pad-x)) 0;overflow:visible}
.pack-tile .pack-art>img{inset:auto;top:0;left:0;width:100%;height:auto;max-height:none;object-fit:fill}
.skeleton{height:auto;aspect-ratio:287/475}
.card-grid{gap:20px}
.card-item{padding:0 4px 8px}
.card-image{height:240px;margin-bottom:10px}
@media(min-width:1500px){.card-image{height:258px}}
@media(min-width:701px) and (max-width:1000px){.pack-tile{--pad-t:12px;--pad-x:12px;padding-bottom:12px}.card-image{height:200px}}
@media(max-width:700px){.pack-tile{--pad-t:10px;--pad-x:11px;padding-bottom:13px}.card-image{height:clamp(185px,56vw,240px)}.card-grid{gap:18px 12px}}
/* Priced cards: amount in the card's own currency, muted 「시세 없음」 when there is no price. */
.card-item .card-price{display:block;min-height:1.6em;font-size:var(--text-data);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}a.text-button{display:inline-flex;align-items:center;min-height:44px;color:#007f85}@media(max-width:700px){.card-item .card-price{font-size:var(--text-data)}a.text-button{font-size:var(--text-label)}}
.card-item .card-price.unpriced{font-weight:400;color:var(--muted)}
/* Search: card results sit above the set grid; no matching sets is one line. */
#search-results{margin:0 0 26px}
.empty-line{grid-column:1/-1;margin:0;font-size:var(--text-data);color:var(--muted)}
.editions button:disabled{cursor:not-allowed}
@media(max-width:700px){
.pack-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pack-tile{--pad-t:7px;--pad-x:8px;padding-bottom:9px}
body .pack-tile h2{font-size:14px;line-height:1.35;min-height:2.7em;margin:4px 0 0;overflow-wrap:break-word}
.pack-tile p{font-size:12px;line-height:1.4;margin:4px 0 0;overflow-wrap:anywhere}
.pack-release{display:block;font-size:0}
.pack-release time{font-size:12px;white-space:nowrap}
.pack-tile.selected:before{top:6px;left:6px;width:20px;height:20px;font-size:12px}
#set-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 8px}
#set-cards .card-item{padding:0 0 4px;min-width:0}
#set-cards .card-image{height:auto;aspect-ratio:5/7;margin-bottom:7px}
#set-cards .card-identity{flex-direction:column;flex-wrap:nowrap;gap:4px}
body #set-cards .card-item strong{width:100%;font-size:14px;line-height:1.35;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#set-cards .card-item small{font-size:12px;line-height:1.4;overflow-wrap:anywhere}
#set-cards .card-price{font-size:14px}
}
/* 결과가 들어와도 바닥이 첫 화면 안에서 밀리지 않게 본문 자리를 먼저 잡는다 */
main#main.wrap:has(#packs){min-height:100vh;min-height:100svh}
#results:has(>p.empty){min-height:70vh;min-height:70svh}
/* 세트 이름은 단어(어절) 단위로 줄바꿈 — 화면 언어와 무관하게 한국어 세트 이름도 · 위 2줄 말줄임 그대로 */
.pack-tile h2{word-break:keep-all}
/* 판 배지(8번 · 2026-10-17) — 가격 옆 초판(민트) · 무제한. set.css 의 .badge 와 같은 모양 */.badge.print-run{display:inline-flex;align-items:center;min-height:23px;padding:2px 8px;margin-left:8px;vertical-align:middle;font-size:var(--text-label);font-weight:600;line-height:1.2;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;letter-spacing:var(--tracking-kicker)}.badge.print-run.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))}.price-tag:has(.print-run) .price-label{display:inline-block}
/* /explore/detail.css */
:root{--muted:#647c8d}.breadcrumb a:hover{color:#007f85}.detail-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}.hero-art{background:linear-gradient(145deg,#e8f3f7,#edf8f9);border-radius:20px;padding:30px;display:flex;align-items:center;justify-content:center;min-height:380px}.hero-art img{display:block;width:100%;height:540px;object-fit:contain;filter:drop-shadow(0 10px 14px #17304418)}.detail-copy{min-width:0}.detail-copy h1{font-size:clamp(32px,4vw,56px);line-height:var(--leading-snug);letter-spacing:var(--tracking-display);margin:0 0 18px;overflow-wrap:anywhere}.identity{font-size:var(--text-body);color:var(--muted);margin:0 0 24px}.edition-links{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;align-items:center}.edition-links h2{width:100%;font-size:var(--text-data);font-weight:500;margin:0 0 4px}.edition-links a,.edition-links span{border:1px solid var(--line);border-radius:30px;background:white;padding:10px 17px;min-height:44px;font-size:var(--text-data)}.edition-links .selected{background:var(--color-brand-action-fill);border-color:var(--mint);font-weight:600;color:var(--color-brand-action-on);}.price-panel{border:1px solid var(--line);border-radius:16px;background:#ffffffd9;padding:30px}.current-price{display:block;font-size:clamp(34px,4.6vw,64px);font-weight:700;letter-spacing:var(--tracking-display);line-height:var(--leading-snug);font-variant-numeric:tabular-nums;margin-bottom:24px;overflow-wrap:anywhere}.card-facts{margin:0}.card-facts div{display:flex;gap:20px;justify-content:space-between;padding:14px 0;border-top:1px solid var(--line)}.card-facts dt{color:var(--muted);font-size:var(--text-data);flex-shrink:0}.card-facts dd{margin:0;text-align:right;font-size:var(--text-body)}.history-panel{margin:28px 0;background:#ffffffdb;border:1px solid var(--line);border-radius:16px;padding:24px 28px}.history-head,.related-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:18px}.history-head h2,.related-head h2{font-size:24px;margin:0;letter-spacing:var(--tracking-display)}.periods{display:flex;gap:8px}.periods button{min-height:44px;border:1px solid var(--line);background:white;border-radius:22px;padding:8px 19px;font-size:var(--text-data)}.periods button[aria-pressed=true]{background:var(--color-brand-action-fill);border-color:var(--mint);font-weight:600;color:var(--color-brand-action-on);}.chart-wrap{position:relative}.chart-svg{display:block;width:100%;height:auto;aspect-ratio:1000/240;stroke:none;overflow:visible;touch-action:pan-y}.chart-svg text{fill:var(--muted);font-size:var(--text-data);font-family:inherit}.chart-grid{stroke:var(--line);stroke-dasharray:4 4;stroke-width:1}.chart-line{fill:none;stroke:#00bcb7;stroke-width:2.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}.chart-dot{fill:var(--mint);stroke:white;stroke-width:2}.chart-cross{stroke:#82a7b4;stroke-width:1;stroke-dasharray:3 3}.chart-readout{min-height:24px;margin:0 0 10px;text-align:right;font-size:var(--text-data);font-variant-numeric:tabular-nums}.chart-table{font-size:var(--text-label);color:var(--muted)}.chart-table summary{cursor:pointer;padding:10px 0}.chart-table table{border-collapse:collapse;width:100%;text-align:left}.chart-table td,.chart-table th{padding:8px;border-bottom:1px solid var(--line)}.chart-table>div{max-height:240px;overflow:auto}.related-head a{font-size:var(--text-data);white-space:nowrap;color:#007f85;padding:10px 0}.card-grid{gap:18px}.card-grid a{background:#eaf2f5;border-radius:12px;padding:16px;display:block}.card-grid a:hover{background:#e1f4f4}.card-grid .card-image{height:235px}.card-grid strong{font-size:var(--text-data)}.card-grid small{font-size:var(--text-label)}.chart-empty{min-height:160px;display:grid;place-items:center;color:var(--muted)}#related{margin:28px 0 12px}footer>a.explore{margin-left:auto}.load-error{padding:70px 0;text-align:center}.no-price{font-size:25px;color:var(--muted)}
@media(max-width:900px){.detail-hero{gap:26px}.hero-art{padding:22px;min-height:0}.hero-art img{height:420px}.price-panel{padding:22px}.card-grid .card-image{height:185px}.history-panel{padding:22px}.current-price{font-size:42px}}
@media(max-width:700px){.site-header{gap:14px;flex-wrap:nowrap}.site-header .logo{width:134px}.detail-hero{grid-template-columns:1fr;gap:24px}.hero-art{padding:20px;max-width:390px;width:100%;margin:auto}.hero-art img{height:340px}.detail-copy h1{font-size:34px;margin-bottom:8px}.identity{margin-bottom:16px;font-size:var(--text-data)}.edition-links{margin-bottom:18px}.price-panel{padding:22px}.current-price{font-size:46px;margin-bottom:18px}.history-panel{padding:18px 14px;margin-top:22px}.history-head{align-items:flex-start;flex-direction:column;gap:12px}.history-head h2,.related-head h2{font-size:21px}.periods{width:100%;gap:6px}.periods button{flex:1;padding:8px 10px}.chart-svg{aspect-ratio:1000/390}.chart-svg text{font-size:24px}.chart-readout{font-size:var(--text-label)}.related-head{align-items:center;gap:10px}.related-head a{font-size:var(--text-label)}.card-grid a{padding:12px 8px}.card-grid .card-image{height:195px}.card-grid strong{font-size:var(--text-data)}.card-grid small{font-size:var(--text-label)}.card-facts dd{font-size:var(--text-data)}.card-facts dt{font-size:var(--text-data)}}
@media(max-width:700px){.chart-svg text{font-size:34px}}
/* Optical stage: live card, left attributes, right price tag. */
.detail-hero.stage{display:block}.stage-title{text-align:center;margin:0 auto 18px;max-width:720px}.stage-title h1{font-size:clamp(28px,3.3vw,46px);line-height:var(--leading-snug);letter-spacing:var(--tracking-display);margin:0 0 10px;overflow-wrap:anywhere}.stage-title .identity{margin:0;color:var(--muted)}.stage-field{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,1.3fr) minmax(0,1fr);gap:36px;align-items:center;min-height:510px;isolation:isolate}.optical-rings{position:absolute;z-index:-1;width:520px;max-width:70%;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #1bd3ce38;border-radius:50%;background:radial-gradient(ellipse,#b1f2ed28,transparent 67%);pointer-events:none}.optical-rings:before,.optical-rings:after{content:'';position:absolute;inset:20px;border:1px solid #1bd3ce35;border-radius:50%}.optical-rings:after{inset:-20px;border:1px dashed #1bd3ce45;animation:orbit 95s linear infinite}.stage-facts{margin:0;display:flex;flex-direction:column;gap:30px;min-width:0;padding:15px 0}.stage-facts>div{animation:float 6s ease-in-out infinite;max-width:230px}.stage-facts>div:nth-child(2){animation-delay:-2s}.stage-facts>div:nth-child(3){animation-delay:-4s}.stage-facts>div:nth-child(4){animation-delay:-1s}.stage-facts dt{font-size:var(--text-label);color:var(--muted);margin:0 0 7px}.stage-facts dd{font-size:var(--text-body);font-weight:600;line-height:var(--leading-normal);margin:0;overflow-wrap:anywhere}.stage-facts dd:after{content:'';display:block;width:24px;height:1px;background:var(--mint);margin-top:12px}.stage .hero-art{padding:26px 0;background:none;min-height:0;perspective:1100px;width:100%;max-width:none;touch-action:pan-y}.card-float{width:100%;animation:float 7s ease-in-out infinite}.card-tilt{position:relative;width:100%;margin:auto;will-change:transform;transform-style:preserve-3d;isolation:isolate}.stage .hero-art img{width:100%;height:450px;object-fit:contain;filter:drop-shadow(0 18px 18px #16394526);user-select:none;-webkit-user-drag:none}.card-glare{position:absolute;inset:0;border-radius:14px;pointer-events:none;background:radial-gradient(ellipse at var(--glare-x,50%) var(--glare-y,50%),#ffffff60,transparent 52%);mix-blend-mode:screen;opacity:.35}.price-anchor{min-width:0;z-index:2}.stage .current-price{font-size:clamp(28px,3.6vw,54px);letter-spacing:var(--tracking-display);margin:0;line-height:var(--leading-snug)}.stage .no-price{font-size:23px}.stage .edition-links{justify-content:center;margin:22px auto 38px;max-width:850px}.stage .edition-links h2{text-align:center;font-size:var(--text-label)}.stage .edition-links a,.stage .edition-links span{background:#ffffffc9}.stage .edition-links .selected{background:var(--color-brand-action-fill);color:var(--color-brand-action-on);}.motion-paused *,.motion-paused .optical-rings:after{animation-play-state:paused!important}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes orbit{to{transform:rotate(360deg)}}
@media(max-width:1000px){.stage-field{gap:22px;grid-template-columns:minmax(0,1fr) minmax(210px,1.25fr) minmax(0,1fr);min-height:420px}.stage .hero-art img{height:355px}.stage-facts{gap:20px}.stage-facts dd{font-size:var(--text-data)}.price-tag{padding:26px 12px 26px 18px}.stage .current-price{font-size:32px}.optical-rings{width:420px}}
@media(max-width:700px){.stage-title{margin:22px auto 6px}.stage-title h1{font-size:29px}.stage-field{grid-template-columns:1fr;gap:12px;min-height:0}.stage .hero-art{grid-row:1;padding:20px 0 0;max-width:270px;margin:auto}.stage .hero-art img{height:350px}.optical-rings{width:340px;max-width:98%;top:190px}.stage-lines{display:none}.price-anchor{grid-row:2;width:min(280px,90%);margin:8px auto 12px}.price-tag{padding:18px 24px;text-align:center}.stage .current-price{font-size:40px}.price-label{margin-bottom:5px}.stage-facts{grid-row:3;display:grid;grid-template-columns:1fr 1fr;gap:18px 22px;padding:18px 8px}.stage-facts>div{max-width:none}.stage-facts dd{font-size:var(--text-data)}.stage-facts dt{font-size:var(--text-label)}.stage-facts dd:after{margin-top:8px}.stage .edition-links{margin:16px auto 24px}.stage .edition-links a,.stage .edition-links span{padding:10px 13px;font-size:var(--text-label)}}
@media(prefers-reduced-motion:reduce){.stage *,.stage .optical-rings:after{animation:none!important;transition:none!important}.card-tilt{transform:none!important;will-change:auto}}
.stage .card-tilt{max-width:322px}.stage .hero-art img{height:auto;aspect-ratio:322/450}.stage .hero-art img{border-radius:9px}.stage .card-glare{border-radius:9px}@media(max-width:1000px){.stage .card-tilt{max-width:254px}}@media(max-width:700px){.stage .card-tilt{max-width:250px}}
@media(max-width:700px){.stage-field{overflow:clip;padding:12px 0}.optical-rings:after{inset:0}}
/* Same optics and perspective as the homepage's extracted card. */
.stage .hero-art{perspective:1200px}.stage .card-float{animation:none}.stage .card-tilt{cursor:grab;transform-style:preserve-3d}.stage .card-tilt:active{cursor:grabbing}.stage .hero-art img{box-shadow:0 0 0 1px #ffffffb3,0 22px 48px #17232c20;filter:none}.card-foil,.stage .card-glare{position:absolute;inset:0;pointer-events:none;border-radius:9px}.card-foil{background:repeating-linear-gradient(115deg,transparent 0%,rgba(36,213,203,.35) 12%,rgba(119,96,245,.18) 21%,rgba(240,139,218,.3) 30%,rgba(255,209,124,.3) 37%,transparent 46%);background-size:280% 280%;background-position:var(--fx,50%) var(--fy,50%);mix-blend-mode:color-dodge;opacity:var(--foil,.2)}.stage .card-glare{background:radial-gradient(ellipse at var(--gx,50%) var(--gy,35%),#ffffff8c 0%,#ffffff1a 27%,transparent 62%);mix-blend-mode:screen;opacity:.45}
/* Preserve the same nested perspective / edge / raised face as the home. */
.stage .hero-art{perspective:none}.stage .card-float{display:grid;place-items:center;perspective:1200px;animation:none}.stage .card-tilt{isolation:auto;max-width:none;width:clamp(240px,27vw,430px);margin:0}.stage .sh-face>img{height:100%;aspect-ratio:auto;filter:none;box-shadow:none;border-radius:0}@media(max-width:760px){.stage .card-tilt{width:min(53vw,230px)}}
/* Match the home .art input dimensions, centered on the detail card. */
.stage .hero-art{position:relative}.home-motion-bounds{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc((100vw - 10vw) / 2.08);height:clamp(610px,calc(100svh - 90px),1100px);pointer-events:none;visibility:hidden}@media(min-width:1700px){.home-motion-bounds{width:calc(1600px / 2.08)}}@media(max-width:760px){.home-motion-bounds{width:88vw;height:100%}}
/* /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/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))}}
/* /explore/filters.css */
.filters{display:flex;align-items:center;gap:10px;padding:18px 0 14px;border-bottom:1px solid var(--line);margin-bottom:0;flex-wrap:wrap}
.filters .filter-select{position:relative;display:block;min-width:126px;flex:0 1 auto;margin:0}
.filters .sort{margin-left:auto;min-width:118px}
.filter-trigger{position:relative;display:grid;gap:3px;text-align:left;width:100%;min-height:58px;padding:9px 34px 9px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);cursor:pointer}
.filter-caption{font-size:var(--text-label);color:var(--muted);font-weight:400;line-height:var(--leading-snug)}.filter-trigger strong{font-size:var(--text-data);font-weight:500;white-space:nowrap;max-width:170px;text-overflow:ellipsis;overflow:hidden}.filter-arrow{position:absolute;right:13px;top:20px;color:var(--muted)}
.filter-trigger:hover,.filter-trigger[aria-expanded=true]{border-color:var(--mint);background:color-mix(in srgb,var(--mint) 5%,var(--bg))}
.filter-menu{position:absolute;top:calc(100% + 7px);left:0;min-width:100%;width:max-content;max-width:280px;max-height:320px;overflow:auto;z-index:40;border:1px solid var(--line);border-radius:12px;padding:6px;background:var(--bg);box-shadow:0 14px 36px color-mix(in srgb,var(--ink) 14%,transparent)}
.filter-menu[hidden]{display:none}.filter-menu button{display:block;position:relative;width:100%;min-height:42px;padding:10px 36px 10px 12px;border:0;border-radius:7px;text-align:left;background:transparent;color:var(--ink);font-size:var(--text-data);cursor:pointer}
.filter-menu button:hover,.filter-menu button:focus-visible{background:var(--panel)}.filter-menu button[aria-selected=true]{background:color-mix(in srgb,var(--mint) 12%,var(--bg));font-weight:600}.filter-menu button[aria-selected=true]:after{content:'✓';position:absolute;right:12px;color:var(--mint)}
.filters .editions{gap:3px;padding:4px;border:1px solid var(--line);border-radius:10px;min-height:58px;background:var(--panel)}.filters .editions button{border:0;border-radius:7px;min-height:46px;padding:8px 10px;background:transparent}.filters .editions button[aria-pressed=true]{background:var(--bg);box-shadow:0 2px 5px color-mix(in srgb,var(--ink) 7%,transparent)}
.filter-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:46px;margin-bottom:10px;font-size:var(--text-label);color:var(--muted)}.filter-summary>b,.filter-summary b{color:var(--ink)}.filter-summary>span{margin-right:10px}.filter-summary button{min-height:32px;padding:4px 10px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);font-size:var(--text-label);cursor:pointer}.filter-summary button span{margin-left:6px}.filter-summary button[data-clear=all]{border:0;background:transparent;color:var(--muted)}
@media(max-width:700px){.filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.filters .filter-select{min-width:0;width:100%}.filters .editions{grid-column:1/-1;grid-row:1;justify-content:space-between}.filters .editions button{flex:1}.filters .sort{margin-left:0}.filters .filter-select:last-child{grid-column:1/-1}.filter-trigger strong{max-width:100%}.filter-menu{width:100%;max-width:none}.filter-summary button{min-height:40px}}
.filter-menu{scrollbar-width:none;-ms-overflow-style:none}.filter-menu::-webkit-scrollbar{display:none}
.filter-icon{display:block;width:28px;height:28px;flex:none}
.filters .editions{gap:4px}.filters .editions button{width:48px;min-width:48px;padding:8px;justify-content:center}.filters .editions .filter-icon{width:27px;height:27px}
.filters .game-icons{min-width:80px}.game-icons .filter-trigger{height:58px;padding:10px 30px 10px 12px;display:flex;align-items:center;justify-content:center}.game-icons .filter-caption{display:none}.game-icons .filter-menu{min-width:80px}.game-icons .filter-menu button{display:flex;justify-content:center;padding:8px 25px 8px 8px}
.pack-tile .view{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);color:var(--muted)}.pack-tile .view svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}.pack-tile[aria-expanded=true] .view{color:var(--ink)}.pack-tile[aria-expanded=true] .view svg{transform:rotate(180deg)}
@media(max-width:700px){.filters .editions button{flex:1}.filters .game-icons .filter-trigger{justify-content:flex-start}.game-icons .filter-menu button{justify-content:flex-start;padding-left:14px}}
.filters .game-icons{min-width:150px}.game-icons .filter-trigger{padding:9px 30px 9px 13px}.game-logo{display:block;width:102px;height:35px;object-fit:contain}.game-icons .filter-menu{min-width:150px}.game-icons .filter-menu button{min-height:60px;padding:10px 30px 10px 12px;align-items:center}.filters .editions button{width:54px;min-width:54px}.edition-badge{display:block;width:30px;height:20px;object-fit:contain;border-radius:3px;box-shadow:0 0 0 1px var(--line);background:white;overflow:hidden}.globe-badge{display:flex;align-items:center;justify-content:center;color:var(--ink)}.filters .editions .globe-badge .filter-icon{width:20px;height:20px}
.filters .game-icons{min-width:82px}.game-icons .filter-menu{min-width:82px}.game-icons .filter-trigger{padding:8px 28px 8px 12px}.game-symbol{display:block;width:28px;height:28px;object-fit:contain}.game-symbol.pokemon-symbol{width:38px;height:38px;margin:-5px}.game-icons .filter-menu button{min-height:52px;padding:10px 30px 10px 15px}
.game-symbol.onepiece-symbol{width:34px;height:34px;margin:-3px;mix-blend-mode:multiply}
#search-form .search-action{display:flex;align-items:center;justify-content:center;gap:10px;min-width:112px;padding:12px 22px;border:1px solid var(--mint);border-radius:12px;background:var(--color-brand-action-fill);font-size:var(--text-data);font-weight:600;white-space:nowrap;color:var(--color-brand-action-on);}#search-form .search-action:hover{background:color-mix(in srgb,var(--mint) 80%,white)}@media(max-width:700px){#search-form .search-action{min-width:70px;padding:10px 12px;font-size:var(--text-label);gap:6px}#search-form .search-action svg{width:18px;height:18px}}
.game-icons .filter-trigger strong{display:flex;align-items:center;justify-content:center;overflow:visible;min-width:38px;height:38px}.game-icons .filter-trigger{padding:8px 30px 8px 10px}.game-symbol.pokemon-symbol,.game-symbol.onepiece-symbol{margin:0;flex:none}.filter-arrow{right:10px;top:50%;transform:translateY(-50%);display:flex}.filter-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6}.filter-trigger[aria-expanded=true] .filter-arrow svg{transform:rotate(180deg)}.pack-tile .view{justify-content:center;min-height:36px}.pack-tile .view .sr-only{padding:0}
#search-form .search-action{min-width:61px;width:61px;height:61px;padding:0;flex:none}#search-form .search-action svg{width:24px;height:24px}.icon-action,#all-cards.icon-action{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:10px;color:var(--ink)}.icon-action:hover{background:var(--panel)}.more{width:48px;height:44px;padding:0;display:grid;place-items:center}.more[hidden]{display:none}.card-image{position:relative}.filter-summary button[data-clear=all]{display:grid;place-items:center;width:36px;padding:0}.filter-summary button[data-clear=all] svg{width:18px;height:18px}footer>p[data-t=tagline]{display:none}@media(max-width:700px){#search-form .search-action{min-width:53px;width:53px;height:53px}}
.card-identity{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}.card-identity .badge{display:inline-flex;align-items:center;min-height:23px;padding:2px 8px;font-size:var(--text-label);font-weight:600;background:var(--bg);border:1px solid var(--line);border-radius:4px;letter-spacing:var(--tracking-kicker);line-height:var(--leading-snug)}.card-identity .badge.special{color:var(--color-link,var(--ink));border-color:color-mix(in srgb,var(--mint) 50%,var(--line));background:color-mix(in srgb,var(--mint) 9%,var(--bg))}
@media(max-width:700px){
.intro{min-height:48px;margin:4px 0 12px;padding:0}.intro h1{font-size:22px;line-height:var(--leading-snug);margin:0;max-width:none}.intro .brand-mark{width:48px;height:54px;right:3px;opacity:.12}
.filters{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:12px 0 0;padding:0 0 10px}
.filters .game-icons{grid-column:1;grid-row:1;min-width:0}.filters .editions{grid-column:2/-1;grid-row:1;min-height:46px;height:46px;padding:2px;gap:3px}.filters .editions button{min-width:0;width:auto;height:40px;min-height:40px;padding:6px;flex:1}
.filters .game-icons .filter-trigger{height:46px;min-height:46px;padding:3px 21px 3px 6px;justify-content:center}.game-icons .filter-trigger strong{min-width:32px;height:32px}.game-symbol.pokemon-symbol{width:34px;height:34px}.game-symbol.onepiece-symbol{width:30px;height:30px}.game-icons .filter-arrow{right:3px}
.filters .product-type{grid-column:1;grid-row:2}.filters .series-filter{grid-column:2;grid-row:2}.filters .year-filter{grid-column:3;grid-row:2}.filters .sort.filter-select:last-child{grid-column:4;grid-row:2;min-width:0}
.filters .filter-select:not(.game-icons) .filter-trigger{min-height:44px;height:44px;padding:8px 19px 8px 7px;display:flex;align-items:center}.filter-caption{display:none}.filter-trigger strong{font-size:var(--text-label);max-width:100%;min-width:0}.filter-arrow{right:3px}.filter-arrow svg{width:18px;height:18px}
.filter-menu{width:max-content;min-width:100%;max-width:min(260px,calc(100vw - 36px))}.year-filter .filter-menu,.sort .filter-menu{left:auto;right:0}.filter-menu button{white-space:nowrap}
.filter-summary{min-height:34px;margin-bottom:4px;font-size:var(--text-label);gap:5px}.filter-summary button{min-height:30px}
}
/* 2026-10-11 UX 점검: 넓은 PC 에서 게임 · 언어판 이름, 휴대폰 언어판 버튼 44px, 「전체 카드 보기」 글자, 펼친 세트 6장 한 줄 */
.edition-name,.game-name{display:none}
@media(min-width:1200px){.filters .editions button{width:auto;min-width:54px;gap:8px;padding:8px 12px}.edition-name,.game-name{display:inline;font-size:var(--text-label);font-weight:500;white-space:nowrap}.game-icons .filter-trigger strong,.game-icons .filter-menu button{gap:8px}}
@media(max-width:700px){.filters .editions{min-height:50px;height:50px}.filters .editions button{height:44px;min-height:44px}.filters .game-icons .filter-trigger{height:50px;min-height:50px}}
#all-cards{flex:none;gap:6px;padding:0 14px;border:1px solid var(--line);border-radius:10px;color:var(--ink);white-space:nowrap}#all-cards:hover{background:var(--panel)}#all-cards svg{width:20px;height:20px}
@media(min-width:701px){#set-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1001px){#set-cards{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}#set-cards .card-image{height:auto;aspect-ratio:5/7}}
/* /explore/movers.css */
.catalog-page{padding-block:24px 48px}
.catalog-page h1{font-size:32px;line-height:1.25;letter-spacing:-.025em;margin:16px 0 24px}
.market-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.market-date,.market-basis{color:var(--slate-600);font-size:13px}
.market-basis{margin:16px 0 20px;line-height:1.6}
.market-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.market-panel{background:var(--white);border:1px solid var(--slate-200);border-radius:16px;overflow:hidden;min-width:0}
.market-panel-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--slate-200);padding:18px 20px}
.market-panel-heading h2{font-size:17px;line-height:1.4;margin:0;font-weight:600}
.market-panel-heading>span{font-size:24px}
.market-panel ol{list-style:none;padding:0;margin:0;counter-reset:rank}
.market-panel li{counter-increment:rank;border-bottom:1px solid var(--slate-100)}
.market-panel li:last-child{border:0}
.market-card{display:grid;grid-template-columns:16px 52px minmax(0,1fr) auto;align-items:center;gap:12px;padding:16px 20px;text-decoration:none;color:var(--ink);min-height:114px}
.market-card:before{content:counter(rank);font-size:12px;color:var(--slate-600);font-variant-numeric:tabular-nums}
.market-card:hover{background:var(--slate-50)}
.market-art{display:block;width:52px;height:73px;background:var(--slate-100);border-radius:5px;overflow:hidden}
.market-art img{display:block;width:100%;height:100%;object-fit:contain}
.market-identity{min-width:0;display:flex;flex-direction:column;gap:5px}
.market-identity strong{font-size:15px;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.market-identity small{font-size:12px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--slate-600)}
.market-edition{font-size:12px;color:var(--slate-600)}
.market-numbers{display:flex;flex-direction:column;gap:4px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.market-numbers strong{font-size:18px;line-height:1.3;letter-spacing:-.015em;font-weight:600}
.market-change{font-size:14px;font-weight:600}
.market-numbers small{font-size:12px}
.market-before{font-size:12px;color:var(--slate-600)}
.up .market-change,.up .market-panel-heading>span{color:var(--green-600)}
.down .market-change,.down .market-panel-heading>span{color:var(--chart-finish-reverse)}
.market-panel .empty{padding:24px 20px;color:var(--slate-600);font-size:14px;line-height:1.6}
[hidden]{display:none!important}
@media(max-width:850px){.market-board{grid-template-columns:1fr;gap:20px}.market-card{grid-template-columns:16px 52px minmax(0,1fr) auto}}
@media(max-width:480px){.catalog-page h1{font-size:26px;margin:12px 0 20px}.market-toolbar{align-items:flex-start;flex-direction:column;gap:12px}.market-card{padding:14px 12px;gap:8px;grid-template-columns:14px 44px minmax(0,1fr) auto}.market-art{width:44px;height:62px}.market-identity strong{font-size:14px}.market-numbers strong{font-size:16px}.market-change{font-size:13px}.market-before{font-size:12px}.market-panel-heading{padding:16px}.market-edition{font-size:12px}}
.market-toolbar .filters{margin:0;padding:0;border:0}.market-toolbar .editions{display:flex;align-items:center}.market-toolbar .editions button{color:var(--ink);font:inherit;font-size:13px;cursor:pointer}
@media(max-width:700px){.market-toolbar .filters{width:100%;grid-template-columns:82px minmax(0,1fr);gap:7px}.market-toolbar .filters .editions{grid-column:2;grid-row:1}.market-toolbar .filters .game-icons{grid-column:1;width:82px}}
.market-toolbar .editions button[data-edition=all]{width:auto;min-width:44px;min-height:44px;padding:0 12px;white-space:nowrap}
.market-switch{display:none}
@media(max-width:700px){.market-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:12px;border:1px solid var(--slate-200);border-radius:12px;background:var(--slate-50)}.market-switch button{min-height:44px;border:0;border-radius:9px;background:transparent;color:var(--ink);font:inherit;font-size:14px;font-weight:600;cursor:pointer}.market-switch button[aria-pressed=true]{background:var(--white);box-shadow:0 1px 3px color-mix(in srgb,var(--ink) 12%,transparent)}.market-panel-heading{display:none}.market-board[data-show=up] .market-panel.down,.market-board[data-show=down] .market-panel.up{display:none}.market-numbers{display:block}.market-numbers>strong,.market-numbers>.market-change{display:block}.market-numbers small:after{content:' · '}}
/* SEO3 2026-10-18 — 시세가 바뀐 카드 전체 표(접힘) · 묻고 답하기: 보드 아래, 폭 넘침 없이 */
.movers-table{margin:var(--space-8,32px) 0 0;min-width:0;max-width:100%}.movers-table summary{cursor:pointer;font-weight:700;font-size:15px;padding:var(--space-3,12px) 0}
.movers-table table{width:100%;font-size:13px;table-layout:fixed}.movers-table th[scope=col]:first-child{width:40%}.movers-table th[scope=row]{overflow-wrap:anywhere}.movers-table .price{white-space:nowrap;font-weight:700}.movers-table td small,.movers-table th small{display:block;color:var(--muted);font-size:12px;font-weight:400;white-space:nowrap}.movers-table small.up{color:var(--green-600)}.movers-table small.down{color:var(--chart-finish-reverse)}.movers-table caption{caption-side:top;text-align:left;font-size:12px;color:var(--muted);white-space:normal}
.movers-faq{min-width:0;max-width:100%;overflow-wrap:anywhere;margin:var(--space-8,32px) 0 0}.movers-faq h2{font-size:18px;margin:0 0 var(--space-3,12px)}.movers-faq h3{margin:var(--space-4,16px) 0 var(--space-1,4px);font-size:15px}.movers-faq p{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
/* /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}