:root {
  --ink: #17130f;
  --paper: #f2eadc;
  --paper-deep: #e2d5c2;
  --red: #c92d2f;
  --red-dark: #751a1c;
  --gold: #d4a546;
  --muted: #766a60;
  --line: rgba(23, 19, 15, .14);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
.route-login .tcg-content, .route-login #profile-main, .route-login #community-main, .route-login footer { display: none !important; }
.route-login #tcg-home[hidden] { display: grid !important; }
.route-profile .hero, .route-profile #catalog-main { display: none !important; }
.route-profile #profile-main[hidden] { display: block !important; }
.route-profile:not(.profile-ready):not(.profile-error) #profile-main { min-height: calc(100vh - 72px); }
.route-profile:not(.profile-ready) .profile-page-heading,
.route-profile:not(.profile-ready) #profile-favorites,
.route-profile:not(.profile-ready) #profile-overview,
.route-profile:not(.profile-ready) #profile-collection-detail { display: none !important; }
.route-profile.profile-ready #profile-loading { display: none; }
.route-community .hero, .route-community #catalog-main, .route-community #profile-main { display: none !important; }
.route-community #community-main[hidden] { display: block !important; }
.route-community:not(.community-ready) #community-grid { min-height: 260px; }
html { scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(circle at 18% 0, rgba(201,45,47,.08), transparent 32rem), linear-gradient(90deg, rgba(23,19,15,.022) 1px, transparent 1px), var(--paper); background-size: auto, 34px 34px, auto; }
body.is-home, .route-login body { min-height: 100vh; color: #f8f3ea; background: radial-gradient(circle at 78% 14%, rgba(229,70,66,.2), transparent 28rem), radial-gradient(circle at 15% 90%, rgba(51,132,177,.18), transparent 32rem), #0b1119; }
button, input { font: inherit; }
button { color: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.topbar { position: sticky; z-index: 20; top: 0; min-height: 72px; padding: 10px max(24px, calc((100vw - 1220px) / 2)); display: grid; grid-template-columns: minmax(220px,1fr) minmax(300px,660px) minmax(220px,1fr); gap: 26px; align-items: center; color: #fffaf1; background: rgba(18,16,14,.96); border-bottom: 4px solid var(--red); backdrop-filter: blur(12px); }
.tcg-switcher { width: max-content; display: flex; align-items: center; gap: 10px; }
.site-locale-picker { position: relative; flex: 0 0 auto; }
.site-locale-button { width: 44px; height: 44px; padding: 0; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.28); border-radius: 50%; color: #fff; background: rgba(255,255,255,.1); box-shadow: inset 0 1px rgba(255,255,255,.15),0 3px 10px rgba(0,0,0,.22); cursor: pointer; font-size: 1.28rem; transition: border-color .16s ease,background .16s ease,transform .16s ease; }
.site-locale-button:hover,.site-locale-button:focus-visible,.site-locale-button[aria-expanded="true"] { border-color: rgba(255,255,255,.72); background: rgba(255,255,255,.18); outline: 0; transform: translateY(-1px); }
.site-locale-menu { position: absolute; z-index: 60; top: calc(100% + 9px); left: 0; min-width: 158px; padding: 6px; border: 1px solid rgba(255,255,255,.18); border-radius: 12px; background: #201d1a; box-shadow: 0 16px 34px rgba(0,0,0,.34); }
.site-locale-menu button { width: 100%; padding: 9px 10px; display: flex; align-items: center; gap: 10px; border: 0; border-radius: 8px; color: #eee7df; background: transparent; cursor: pointer; text-align: left; }
.site-locale-menu button:hover,.site-locale-menu button:focus-visible { background: rgba(255,255,255,.1); outline: 0; }
.site-locale-menu button[aria-checked="true"] { color: #fff; background: rgba(209,48,52,.24); }
.site-locale-menu button span { font-size: 1.14rem; }
.site-locale-menu button b { font-size: .82rem; }
.home-locale-picker { position: fixed; z-index: 30; top: 22px; right: 22px; }
.home-locale-picker .site-locale-button { color: #261f1a; border-color: rgba(38,31,26,.18); background: rgba(255,255,255,.88); box-shadow: 0 6px 22px rgba(44,28,17,.14); }
.site-locale-menu--home { top: 52px; right: 0; left: auto; background: #fffaf4; border-color: rgba(49,34,24,.14); }
.site-locale-menu--home button { color: #302720; }
.site-locale-menu--home button:hover,.site-locale-menu--home button:focus-visible { background: #f0e7db; }
.site-locale-menu--home button[aria-checked="true"] { color: #7d1e24; background: #f4dfe0; }
.tcg-switcher-option { position: relative; width: 44px; height: 44px; padding: 2px; flex: 0 0 auto; display: grid; place-content: center; overflow: hidden; border: 2px solid rgba(255,255,255,.22); border-radius: 50%; color: white; background: #091520; text-decoration: none; opacity: .68; box-shadow: inset 0 1px rgba(255,255,255,.18),0 3px 10px rgba(0,0,0,.24); transition: opacity .16s ease,transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.tcg-switcher-option:hover, .tcg-switcher-option:focus-visible { opacity: 1; transform: translateY(-1px); outline: 0; }
.tcg-switcher-option img { width: 100%; height: 100%; display: block; border-radius: 50%; object-fit: contain; }
.tcg-switcher-option--onepiece img { object-fit: cover; transform: scale(1.04); }
.tcg-switcher-option--pokemon { background: #f6f3ed; }
.tcg-switcher-option.is-active { opacity: 1; transform: translateY(-1px); }
.tcg-switcher-option--onepiece.is-active { border-color: #ef5556; box-shadow: 0 0 0 3px rgba(239,85,86,.24),inset 0 1px rgba(255,255,255,.22),0 4px 13px rgba(0,0,0,.34); }
.tcg-switcher-option--pokemon.is-active { border-color: #f1c746; box-shadow: 0 0 0 3px rgba(241,199,70,.24),inset 0 1px rgba(255,255,255,.22),0 4px 13px rgba(0,0,0,.34); }
.global-search { position: relative; display: flex; align-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 9px; background: rgba(255,255,255,.08); }
.global-search:focus-within { border-color: #e95a5c; box-shadow: 0 0 0 3px rgba(201,45,47,.24); }
.global-search svg { width: 20px; margin-left: 14px; fill: none; stroke: #aaa096; stroke-width: 2; stroke-linecap: round; }
.global-search input { width: 100%; padding: 12px; border: 0; outline: 0; color: white; background: transparent; font-size: .88rem; }
.global-search kbd { margin-right: 10px; padding: 4px 7px; border: 1px solid rgba(255,255,255,.2); border-radius: 5px; color: #b9afa4; font-size: .63rem; white-space: nowrap; }
.catalog-total { justify-self: end; text-align: right; }
.catalog-total b, .catalog-total span { display: block; }
.catalog-total b { font-size: 1.1rem; }
.catalog-total span { color: #a99f94; font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.header-account { justify-self: end; display: flex; align-items: center; gap: 17px; }
.header-account .site-locale-menu { right: 0; left: auto; }
.collection-total { min-width: 92px; padding-left: 17px; border-left: 1px solid rgba(255,255,255,.17); text-align: right; }
.collection-total b, .collection-total span { display: block; }
.collection-total b { color: #f0bd58; font-size: .95rem; }
.collection-total span { margin-top: 2px; color: #a99f94; font-size: .58rem; text-transform: uppercase; letter-spacing: .07em; }
.collection-total i { font-style: normal; }
.account-button { width: 46px; height: 46px; padding: 3px; display: grid; place-content: center; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: #fffaf1; background: rgba(255,255,255,.07); cursor: pointer; }
.account-button:hover { border-color: #e95a5c; background: rgba(201,45,47,.18); }
.account-button:disabled { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.07); cursor: default; }
.community-link { width: 44px; height: 44px; margin-right: 3px; flex: 0 0 auto; display: grid; place-content: center; border: 2px solid rgba(255,255,255,.22); border-radius: 50%; color: #fffaf1; background: rgba(255,255,255,.06); text-decoration: none; }
.community-link svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.community-link:hover, .community-link:focus-visible, .route-community .community-link { color: white; border-color: var(--red); background: color-mix(in srgb,var(--red) 28%,transparent); outline: 0; }
.profile-avatar { --avatar-a: #c8373a; --avatar-b: #5f171c; width: 38px; height: 38px; display: inline-grid; flex: 0 0 auto; place-content: center; overflow: hidden; border: 2px solid rgba(255,255,255,.72); border-radius: 50%; background: linear-gradient(145deg,var(--avatar-a),var(--avatar-b)); box-shadow: inset 0 1px rgba(255,255,255,.28),0 3px 10px rgba(0,0,0,.22); font-size: 1.15rem; line-height: 1; }
.profile-avatar--large { width: 62px; height: 62px; border-width: 3px; font-size: 1.75rem; }
#public-profile-avatar { padding: 0; color: inherit; border-color: #fff8ed; outline: 1px solid rgba(23,19,15,.16); }
.profile-avatar--tcg { background-color: #0b1119; }
.is-home .topbar, .route-login .topbar { display: none; }
.search-panel { position: absolute; z-index: 30; top: calc(100% + 12px); left: 0; right: 0; max-height: min(620px, calc(100vh - 100px)); overflow: auto; border: 1px solid #3e3730; border-radius: 11px; color: var(--ink); background: #fffaf2; box-shadow: 0 25px 70px rgba(0,0,0,.45); }
.search-message { margin: 0; padding: 13px 15px; color: var(--muted); font-size: .78rem; border-bottom: 1px solid var(--line); }
.search-result { width: 100%; min-height: 72px; padding: 9px 12px; display: grid; grid-template-columns: 38px minmax(0,1fr) minmax(150px,.72fr) 25px; gap: 11px; align-items: center; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; cursor: pointer; }
.search-result:last-child { border-bottom: 0; }
.search-result:hover, .search-result:focus-visible { outline: 0; background: #f5e9d8; }
.search-result img { width: 38px; height: 53px; border-radius: 3px; object-fit: cover; background: var(--paper-deep); }
.search-result span { min-width: 0; }
.search-result b, .search-result em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result b { font-size: .75rem; }
.search-result em { margin-top: 3px; color: var(--muted); font-size: .66rem; font-style: normal; }
.search-set { padding-left: 12px; border-left: 1px solid var(--line); }
.search-set b { color: var(--red-dark); }
.search-result i { color: var(--red); font-size: 1.2rem; font-style: normal; font-weight: 900; }

.tcg-home { min-height: calc(100vh - 72px); width: min(1080px,calc(100% - 40px)); margin-inline: auto; padding: clamp(55px,9vw,112px) 0 75px; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(38px,8vw,100px); }
.home-copy h1 { margin: 0; font-size: clamp(4rem,10vw,8.6rem); line-height: .78; letter-spacing: -.085em; text-transform: uppercase; }
.home-copy h1 span { display: block; color: #ef5355; }
.home-copy > p:last-child { max-width: 430px; margin: 30px 0 0; color: #aeb8c5; font-size: 1rem; line-height: 1.7; }
.tcg-choices { display: grid; gap: 15px; }
.tcg-choice { min-height: 185px; padding: 25px; display: grid; grid-template-columns: 64px minmax(0,1fr) auto; align-items: center; gap: 20px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 18px; color: #fff; background: rgba(255,255,255,.055); text-decoration: none; box-shadow: 0 22px 60px rgba(0,0,0,.22); }
.tcg-choice--onepiece { background: radial-gradient(circle at 80% 25%,rgba(230,65,58,.72) 0 37px,transparent 38px), linear-gradient(135deg,rgba(16,62,91,.96),rgba(5,20,34,.98)); }
.tcg-choice--onepiece:hover { border-color: rgba(239,83,85,.8); transform: translateY(-3px); box-shadow: 0 28px 70px rgba(0,0,0,.36); }
.tcg-choice--pokemon { opacity: .58; background: radial-gradient(circle at 82% 20%,rgba(255,205,52,.55),transparent 72px), linear-gradient(135deg,#263c77,#17223f); }
.tcg-choice-icon { width: 64px; height: 64px; display: grid; place-content: center; border-radius: 50%; background: rgba(255,255,255,.11); font-size: 2rem; }
.tcg-choice em { color: #f0b852; font-size: .62rem; font-style: normal; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.tcg-choice h2 { margin: 5px 0 4px; font-size: 1.8rem; letter-spacing: -.04em; }
.tcg-choice p { margin: 0; color: rgba(255,255,255,.64); font-size: .73rem; line-height: 1.45; }
.tcg-choice > b { font-size: .7rem; white-space: nowrap; }

.login-home { min-height: 100svh; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(410px,.85fr); color: var(--ink); background: #f3ecdf; }
.login-showcase { position: relative; min-height: 620px; overflow: hidden; background: radial-gradient(circle at 76% 24%,rgba(127,83,209,.2),transparent 24rem),radial-gradient(circle at 25% 88%,rgba(23,112,154,.23),transparent 27rem),linear-gradient(145deg,#0c111a,#090b11 68%); isolation: isolate; }
.login-showcase::before { content: ""; position: absolute; z-index: 0; inset: 0; opacity: .42; background: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(110deg,#000,transparent 68%); }
.login-showcase::after { content: ""; position: absolute; z-index: 2; inset: 0; pointer-events: none; background: linear-gradient(180deg,transparent 35%,rgba(5,7,11,.68)),linear-gradient(90deg,transparent 78%,rgba(5,7,11,.28)); }
.login-visual-cards { position: absolute; z-index: 1; inset: 0; perspective: 1200px; filter: drop-shadow(0 28px 34px rgba(0,0,0,.42)); }
.login-visual-cards span { position: absolute; width: clamp(150px,16vw,245px); aspect-ratio: 63/88; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: clamp(13px,1.3vw,21px); box-shadow: inset 0 1px rgba(255,255,255,.24),inset 0 0 0 8px rgba(255,255,255,.025),0 30px 70px rgba(0,0,0,.38); }
.login-visual-cards span::before { content: ""; position: absolute; inset: 9%; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; background: radial-gradient(circle at 50% 34%,rgba(255,255,255,.23),transparent 20%),linear-gradient(145deg,transparent 35%,rgba(255,255,255,.08)); }
.login-visual-cards span::after { content: ""; position: absolute; inset: -30%; background: linear-gradient(115deg,transparent 36%,rgba(255,255,255,.36) 46%,transparent 56%); transform: translateX(-36%); }
.login-visual-cards span:nth-child(1) { top: 15%; right: 31%; background: linear-gradient(145deg,#63202b,#1a1724 72%); transform: rotate(-13deg) translateZ(-35px); }
.login-visual-cards span:nth-child(2) { z-index: 2; top: 10%; right: 9%; background: conic-gradient(from 218deg at 50% 42%,#16273d,#56438c,#9c5374,#bb8b48,#347b83,#16273d); transform: rotate(8deg) translateZ(34px); }
.login-visual-cards span:nth-child(2)::before { background: radial-gradient(circle at 50% 35%,rgba(255,255,255,.34),transparent 18%),conic-gradient(from 140deg,rgba(93,219,225,.22),rgba(228,112,176,.2),rgba(234,194,93,.24),rgba(93,219,225,.22)); }
.login-visual-cards span:nth-child(3) { right: 22%; bottom: -13%; background: linear-gradient(145deg,#163f56,#111722 76%); transform: rotate(2deg) translateZ(70px); }
.login-showcase-brand { position: absolute; z-index: 4; left: clamp(38px,4.4vw,72px); bottom: clamp(45px,7vh,82px); color: white; text-shadow: 0 10px 34px rgba(0,0,0,.62); }
.login-showcase-brand b { display: block; font-size: clamp(4.2rem,7.2vw,8rem); line-height: .79; letter-spacing: -.095em; white-space: nowrap; }
.login-showcase-brand span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.78); text-shadow: none; }
.login-access { min-width: 0; padding: 56px clamp(32px,5vw,78px); display: grid; place-items: center; background: radial-gradient(circle at 100% 0,rgba(201,45,47,.1),transparent 23rem),linear-gradient(90deg,rgba(23,19,15,.026) 1px,transparent 1px),#f3ecdf; background-size: auto,34px 34px,auto; }
.login-card { width: min(100%,410px); color: var(--ink); }
.login-card-heading { margin-bottom: 31px; }
.login-card-heading h1 { margin: 7px 0 9px; font-size: clamp(2.7rem,5vw,4rem); line-height: .95; letter-spacing: -.065em; }
.login-card-heading > p:last-child { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.55; }
.login-tabs { margin-bottom: 26px; padding: 4px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid rgba(23,19,15,.07); border-radius: 10px; background: rgba(226,213,194,.75); }
.login-tabs button { min-height: 39px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font-size: .67rem; font-weight: 850; cursor: pointer; }
.login-tabs button.is-active { color: white; background: var(--red-dark); box-shadow: 0 5px 14px rgba(117,26,28,.2); }
.login-pane > p { margin: 0 0 19px; color: var(--muted); font-size: .69rem; line-height: 1.5; }
.login-page-form { display: grid; gap: 15px; }
.login-page-form label { color: #5d5148; font-size: .65rem; font-weight: 850; }
.login-page-form input { width: 100%; min-height: 48px; margin-top: 7px; padding: 12px 14px; border: 1px solid rgba(23,19,15,.17); border-radius: 9px; color: var(--ink); background: rgba(255,253,249,.92); outline: 0; transition: border-color .15s ease,box-shadow .15s ease,background .15s ease; }
.login-page-form input:hover { border-color: rgba(117,26,28,.42); }
.login-page-form input:focus { border-color: var(--red); background: white; box-shadow: 0 0 0 3px rgba(201,45,47,.12); }
.invitation-field input { font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size: .76rem; letter-spacing: .015em; }
.login-page-form button { min-height: 48px; margin-top: 5px; border: 0; border-radius: 9px; color: white; background: linear-gradient(135deg,var(--red),var(--red-dark)); box-shadow: 0 9px 22px rgba(117,26,28,.2); font-size: .72rem; font-weight: 900; cursor: pointer; }
.login-page-form button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.login-page-form button:disabled { opacity: .48; cursor: wait; }
.login-card .auth-message { margin: 15px 0 0; }

.hero { position: relative; min-height: 335px; padding: 44px max(24px, calc((100vw - 1080px) / 2)); display: flex; align-items: center; overflow: hidden; color: #fff8ed; background-image: linear-gradient(90deg,rgba(3,11,21,.94) 0%,rgba(3,11,21,.78) 28%,rgba(3,11,21,.24) 57%,rgba(3,11,21,.06) 100%),url("one-piece-hero.webp"); background-position: center; background-size: cover; }
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 75px; background: linear-gradient(transparent,rgba(1,8,16,.6)); }
.hero > * { position: relative; z-index: 1; }
.eyebrow, .section-kicker { margin: 0 0 8px; color: var(--red); font-size: .68rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.hero-copy { width: min(690px,68vw); }
.hero-title { margin: 0; }
.hero-logo { display: block; width: clamp(250px,31vw,420px); max-height: 140px; object-fit: contain; object-position: left center; filter: drop-shadow(0 5px 18px rgba(0,0,0,.65)); }
.hero-logo--pokemon { display: none; }
.route-tcg-pokemon .hero-logo--onepiece { display: none; }
.route-tcg-pokemon .hero-logo--pokemon { display: block; }
.tcg-pokemon {
  --red: #356bb3;
  --red-dark: #173f7c;
  --gold: #f1c746;
  background: radial-gradient(circle at 82% 0,rgba(241,199,70,.14),transparent 34rem),linear-gradient(90deg,rgba(23,63,124,.025) 1px,transparent 1px),#edf2f7;
  background-size: auto,34px 34px,auto;
}
.tcg-pokemon .topbar { background: rgba(10,25,52,.97); }
.tcg-pokemon .hero, .route-tcg-pokemon .hero {
  background-image:
    linear-gradient(90deg,rgba(4,16,38,.72) 0%,rgba(4,16,38,.38) 34%,rgba(4,16,38,.06) 66%,transparent 100%),
    url("pokemon-hero.webp?v=kanto-151");
}
.tcg-pokemon .hero-logo, .route-tcg-pokemon .hero-logo { width: clamp(220px,25vw,330px); max-height: 210px; }
.tcg-pokemon .collection-total b { color: #f1c746; }
.rarity-illustrationrare { background: #397c86; }
.rarity-specialillustrationrare { background: #7b3e91; }
.rarity-hyperrare { background: #9a7422; }
.rarity-doublerare { background: #315d97; }
.rarity-acespecrare { background: #a82965; }
main, footer { width: min(1080px, calc(100% - 40px)); margin-inline: auto; }

.series-browser { padding: 46px 0 34px; border-bottom: 1px solid var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; }
.section-heading h2, .set-heading h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 2.7rem); letter-spacing: -.045em; }
.section-heading > p { max-width: 430px; margin: 0 0 5px; color: var(--muted); font-size: .76rem; line-height: 1.5; text-align: right; }
.kind-tabs { margin-top: 22px; display: flex; gap: 7px; flex-wrap: wrap; }
.kind-tab { padding: 8px 11px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); background: rgba(255,250,242,.6); font-size: .7rem; font-weight: 750; cursor: pointer; }
.kind-tab span { margin-left: 4px; opacity: .65; }
.kind-tab:hover, .kind-tab.is-active { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.tcg-pokemon .kind-tabs { flex-wrap: wrap; overflow: visible; }
.region-tabs { margin-top: 22px; display: flex; gap: 6px; }
.tcg-pokemon .region-tabs + .kind-tabs { margin-top: 10px; }
.region-tab { padding: 8px 11px; border: 1px solid rgba(23,63,124,.15); border-radius: 99px; color: #496078; background: rgba(255,255,255,.48); font-size: .7rem; font-weight: 750; cursor: pointer; }
.region-tab:hover, .region-tab.is-active { color: #fff; border-color: #173f7c; background: #173f7c; }
.route-tcg-pokemon:not(.catalog-ready) #region-tabs[hidden]:empty { min-height: 33px; display: flex !important; visibility: hidden; }
.route-tcg-pokemon:not(.catalog-ready) #kind-tabs:empty { min-height: 69px; }
.route-tcg-pokemon:not(.catalog-ready) #series-strip:empty { min-height: 108px; }
.route-tcg-pokemon.route-pokemon-root:not(.catalog-ready) #edition-strip[hidden]:empty { height: 67px; display: block !important; visibility: hidden; }
.route-tcg-onepiece:not(.route-login):not(.route-profile):not(.catalog-ready) #kind-tabs:empty { min-height: 33px; }
.route-tcg-onepiece:not(.route-login):not(.route-profile):not(.catalog-ready) #series-strip:empty { min-height: 98px; }
.series-strip { margin-top: 14px; padding: 4px 1px 12px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(158px, 1fr); gap: 8px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-color: var(--red-dark) transparent; }
.series-pill { position: relative; min-height: 82px; padding: 12px; overflow: hidden; scroll-snap-align: start; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,250,242,.66); text-align: left; cursor: pointer; }
.series-pill:hover { border-color: rgba(117,26,28,.55); transform: translateY(-1px); }
.series-pill.is-active { color: white; border-color: #3b0e0f; background: linear-gradient(145deg, var(--red), var(--red-dark)); box-shadow: 0 10px 24px rgba(117,26,28,.23); }
.series-pill b, .series-pill span { display: block; }
.series-pill b { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; }
.series-pill span { margin-top: 7px; overflow: hidden; font-size: .67rem; font-weight: 700; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.series-pill em { position: absolute; top: 9px; right: 9px; color: var(--muted); font-size: .58rem; font-style: normal; }
.series-pill.is-active em { color: rgba(255,255,255,.7); }
.series-region-badge { position: absolute; right: 9px; bottom: 9px; min-width: 22px; padding: 2px 5px; border: 1px solid rgba(23,63,124,.16); border-radius: 99px; background: rgba(255,255,255,.58); font-size: .68rem; line-height: 1; text-align: center; }
.series-pill.is-active .series-region-badge { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.13); }
.tcg-pokemon .series-strip { grid-auto-columns: minmax(220px, 1fr); }
.series-family-pill { min-height: 92px; padding-bottom: 29px; }
.series-family-pill b { padding-right: 52px; font-family: inherit; font-size: .82rem; line-height: 1.15; }
.series-family-pill span { color: var(--muted); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: .59rem; }
.series-family-pill em { top: auto; right: auto; bottom: 10px; left: 12px; }
.series-family-pill.is-active span { color: rgba(255,255,255,.72); }
.edition-strip, .profile-edition-strip { margin-top: 9px; padding: 9px; display: flex; align-items: stretch; gap: 7px; overflow-x: auto; border: 1px solid rgba(23,63,124,.12); border-radius: 10px; background: rgba(255,255,255,.35); scrollbar-width: thin; }
.edition-strip-label { flex: 0 0 auto; align-self: center; padding: 0 7px 0 2px; color: var(--muted); font-size: .58rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.edition-pill { position: relative; flex: 0 0 auto; min-width: 152px; padding: 8px 10px; display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: rgba(255,250,242,.82); font: inherit; text-align: left; cursor: pointer; }
.edition-pill:hover { border-color: rgba(23,63,124,.45); }
.edition-pill.is-active { color: #fff; border-color: #173f7c; background: #173f7c; box-shadow: 0 7px 17px rgba(23,63,124,.18); }
.edition-pill b { font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: .66rem; }
.edition-pill span { max-width: 190px; overflow: hidden; font-size: .61rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.edition-pill em { color: var(--muted); font-size: .53rem; font-style: normal; }
.edition-pill.is-active em { color: rgba(255,255,255,.7); }

.binder-section { padding: 48px 0 54px; scroll-margin-top: 88px; }
.set-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; }
.set-identity { min-width: 0; display: flex; align-items: center; gap: 16px; }
.set-code { flex: 0 0 auto; width: 72px; height: 72px; display: grid; place-content: center; border: 2px solid var(--red-dark); border-radius: 50%; color: var(--red-dark); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .85rem; font-weight: 950; box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 7px var(--red-dark); }
.set-heading h2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.set-progress { min-width: 240px; color: var(--muted); font-size: .72rem; text-align: right; }
.set-progress b { color: var(--ink); }
.set-progress strong { color: var(--red-dark); }
.set-progress p { margin: 5px 0 0; color: var(--red-dark); font-size: .67rem; font-weight: 800; }
.progress-track { height: 8px; margin-top: 8px; overflow: hidden; border-radius: 99px; background: var(--paper-deep); box-shadow: inset 0 1px 2px rgba(0,0,0,.12); }
.progress-track i { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--red-dark), var(--red)); transition: width .25s; }
.binder-toolbar { min-height: 49px; margin-top: 21px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.rarity-list { display: flex; flex-wrap: wrap; gap: 5px; }
.rarity-list button { padding: 5px 7px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); background: rgba(255,250,242,.56); font-size: .6rem; cursor: pointer; }
.rarity-list button:hover, .rarity-list button.is-active { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.rarity-list button.is-active b { color: white; }
.rarity-list b { margin-right: 5px; color: var(--ink); }
.page-status { color: var(--muted); font-size: .76rem; white-space: nowrap; }
.page-status b { color: var(--red-dark); }
.binder-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.view-switch { padding: 3px; display: flex; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,250,242,.6); }
.view-switch button { padding: 6px 9px; border: 0; border-radius: 5px; color: var(--muted); background: transparent; font-size: .64rem; font-weight: 800; cursor: pointer; }
.view-switch button:hover, .view-switch button.is-active { color: white; background: var(--red-dark); }
.binder-set-switch { border-color: color-mix(in srgb, var(--line), var(--red-dark) 18%); }
.binder-set-switch button { min-width: 68px; }
.collection-tools { margin: 8px 0 13px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.collection-filters { display: flex; flex-wrap: wrap; gap: 5px; }
.collection-filters button { padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: rgba(255,250,242,.56); font-size: .63rem; font-weight: 800; cursor: pointer; }
.collection-filters button:hover, .collection-filters button.is-active { color: #fff; border-color: #236a4b; background: #236a4b; }
.sort-control { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: .63rem; font-weight: 800; }
.sort-control select { padding: 6px 27px 6px 8px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: #fffaf2; font-size: .65rem; }
.sort-control select:disabled { opacity: .48; }
.binder-shell { position: relative; padding: 23px 23px 23px 55px; border: 1px solid #34251e; border-radius: 16px; background: linear-gradient(90deg, rgba(0,0,0,.38), transparent 16%), repeating-linear-gradient(0deg, transparent 0 4px, rgba(255,255,255,.018) 4px 5px), #4c1718; box-shadow: 0 22px 44px rgba(48,29,22,.23), inset 0 0 0 3px rgba(255,255,255,.035); }
.rings { position: absolute; z-index: 2; inset: 0 auto 0 17px; display: flex; flex-direction: column; justify-content: space-around; padding: 44px 0; }
.rings i { width: 60px; height: 13px; border: 3px solid #a69274; border-radius: 99px; background: linear-gradient(#ded0b8,#77674f); box-shadow: 0 2px 5px #130908; }
.card-grid { min-height: 650px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; padding: 12px; border-radius: 8px 13px 13px 8px; background: linear-gradient(90deg,rgba(0,0,0,.1),transparent 6%),rgba(244,235,220,.96); box-shadow: inset 0 0 0 1px rgba(255,255,255,.65),0 3px 10px rgba(0,0,0,.25); }
.card-slot { position: relative; min-width: 0; display: grid; grid-template-columns: minmax(95px,.76fr) minmax(92px,1fr); gap: 9px; padding: 9px; border: 1px solid rgba(60,47,39,.2); border-radius: 7px; background: rgba(255,255,255,.43); box-shadow: inset 0 1px rgba(255,255,255,.8); transition: opacity .2s,transform .2s,box-shadow .2s; }
.card-slot.is-owned { opacity: 1; border-color: rgba(35,106,75,.7); background: rgba(255,255,255,.76); box-shadow: inset 0 0 0 2px rgba(58,150,101,.15),0 3px 10px rgba(46,103,74,.09); }
.card-slot.is-missing { opacity: .4; filter: saturate(.35); }
.card-slot.is-missing:hover, .card-slot.is-missing:focus-within { opacity: .72; filter: saturate(.7); }
.card-slot.is-highlighted { z-index: 3; animation: found 1s ease-in-out 2; box-shadow: 0 0 0 4px var(--gold),0 10px 28px rgba(125,76,12,.3); }
@keyframes found { 50% { transform: translateY(-5px) scale(1.015); } }
.slot-number { position: absolute; z-index: 2; top: 5px; left: 5px; width: 24px; height: 24px; display: grid; place-content: center; border: 2px solid rgba(255,255,255,.85); border-radius: 50%; color: white; background: var(--red-dark); box-shadow: 0 2px 5px rgba(0,0,0,.3); font-size: .67rem; font-weight: 900; }
.card-grid .slot-number { display: none; }
.card-favorite { width: calc((100% - 6px) / 3); min-height: 23px; margin: 0 0 3px auto; padding: 1px; display: grid; place-content: center; border: 1px solid #b6a796; border-radius: 5px; background: rgba(255,250,242,.7); box-shadow: inset 0 1px rgba(255,255,255,.55); font-size: .95rem; line-height: 1; cursor: pointer; }
.card-favorite:hover:not(:disabled), .card-favorite:focus-visible { border-color: #d4a546; background: #fff4c9; transform: translateY(-1px); }
.card-favorite.is-active { border-color: #d4a546; background: rgba(255,244,201,.82); box-shadow: inset 0 0 0 1px rgba(212,165,70,.2); }
.card-favorite:disabled { cursor: default; }
.card-image-button { position: relative; min-width: 0; padding: 0; overflow: visible; border: 0; border-radius: 6px; background: #cfc1ae; cursor: zoom-in; line-height: 0; }
.card-image-button,.dialog-card-surface { perspective: 700px; perspective-origin: center; }
.card-image-button::after,.dialog-card-surface::after { content: ""; position: absolute; z-index: 2; inset: 0; border: 1px solid rgba(255,255,255,.08); border-radius: inherit; pointer-events: none; opacity: 0; transform: rotate3d(var(--card-tilt-axis-x,0),var(--card-tilt-axis-y,0),0,var(--card-tilt-angle,0deg)); transform-origin: center; background: linear-gradient(108deg,rgba(0,0,0,.22) 0,transparent 24%,transparent 67%,rgba(255,255,255,.2) 100%); background-size: 185% 185%; background-position: var(--card-light-x,50%) var(--card-light-y,50%); box-shadow: inset 0 0 13px rgba(255,255,255,.06); mix-blend-mode: soft-light; transition: opacity .22s ease,transform .22s cubic-bezier(.2,.75,.25,1),background-position 70ms linear; }
.card-image-button.is-card-tilting::after { opacity: .2; transition-duration: 70ms; }
.card-image-button:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }
.card-image-button img { width: 100%; height: auto; display: block; aspect-ratio: 600/838; border-radius: inherit; object-fit: cover; transform: rotate3d(var(--card-tilt-axis-x,0),var(--card-tilt-axis-y,0),0,var(--card-tilt-angle,0deg)); transform-style: preserve-3d; transform-origin: center; filter: drop-shadow(0 3px 5px rgba(0,0,0,.12)); transition: transform .22s cubic-bezier(.2,.75,.25,1),filter .22s ease; will-change: transform; }
.card-image-button img.is-tilting { filter: drop-shadow(var(--card-shadow-x,0) var(--card-shadow-y,5px) 9px rgba(0,0,0,.34)) brightness(1.02); transition-duration: 70ms; }
.card-slot.is-card-tilting { z-index: 4; }
.card-shine { position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: inherit; pointer-events: none; opacity: 0; transform: rotate3d(var(--card-tilt-axis-x,0),var(--card-tilt-axis-y,0),0,var(--card-tilt-angle,0deg)); transform-origin: center; background-image: linear-gradient(112deg,transparent 7%,rgba(255,42,180,.48) 23%,rgba(62,199,255,.57) 37%,rgba(255,255,255,.76) 49%,rgba(255,218,49,.57) 60%,rgba(55,236,163,.49) 73%,rgba(172,65,255,.46) 86%,transparent 97%); background-size: 245% 245%; background-position: var(--shine-bg-x,50%) var(--shine-bg-y,50%); background-repeat: no-repeat; mix-blend-mode: screen; filter: saturate(1.5) contrast(1.08); transition: opacity .22s ease,transform .22s cubic-bezier(.2,.75,.25,1),background-position 70ms linear; }
.card-shine::before,.card-shine::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; }
.card-shine::before { opacity: .82; mix-blend-mode: overlay; }
.card-shine::after { opacity: .42; background: linear-gradient(112deg,transparent 38%,rgba(255,255,255,.08) 43%,rgba(255,255,255,.72) 50%,rgba(255,255,255,.08) 57%,transparent 62%); background-size: 270% 270%; background-position: var(--shine-bg-x,50%) var(--shine-bg-y,50%); background-repeat: no-repeat; mix-blend-mode: screen; }
.is-foil { --foil-idle-opacity: .035; --foil-active-opacity: .78; --foil-art-top: 9.2%; --foil-art-side: 7.2%; --foil-art-bottom: 50.3%; --foil-art-width: 85.6%; --foil-art-height: 40.5%; --foil-art-mask-y: 15.5%; }
.foil-frame--classic { --foil-art-top: 12%; --foil-art-side: 8.7%; --foil-art-bottom: 46%; --foil-art-width: 82.6%; --foil-art-height: 42%; --foil-art-mask-y: 20.7%; }
.foil-frame--mid { --foil-art-top: 10.4%; --foil-art-side: 7.6%; --foil-art-bottom: 48.8%; --foil-art-width: 84.8%; --foil-art-height: 40.8%; --foil-art-mask-y: 17.6%; }
.foil-frame--modern { --foil-art-top: 9.2%; --foil-art-side: 7.2%; --foil-art-bottom: 50.3%; --foil-art-width: 85.6%; --foil-art-height: 40.5%; --foil-art-mask-y: 15.5%; }
.is-foil--reverse > .card-shine { -webkit-mask-image: linear-gradient(#000 0 0),linear-gradient(#000 0 0); -webkit-mask-size: 100% 100%,var(--foil-art-width) var(--foil-art-height); -webkit-mask-position: 0 0,center var(--foil-art-mask-y); -webkit-mask-repeat: no-repeat; -webkit-mask-composite: xor; mask-image: linear-gradient(#000 0 0),linear-gradient(#000 0 0); mask-size: 100% 100%,var(--foil-art-width) var(--foil-art-height); mask-position: 0 0,center var(--foil-art-mask-y); mask-repeat: no-repeat; mask-composite: exclude; }
.is-foil--holo > .card-shine { clip-path: inset(var(--foil-art-top) var(--foil-art-side) var(--foil-art-bottom) var(--foil-art-side) round 1.5%); }
.is-foil--accent > .card-shine { -webkit-mask-image: linear-gradient(to bottom,#000 0 5%,transparent 6% 94%,#000 95%),linear-gradient(to right,#000 0 5%,transparent 6% 94%,#000 95%),radial-gradient(ellipse at 50% 29%,#000 0 17%,rgba(0,0,0,.62) 34%,transparent 62%); -webkit-mask-repeat: no-repeat; mask-image: linear-gradient(to bottom,#000 0 5%,transparent 6% 94%,#000 95%),linear-gradient(to right,#000 0 5%,transparent 6% 94%,#000 95%),radial-gradient(ellipse at 50% 29%,#000 0 17%,rgba(0,0,0,.62) 34%,transparent 62%); mask-repeat: no-repeat; }
.foil-effect--starlight { --foil-active-opacity: .86; }
.foil-effect--starlight > .card-shine::before { opacity: .48; background: repeating-conic-gradient(from 0deg at 21% 31%,rgba(255,255,255,.72) 0 2deg,transparent 2deg 18deg),repeating-conic-gradient(from 10deg at 72% 64%,rgba(126,225,255,.58) 0 2deg,transparent 2deg 20deg),radial-gradient(circle at 45% 77%,rgba(255,255,255,.72) 0 .8%,transparent 2.8%),radial-gradient(circle at 83% 24%,rgba(255,208,245,.62) 0 .7%,transparent 2.5%); }
.foil-effect--cosmos { --foil-active-opacity: .84; }
.foil-effect--cosmos > .card-shine::before { background: radial-gradient(circle at 18% 24%,transparent 0 2.3%,rgba(255,255,255,.72) 2.8%,rgba(126,226,255,.28) 3.8%,transparent 6%),radial-gradient(circle at 73% 32%,rgba(255,255,255,.64) 0 1.1%,rgba(255,119,221,.28) 1.8%,transparent 4.8%),radial-gradient(circle at 38% 72%,transparent 0 2%,rgba(255,255,255,.66) 2.5%,rgba(255,226,107,.28) 3.5%,transparent 6.3%),radial-gradient(circle at 84% 76%,rgba(255,255,255,.62) 0 1%,rgba(119,255,213,.25) 1.7%,transparent 4.4%); }
.foil-effect--fireworks { --foil-active-opacity: .87; }
.foil-effect--fireworks > .card-shine::before { opacity: .42; background: repeating-conic-gradient(from 0deg at 18% 24%,rgba(255,255,255,.58) 0 2deg,transparent 2deg 13deg),repeating-conic-gradient(from 7deg at 72% 36%,rgba(105,220,255,.48) 0 2deg,transparent 2deg 15deg),repeating-conic-gradient(from 3deg at 43% 76%,rgba(255,112,219,.44) 0 2deg,transparent 2deg 14deg),radial-gradient(circle at 84% 78%,rgba(255,241,134,.55) 0 1%,transparent 4%); }
.foil-effect--flat > .card-shine::before { opacity: .45; background: radial-gradient(circle,rgba(255,255,255,.28) 0 .7px,transparent 1.4px) 0 0/8px 9px,linear-gradient(120deg,transparent 24%,rgba(255,255,255,.18) 49%,transparent 74%); }
.foil-effect--energy,.foil-effect--pokeball,.foil-effect--masterball,.foil-effect--quickball,.foil-effect--loveball,.foil-effect--friendball,.foil-effect--duskball,.foil-effect--teamrocket { --foil-idle-opacity: .075; --foil-active-opacity: .88; }
.foil-effect--energy > .card-shine::before { opacity: .76; background: radial-gradient(circle,rgba(255,255,255,.26) 0 2px,transparent 2.5px 7px,rgba(255,255,255,.3) 7.5px 8.8px,transparent 9.4px) 0 0/31px 31px,radial-gradient(circle,rgba(112,224,255,.27) 0 2px,transparent 3px) 15px 15px/31px 31px,repeating-linear-gradient(128deg,transparent 0 10px,rgba(255,255,255,.11) 11px,transparent 12px 21px); }
.foil-effect--pokeball > .card-shine::before { opacity: .72; background: radial-gradient(circle at 50% 50%,rgba(255,255,255,.3) 0 2px,transparent 2.5px 7px,rgba(255,255,255,.31) 7.5px 8.7px,transparent 9.2px),linear-gradient(transparent 46%,rgba(255,255,255,.28) 47% 53%,transparent 54%) 0 0/30px 30px; background-size: 30px 30px; }
.foil-effect--masterball > .card-shine::before { opacity: .76; background: radial-gradient(circle at 50% 50%,rgba(255,255,255,.35) 0 2px,transparent 2.6px 7px,rgba(255,255,255,.32) 7.6px 9px,transparent 9.5px),conic-gradient(from 225deg at 50% 42%,transparent 0 12%,rgba(255,255,255,.28) 13% 24%,transparent 25% 75%,rgba(255,255,255,.28) 76% 87%,transparent 88%) 0 0/34px 34px,linear-gradient(transparent 46%,rgba(255,255,255,.24) 47% 53%,transparent 54%) 0 0/34px 34px; background-size: 34px 34px; }
.foil-effect--quickball > .card-shine::before { opacity: .72; background: radial-gradient(circle at 50% 50%,rgba(255,255,255,.3) 0 2px,transparent 2.5px 7px,rgba(255,255,255,.3) 7.5px 9px,transparent 9.5px),conic-gradient(from 45deg,transparent 0 9%,rgba(255,255,255,.24) 10% 16%,transparent 17% 34%,rgba(255,255,255,.24) 35% 41%,transparent 42% 59%,rgba(255,255,255,.24) 60% 66%,transparent 67% 84%,rgba(255,255,255,.24) 85% 91%,transparent 92%) 0 0/33px 33px; background-size: 33px 33px; }
.foil-effect--loveball > .card-shine::before { opacity: .75; background: radial-gradient(circle at 43% 43%,rgba(255,255,255,.28) 0 4px,transparent 4.8px),radial-gradient(circle at 57% 43%,rgba(255,255,255,.28) 0 4px,transparent 4.8px),conic-gradient(from 315deg at 50% 67%,transparent 0 12%,rgba(255,255,255,.29) 13% 37%,transparent 38% 62%,rgba(255,255,255,.29) 63% 87%,transparent 88%) 0 0/31px 31px; background-size: 31px 31px; }
.foil-effect--friendball > .card-shine::before { opacity: .72; background: radial-gradient(circle at 50% 50%,rgba(255,255,255,.3) 0 2px,transparent 2.5px 7px,rgba(255,255,255,.29) 7.5px 9px,transparent 9.5px),radial-gradient(circle at 27% 28%,rgba(255,255,255,.27) 0 2px,transparent 2.7px),radial-gradient(circle at 73% 28%,rgba(255,255,255,.27) 0 2px,transparent 2.7px),radial-gradient(circle at 50% 78%,rgba(255,255,255,.27) 0 2px,transparent 2.7px) 0 0/34px 34px; background-size: 34px 34px; }
.foil-effect--duskball > .card-shine::before { opacity: .76; background: radial-gradient(circle at 50% 50%,rgba(255,255,255,.31) 0 2px,transparent 2.5px 7px,rgba(255,255,255,.28) 7.5px 9px,transparent 9.5px),repeating-conic-gradient(from 20deg at 50% 50%,rgba(255,255,255,.25) 0 7deg,transparent 8deg 30deg) 0 0/35px 35px; background-size: 35px 35px; }
.foil-effect--teamrocket > .card-shine::before { opacity: .72; background: linear-gradient(68deg,transparent 37%,rgba(255,255,255,.29) 38% 47%,transparent 48%) 0 0/27px 34px,linear-gradient(112deg,transparent 37%,rgba(255,255,255,.25) 38% 47%,transparent 48%) 0 0/27px 34px,linear-gradient(90deg,transparent 42%,rgba(255,255,255,.28) 43% 52%,transparent 53%) 0 0/27px 34px; background-size: 27px 34px; }
.foil-effect--pinwheel > .card-shine::before { opacity: .62; background: repeating-conic-gradient(from 14deg at 50% 50%,rgba(255,255,255,.25) 0 8deg,rgba(103,220,255,.12) 8deg 17deg,transparent 17deg 34deg); background-size: 31px 31px; }
.foil-effect--type > .card-shine::before { background: radial-gradient(circle,transparent 0 5px,rgba(255,255,255,.25) 6px 7px,transparent 8px) 0 0/31px 31px,linear-gradient(45deg,transparent 44%,rgba(119,224,255,.16) 45% 55%,transparent 56%) 0 0/31px 31px; }
.foil-effect--type-large > .card-shine::before { background: radial-gradient(circle at 18% 49%,transparent 0 12%,rgba(255,255,255,.28) 12.8% 14.5%,rgba(105,216,255,.13) 15.2% 18%,transparent 19%),radial-gradient(circle,transparent 0 4px,rgba(255,255,255,.18) 5px 6px,transparent 7px) 0 0/29px 29px; }
.foil-effect--tile > .card-shine::before { background: linear-gradient(45deg,transparent 34%,rgba(255,255,255,.18) 35% 48%,transparent 49%) 0 0/24px 24px,linear-gradient(-45deg,transparent 34%,rgba(103,217,255,.14) 35% 48%,transparent 49%) 12px 12px/24px 24px; }
.foil-effect--tile-dense > .card-shine::before { background: linear-gradient(45deg,transparent 39%,rgba(255,255,255,.22) 40% 49%,transparent 50%) 0 0/18px 18px,linear-gradient(-45deg,transparent 39%,rgba(97,216,255,.17) 40% 49%,transparent 50%) 9px 9px/18px 18px,radial-gradient(circle,rgba(255,255,255,.2) 0 1px,transparent 1.5px) 4px 5px/18px 18px; }
.foil-effect--tinsel > .card-shine::before { background: repeating-linear-gradient(100deg,transparent 0 6px,rgba(255,255,255,.24) 7px,rgba(116,219,255,.12) 8px,transparent 10px 16px),radial-gradient(circle,rgba(255,255,255,.42) 0 1px,transparent 1.5px) 0 0/17px 19px; }
.foil-effect--sheen > .card-shine::before { background: repeating-linear-gradient(126deg,transparent 0 8px,rgba(255,255,255,.27) 9px,rgba(255,128,221,.12) 10px,transparent 12px 19px); }
.foil-effect--water > .card-shine::before { background: repeating-radial-gradient(ellipse at 28% 46%,transparent 0 9px,rgba(111,221,255,.2) 11px,rgba(255,255,255,.1) 12px,transparent 14px 25px); }
.foil-effect--line > .card-shine::before { background: repeating-linear-gradient(90deg,transparent 0 7px,rgba(255,255,255,.23) 8px,rgba(114,216,255,.12) 9px,transparent 11px 18px); }
.foil-effect--mirage > .card-shine::before { opacity: .66; background: repeating-conic-gradient(from 45deg,rgba(255,255,255,.18) 0 10deg,rgba(101,214,255,.1) 10deg 19deg,transparent 19deg 42deg); background-size: 25px 25px; }
.foil-effect--plain { --foil-active-opacity: .7; }
.foil-effect--plain > .card-shine::before { opacity: .38; background: linear-gradient(108deg,transparent 28%,rgba(255,255,255,.28) 48%,transparent 68%); }
.foil-effect--etched > .card-shine::before { background: repeating-radial-gradient(ellipse at 55% 42%,transparent 0 5px,rgba(255,255,255,.2) 6px,transparent 7px 12px),repeating-linear-gradient(128deg,transparent 0 9px,rgba(109,220,255,.12) 10px,transparent 11px 18px); }
.foil-effect--illustration > .card-shine::before { opacity: .5; background: radial-gradient(circle,rgba(255,255,255,.3) 0 .7px,transparent 1.4px) 0 0/7px 7px,linear-gradient(125deg,transparent 20%,rgba(255,255,255,.16) 50%,transparent 80%); }
.foil-effect--rainbow { --foil-active-opacity: .88; }
.foil-effect--rainbow > .card-shine::before { background: repeating-linear-gradient(135deg,rgba(255,255,255,.2) 0 1px,transparent 1px 5px),repeating-linear-gradient(45deg,rgba(100,221,255,.12) 0 1px,transparent 1px 7px); }
.foil-effect--gold { --foil-active-opacity: .69; }
.foil-effect--gold > .card-shine { background-image: linear-gradient(112deg,transparent 8%,rgba(145,79,4,.28) 22%,rgba(255,192,43,.62) 36%,rgba(255,255,218,.86) 49%,rgba(255,211,72,.68) 61%,rgba(181,104,10,.38) 77%,transparent 95%); filter: saturate(1.25) contrast(1.1); }
.foil-effect--gold > .card-shine::before { background: repeating-linear-gradient(128deg,transparent 0 5px,rgba(255,240,173,.24) 6px,transparent 7px 12px),radial-gradient(circle,rgba(255,255,255,.55) 0 .8px,transparent 1.4px) 0 0/14px 17px; }
.foil-effect--radiant > .card-shine::before { background: repeating-linear-gradient(45deg,transparent 0 7px,rgba(255,255,255,.25) 8px,transparent 9px 16px),repeating-linear-gradient(-45deg,transparent 0 7px,rgba(96,218,255,.22) 8px,transparent 9px 16px); }
.foil-effect--amazing { --foil-active-opacity: .87; }
.foil-effect--amazing > .card-shine { background-image: conic-gradient(from 18deg at 51% 39%,transparent 0 5%,rgba(255,52,185,.58) 9% 18%,rgba(70,204,255,.62) 23% 33%,rgba(255,225,57,.61) 39% 48%,rgba(58,239,168,.56) 54% 65%,rgba(176,69,255,.54) 71% 81%,transparent 88%),linear-gradient(112deg,transparent 15%,rgba(255,255,255,.56) 49%,transparent 84%); background-size: 155% 155%,240% 100%; }
.foil-effect--amazing > .card-shine::before { background: radial-gradient(circle,rgba(255,255,255,.62) 0 .8px,transparent 1.6px) 0 0/9px 11px; }
.foil-effect--shiny > .card-shine::before { background: radial-gradient(circle,rgba(255,255,255,.75) 0 1px,transparent 1.7px) 0 0/18px 18px,radial-gradient(circle,rgba(151,226,255,.54) 0 .8px,transparent 1.5px) 9px 7px/23px 23px,repeating-linear-gradient(132deg,transparent 0 11px,rgba(255,255,255,.12) 12px,transparent 13px 22px); }
.foil-effect--prism > .card-shine::before { background: repeating-conic-gradient(from 30deg,rgba(255,255,255,.22) 0 12deg,rgba(93,213,255,.14) 12deg 24deg,transparent 24deg 48deg); background-size: 34px 34px; }
.foil-effect--shining { --foil-active-opacity: .82; }
.foil-effect--shining > .card-shine { background-image: linear-gradient(112deg,transparent 9%,rgba(83,181,255,.4) 24%,rgba(255,102,215,.48) 38%,rgba(255,255,255,.78) 50%,rgba(255,224,82,.46) 63%,rgba(83,232,190,.4) 77%,transparent 95%); }
.foil-effect--shining > .card-shine::before { opacity: .7; background: repeating-linear-gradient(132deg,transparent 0 5px,rgba(255,255,255,.18) 6px,transparent 7px 13px),radial-gradient(circle,rgba(255,255,255,.7) 0 .8px,transparent 1.7px) 0 0/17px 19px; }
.foil-effect--prime { --foil-active-opacity: .76; }
.foil-effect--prime > .card-shine { background-image: linear-gradient(106deg,transparent 7%,rgba(49,127,183,.38) 24%,rgba(220,238,249,.7) 43%,rgba(255,255,255,.84) 50%,rgba(170,89,196,.39) 67%,rgba(48,118,176,.35) 83%,transparent 96%); }
.foil-effect--prime > .card-shine::before { opacity: .58; background: repeating-radial-gradient(ellipse at 48% 48%,transparent 0 5px,rgba(255,255,255,.22) 6px,transparent 7px 13px); }
.foil-effect--lvx { --foil-active-opacity: .74; }
.foil-effect--lvx > .card-shine { background-image: linear-gradient(106deg,transparent 6%,rgba(69,78,91,.34) 21%,rgba(220,233,244,.58) 39%,rgba(255,255,255,.82) 50%,rgba(174,193,210,.58) 62%,rgba(59,67,80,.32) 82%,transparent 96%); filter: saturate(.72) contrast(1.16); }
.foil-effect--lvx > .card-shine::before { opacity: .5; background: repeating-linear-gradient(135deg,transparent 0 6px,rgba(255,255,255,.2) 7px,transparent 8px 14px); }
.foil-effect--break { --foil-active-opacity: .74; }
.foil-effect--break > .card-shine { background-image: linear-gradient(96deg,transparent 5%,rgba(255,167,28,.55) 23%,rgba(255,255,210,.82) 48%,rgba(255,198,46,.65) 66%,rgba(154,83,8,.35) 86%,transparent 97%); }
.foil-effect--break > .card-shine::before { background: repeating-linear-gradient(90deg,transparent 0 6px,rgba(255,255,255,.2) 7px,transparent 9px 15px); }
.foil-effect--monochrome { --foil-active-opacity: .68; }
.foil-effect--monochrome > .card-shine { background-image: linear-gradient(112deg,transparent 7%,rgba(18,18,22,.42) 23%,rgba(210,223,236,.52) 39%,rgba(255,255,255,.82) 49%,rgba(94,103,119,.45) 66%,rgba(12,12,16,.36) 82%,transparent 96%); filter: saturate(.25) contrast(1.18); }
.foil-effect--monochrome > .card-shine::before { background: repeating-linear-gradient(135deg,transparent 0 7px,rgba(255,255,255,.18) 8px,transparent 9px 15px); }
.foil-effect--op-rare { --foil-idle-opacity: .018; --foil-active-opacity: .48; }
.foil-effect--op-rare > .card-shine { background-image: linear-gradient(110deg,transparent 8%,rgba(91,105,120,.24) 27%,rgba(231,239,245,.68) 48%,rgba(255,255,255,.8) 52%,rgba(122,137,153,.3) 72%,transparent 94%); filter: saturate(.45) contrast(1.12); }
.foil-effect--op-rare > .card-shine::before { opacity: .42; background: repeating-linear-gradient(128deg,transparent 0 8px,rgba(255,255,255,.18) 9px,transparent 10px 17px); }
.foil-effect--op-super { --foil-active-opacity: .78; }
.foil-effect--op-super > .card-shine { background-image: linear-gradient(108deg,transparent 6%,rgba(255,41,170,.5) 21%,rgba(55,191,255,.61) 36%,rgba(255,255,255,.84) 50%,rgba(255,214,45,.59) 63%,rgba(55,232,170,.5) 77%,rgba(167,67,255,.44) 89%,transparent 98%); background-size: 230% 230%; }
.foil-effect--op-super > .card-shine::before { opacity: .52; background: repeating-linear-gradient(122deg,transparent 0 6px,rgba(255,255,255,.17) 7px,transparent 8px 15px); }
.foil-effect--op-secret { --foil-active-opacity: .79; }
.foil-effect--op-secret > .card-shine { background-image: linear-gradient(108deg,transparent 5%,rgba(139,71,3,.35) 18%,rgba(255,184,30,.67) 34%,rgba(255,255,222,.88) 49%,rgba(255,219,72,.62) 62%,rgba(74,207,224,.44) 76%,rgba(164,73,245,.39) 88%,transparent 97%); filter: saturate(1.22) contrast(1.12); }
.foil-effect--op-secret > .card-shine::before { opacity: .68; background: repeating-linear-gradient(45deg,transparent 0 5px,rgba(255,239,172,.22) 6px,transparent 7px 12px),repeating-linear-gradient(-45deg,transparent 0 7px,rgba(255,255,255,.13) 8px,transparent 9px 15px); }
.foil-effect--op-parallel { --foil-active-opacity: .84; }
.foil-effect--op-parallel > .card-shine { background-image: linear-gradient(106deg,transparent 4%,rgba(255,33,168,.56) 18%,rgba(47,196,255,.65) 33%,rgba(255,255,255,.88) 49%,rgba(255,213,38,.65) 61%,rgba(52,237,158,.55) 74%,rgba(175,59,255,.53) 88%,transparent 98%); background-size: 235% 235%; }
.foil-effect--op-parallel > .card-shine::before { opacity: .68; background: repeating-radial-gradient(ellipse at 52% 44%,transparent 0 5px,rgba(255,255,255,.19) 6px,transparent 7px 13px),repeating-linear-gradient(133deg,transparent 0 9px,rgba(111,220,255,.13) 10px,transparent 11px 19px); }
.foil-effect--op-leader { --foil-active-opacity: .83; }
.foil-effect--op-leader > .card-shine::before { opacity: .7; background: repeating-radial-gradient(ellipse at 48% 45%,transparent 0 7px,rgba(255,255,255,.2) 8px,transparent 9px 16px),repeating-conic-gradient(from 20deg at 50% 46%,transparent 0 18deg,rgba(255,255,255,.13) 19deg 21deg,transparent 22deg 40deg); }
.foil-effect--op-special { --foil-active-opacity: .82; }
.foil-effect--op-special > .card-shine { background-image: linear-gradient(105deg,transparent 4%,rgba(134,63,4,.36) 18%,rgba(255,175,25,.66) 32%,rgba(255,255,220,.9) 49%,rgba(255,210,52,.67) 61%,rgba(240,86,160,.46) 76%,rgba(92,189,255,.43) 88%,transparent 97%); }
.foil-effect--op-special > .card-shine::before { opacity: .72; background: repeating-linear-gradient(135deg,transparent 0 4px,rgba(255,237,164,.23) 5px,transparent 6px 11px),radial-gradient(circle,rgba(255,255,255,.62) 0 .7px,transparent 1.5px) 0 0/15px 17px; }
.foil-effect--op-treasure { --foil-active-opacity: .87; }
.foil-effect--op-treasure > .card-shine { background-image: linear-gradient(108deg,transparent 4%,rgba(111,53,2,.38) 18%,rgba(255,178,25,.72) 33%,rgba(255,255,225,.92) 48%,rgba(255,218,61,.74) 61%,rgba(54,210,203,.47) 76%,rgba(180,65,241,.43) 89%,transparent 98%); }
.foil-effect--op-treasure > .card-shine::before { opacity: .75; background: linear-gradient(45deg,transparent 35%,rgba(255,255,255,.24) 36% 49%,transparent 50%) 0 0/21px 21px,linear-gradient(-45deg,transparent 35%,rgba(255,224,125,.2) 36% 49%,transparent 50%) 10px 10px/21px 21px; }
.foil-effect--op-jolly-roger { --foil-active-opacity: .77; }
.foil-effect--op-jolly-roger > .card-shine::before { opacity: .62; background: radial-gradient(circle,rgba(255,255,255,.28) 0 3px,transparent 3.5px),linear-gradient(35deg,transparent 43%,rgba(255,255,255,.18) 44% 48%,transparent 49%),linear-gradient(-35deg,transparent 43%,rgba(105,222,255,.16) 44% 48%,transparent 49%); background-size: 24px 24px; }
.foil-effect--op-deck-foil { --foil-active-opacity: .64; }
.foil-effect--op-deck-foil > .card-shine::before { opacity: .45; background: repeating-linear-gradient(118deg,transparent 0 9px,rgba(255,255,255,.18) 10px,transparent 11px 19px); }
.foil-effect--op-don { --foil-active-opacity: .76; }
.foil-effect--op-don > .card-shine::before { opacity: .64; background: repeating-conic-gradient(from 8deg at 50% 48%,rgba(255,255,255,.18) 0 5deg,transparent 6deg 17deg); }
.foil-effect--op-don-gold { --foil-active-opacity: .79; }
.foil-effect--op-don-gold > .card-shine { background-image: linear-gradient(108deg,transparent 5%,rgba(123,61,3,.4) 20%,rgba(255,182,25,.7) 35%,rgba(255,255,218,.9) 49%,rgba(255,211,57,.7) 63%,rgba(176,91,5,.4) 80%,transparent 96%); filter: saturate(1.2) contrast(1.12); }
.foil-effect--op-don-gold > .card-shine::before { opacity: .7; background: repeating-conic-gradient(from 8deg at 50% 48%,rgba(255,244,184,.22) 0 5deg,transparent 6deg 17deg),radial-gradient(circle,rgba(255,255,255,.65) 0 .8px,transparent 1.5px) 0 0/17px 19px; }
.card-image-button.is-foil .card-shine { opacity: var(--foil-idle-opacity); }
.card-image-button.is-foil.is-card-tilting .card-shine { opacity: var(--foil-active-opacity); transition-duration: 70ms; will-change: opacity,transform,background-position; }
.image-error { min-height: 120px; background: repeating-linear-gradient(135deg,#d7cab8 0 9px,#cdbda9 9px 18px); }
.card-info { min-width: 0; display: flex; flex-direction: column; padding: 3px 1px; }
.code-line { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.code-line strong { font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: clamp(.62rem,1vw,.76rem); letter-spacing: -.04em; }
.rarity { flex: 0 0 auto; min-width: 25px; padding: 3px 5px; border: 0; border-radius: 4px; color: white; background: #28221d; font-size: .52rem; font-weight: 900; text-align: center; cursor: pointer; }
.is-public-profile .rarity { cursor: default; }
.rarity-leader { background: #ae282a; }.rarity-superrare { background: #78551a; }.rarity-secretrare { background: #482060; }.rarity-treasurerare { background: #0a6b65; }.rarity-special { background: #265d78; }.rarity-don { background: #175f7e; }
.card-name { margin: 9px 0 3px; overflow: hidden; color: #2e2722; font-size: clamp(.65rem,1vw,.8rem); font-weight: 800; line-height: 1.18; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.card-variant { margin: 0; color: var(--muted); font-size: clamp(.56rem,.84vw,.66rem); line-height: 1.25; }
.card-price { margin: 7px 0 0; color: #8b621f; font-size: .66rem; font-weight: 850; text-decoration: underline dotted; text-underline-offset: 3px; cursor: pointer; }
.inventory-control { margin-top: auto; padding-top: 7px; }
.language-toggle { margin-bottom: 5px; display: grid; grid-template-columns: repeat(3,1fr); gap: 3px; }
.language-toggle button { min-width: 0; padding: 4px 5px; display: flex; justify-content: center; align-items: center; gap: 4px; border: 1px solid #b6a796; border-radius: 4px; color: var(--muted); background: rgba(255,250,242,.7); font-size: .54rem; font-weight: 900; cursor: pointer; }
.language-toggle button.is-active { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.language-toggle em { min-width: 15px; height: 15px; padding-inline: 3px; display: grid; place-content: center; border-radius: 99px; color: inherit; background: rgba(128,110,95,.15); font-size: .48rem; font-style: normal; }
.language-toggle button.is-active em { background: rgba(255,255,255,.18); }
.quantity-control { display: grid; grid-template-columns: 28px minmax(30px,1fr) 28px; align-items: center; gap: 4px; }
.quantity-control button { width: 28px; height: 27px; padding: 0; border: 1px solid #a99582; border-radius: 5px; color: var(--red-dark); background: #fffaf2; font-size: 1rem; font-weight: 900; line-height: 1; cursor: pointer; }
.quantity-control button:hover:not(:disabled), .quantity-control button:focus-visible { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.quantity-control button:disabled { opacity: .32; cursor: not-allowed; }
.quantity-control output { min-width: 30px; color: var(--ink); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: .75rem; font-weight: 950; text-align: center; }
.quantity-control--public { grid-template-columns: 1fr; }
.binder-shell--cards, .binder-shell--list { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.binder-shell--cards .rings, .binder-shell--list .rings { display: none; }
.card-grid--cards, .card-grid--list { min-height: 0; padding: 0; border-radius: 0; background: transparent; box-shadow: none; }
.card-grid--cards { grid-template-columns: repeat(5,minmax(0,1fr)); align-items: start; gap: 12px; }
.card-grid--cards .card-slot { grid-template-columns: 1fr; }
.card-grid--cards .card-info { min-height: 142px; }
.card-grid--list { grid-template-columns: 1fr; gap: 6px; }
.card-grid--list .card-slot { min-height: 0; display: block; padding: 10px 13px; }
.card-grid--list .card-image-button, .card-grid--list .slot-number { display: none; }
.card-grid--list .card-info { min-height: 0; padding: 0; display: grid; grid-template-columns: 115px minmax(150px,1.25fr) minmax(115px,.8fr) 105px minmax(255px,1fr); gap: 13px; align-items: center; }
.card-grid--list .code-line { justify-content: start; gap: 7px; }
.card-grid--list .card-name, .card-grid--list .card-variant, .card-grid--list .card-price { margin: 0; -webkit-line-clamp: 2; }
.card-grid--list .inventory-control { margin: 0; padding: 0 4px 0 0; display: grid; grid-template-columns: minmax(90px,1fr) 98px 34px; gap: 5px; align-items: center; }
.card-grid--list .language-toggle { grid-column: 1; grid-row: 1; margin: 0; }
.card-grid--list .quantity-control { grid-column: 2; grid-row: 1; width: 98px; }
.card-grid--list .card-favorite { grid-column: 3; grid-row: 1; width: 28px; min-height: 27px; margin: 0 auto; padding: 0; }
.filter-empty { grid-column: 1/-1; margin: 0; padding: 55px 20px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); text-align: center; }
.card-slot--empty { min-height: 220px; place-content: center; border-style: dashed; color: rgba(75,61,52,.45); font-size: .7rem; text-align: center; }
.skeleton { min-height: 220px; background: linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,.75),rgba(255,255,255,.25)); background-size: 200% 100%; animation: skeleton 1.3s infinite; }
.card-grid--binder > .skeleton { min-height: 0; }
@keyframes skeleton { to { background-position: -200% 0; } }
.fatal-error { grid-column: 1/-1; place-self: center; color: var(--red-dark); }
.page-nav { margin-top: 23px; display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; }
.page-arrow, .page-number { border: 1px solid var(--line); background: rgba(255,250,242,.72); cursor: pointer; }
.page-arrow { padding: 10px 13px; display: flex; gap: 7px; align-items: center; border-radius: 8px; font-size: .75rem; font-weight: 800; }
.page-arrow em { font-style: normal; }
.page-arrow:disabled { opacity: .3; cursor: not-allowed; }
.page-buttons { display: flex; justify-content: center; align-items: center; gap: 5px; }
.page-buttons > span { color: var(--muted); }
.page-number { width: 32px; height: 32px; padding: 0; border-radius: 50%; color: var(--muted); font-size: .68rem; font-weight: 850; }
.page-number:hover, .page-number.is-active { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.shortcuts { margin: 17px 0 0; color: var(--muted); font-size: .66rem; text-align: center; }
.shortcuts b { color: var(--ink); }

footer { padding: 25px 0 36px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: .7rem; }
footer div b, footer div span { display: block; }
footer div b { color: var(--ink); font-size: .82rem; }
footer div span { margin-top: 3px; color: var(--red-dark); font-weight: 800; }
footer > span { text-align: center; }
footer a { color: var(--red-dark); font-weight: 750; text-decoration: none; }
.card-dialog { width: min(790px,calc(100% - 28px)); padding: 0; overflow: hidden; border: 0; border-radius: 15px; color: var(--ink); background: #fffaf2; box-shadow: 0 35px 90px rgba(0,0,0,.55); }
.card-dialog::backdrop { background: rgba(15,10,8,.82); backdrop-filter: blur(5px); }
.card-dialog[open] { display: grid; grid-template-columns: minmax(270px,.82fr) 1fr; }
.dialog-image-stage { position: relative; min-width: 0; display: grid; place-items: center; overflow: hidden; background: #17130f; }
.dialog-card-surface { position: relative; width: min(100%,58.7vh); aspect-ratio: 600/838; border-radius: 2.8%; transform-style: preserve-3d; }
.dialog-card-surface.is-card-tilting::after { opacity: .34; transition-duration: 70ms; }
.dialog-card-surface > img { width: 100%; height: 100%; display: block; border-radius: inherit; object-fit: cover; transform: rotate3d(var(--card-tilt-axis-x,0),var(--card-tilt-axis-y,0),0,var(--card-tilt-angle,0deg)); transform-style: preserve-3d; transform-origin: center; filter: drop-shadow(0 8px 14px rgba(0,0,0,.22)); transition: transform .22s cubic-bezier(.2,.75,.25,1),filter .22s ease; will-change: transform; }
.dialog-card-surface > img.is-tilting { filter: drop-shadow(var(--card-shadow-x,0) var(--card-shadow-y,10px) 18px rgba(0,0,0,.42)) brightness(1.025); transition-duration: 70ms; }
.dialog-card-surface > .card-shine { display: none; }
.dialog-card-surface.is-foil-card > .card-shine { display: block; opacity: var(--foil-idle-opacity); }
.dialog-card-surface.is-foil-card.is-card-tilting > .card-shine { opacity: var(--foil-active-opacity); transition-duration: 70ms; will-change: opacity,transform,background-position; }
@keyframes dialog-reverse-shimmer { from { background-position: 12% 72%; } to { background-position: 88% 28%; } }
.dialog-card-surface.is-foil-card.is-foil--reverse > .card-shine { opacity: .28; animation: dialog-reverse-shimmer 4.8s ease-in-out infinite alternate; }
.dialog-card-surface.is-foil-card.is-foil--reverse.is-card-tilting > .card-shine { opacity: var(--foil-active-opacity); animation: none; }
@media (prefers-reduced-motion: reduce) { .dialog-card-surface.is-foil-card.is-foil--reverse > .card-shine { animation: none; } }
.dialog-card-nav { position: absolute; z-index: 2; top: 50%; width: 40px; height: 40px; display: grid; place-items: center; translate: 0 -50%; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: white; background: rgba(18,13,10,.72); box-shadow: 0 5px 18px rgba(0,0,0,.3); font-size: 1.12rem; font-weight: 900; cursor: pointer; backdrop-filter: blur(5px); }
.dialog-card-nav:hover:not(:disabled) { background: var(--red-dark); transform: scale(1.06); }
.dialog-card-nav:disabled { opacity: .22; cursor: default; }
.dialog-card-nav--prev { left: 10px; }
.dialog-card-nav--next { right: 10px; }
.dialog-close { position: absolute; z-index: 2; top: 10px; right: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; color: white; background: rgba(0,0,0,.72); font-size: 1.4rem; cursor: pointer; }
.dialog-copy { align-self: center; padding: 34px; }
.dialog-location { margin: 0; color: var(--red-dark); font-size: .68rem; font-weight: 900; text-transform: uppercase; letter-spacing: .055em; }
.dialog-copy h2 { margin: 8px 0 10px; font-size: 2rem; line-height: 1; letter-spacing: -.04em; }
.dialog-meta { margin: 0; color: var(--muted); font-size: .78rem; }
.dialog-price { margin: 12px 0 0; color: #8b621f; font-size: .82rem; font-weight: 900; }
.dialog-market-links { margin-top: 14px; display: grid; gap: 6px; }
.dialog-market-links a { padding: 8px 10px; border: 1px solid rgba(117,26,28,.24); border-radius: 7px; color: var(--red-dark); background: rgba(201,45,47,.055); font-size: .68rem; font-weight: 850; text-decoration: none; }
.dialog-market-links a:hover { color: white; border-color: var(--red-dark); background: var(--red-dark); }
.dialog-copy dl { margin: 24px 0 0; display: grid; grid-template-columns: auto 1fr; gap: 7px 18px; font-size: .72rem; }
.dialog-copy dt { color: var(--muted); }.dialog-copy dd { margin: 0; font-weight: 750; }
.auth-dialog { width: min(520px,calc(100% - 28px)); padding: 34px; overflow: visible; border: 0; border-radius: 15px; color: var(--ink); background: #fffaf2; box-shadow: 0 35px 90px rgba(0,0,0,.55); }
.auth-dialog::backdrop { background: rgba(15,10,8,.82); backdrop-filter: blur(5px); }
.auth-dialog h2 { margin: 7px 0 10px; font-size: 2rem; letter-spacing: -.045em; }
.auth-intro { margin: 0 0 20px; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.auth-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; align-items: end; }
.auth-form .invitation-field { grid-column: 1/-1; }
.auth-form label { color: var(--muted); font-size: .64rem; font-weight: 800; }
.auth-form input { width: 100%; margin-top: 5px; padding: 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: white; outline: 0; }
.auth-form input:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(201,45,47,.12); }
.auth-form button, .logout-button { min-height: 38px; padding: 9px 13px; border: 0; border-radius: 7px; color: white; background: var(--red-dark); font-size: .7rem; font-weight: 850; cursor: pointer; }
.auth-form button:disabled, .logout-button:disabled { opacity: .45; }
.auth-separator { margin: 22px 0; display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: .62rem; text-transform: uppercase; }
.auth-separator::before, .auth-separator::after { content: ""; height: 1px; flex: 1; background: var(--line); }
.auth-message { min-height: 18px; margin: 16px 0 0; color: var(--red-dark); font-size: .7rem; font-weight: 750; }
#auth-connected > p:not(.section-kicker) { color: var(--muted); }
.profile-link { display: block; margin: 16px 0 7px; color: var(--red-dark); font-size: .75rem; font-weight: 850; text-decoration: none; }
.logout-button { margin-top: 8px; }

.profile-page { padding: 46px 0 60px; }
.profile-loading { display: none; }
.route-profile.profile-error .profile-loading { min-height: min(620px,calc(100vh - 150px)); display: grid; place-content: center; }
.profile-page-heading { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.profile-identity { min-width: 0; display: flex; align-items: center; gap: 16px; }
.profile-avatar-wrap { position: relative; flex: 0 0 auto; }
.profile-actions { margin-top: 7px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.profile-tcg-switch { padding: 3px; display: inline-flex; align-items: center; gap: 3px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,250,242,.66); }
.profile-tcg-button { min-height: 31px; padding: 4px 9px 4px 6px; display: inline-flex; align-items: center; gap: 6px; border-radius: 6px; color: var(--muted); font-size: .64rem; font-weight: 850; text-decoration: none; }
.profile-tcg-button img { width: 21px; height: 21px; display: block; border-radius: 50%; object-fit: cover; }
.profile-tcg-button:hover,.profile-tcg-button:focus-visible { color: var(--red-dark); background: rgba(117,26,28,.08); outline: 0; }
.profile-tcg-button.is-active { color: white; background: var(--red-dark); box-shadow: 0 2px 7px rgba(75,28,26,.2); }
.profile-export-link { padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--red-dark); background: rgba(255,250,242,.66); font-size: .65rem; font-weight: 850; text-decoration: none; }
.profile-export-link:hover, .profile-export-link:focus-visible { color: white; border-color: var(--red-dark); background: var(--red-dark); outline: 0; }
.profile-logout-button { padding: 6px 9px; border: 1px solid rgba(117,26,28,.32); border-radius: 7px; color: var(--red-dark); background: transparent; font-size: .65rem; font-weight: 850; cursor: pointer; }
.profile-logout-button:hover, .profile-logout-button:focus-visible { color: white; border-color: var(--red-dark); background: var(--red-dark); outline: 0; }
.profile-logout-button:disabled { opacity: .45; cursor: wait; }
.profile-page-heading h1 { margin: 0; font-size: clamp(2rem,4.5vw,3.3rem); letter-spacing: -.055em; }
.profile-summary-stats { display: flex; gap: 8px; }
.profile-summary-stats div { min-width: 120px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,250,242,.64); }
.profile-summary-stats b, .profile-summary-stats span { display: block; }
.profile-summary-stats b { font-size: 1.05rem; }
.profile-summary-stats span { margin-top: 3px; color: var(--muted); font-size: .56rem; letter-spacing: .07em; text-transform: uppercase; }
.profile-favorites { margin-top: 36px; padding-bottom: 38px; border-bottom: 1px solid var(--line); }
.profile-overview { padding-top: 34px; }
.profile-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.profile-section-heading h2 { margin: 0; font-size: clamp(1.45rem,3vw,2rem); letter-spacing: -.04em; }
.profile-section-heading > span { margin-bottom: 4px; color: var(--muted); font-size: .65rem; font-weight: 800; }
.profile-highlight-actions { display: flex; align-items: center; gap: 9px; }
.profile-highlight-actions > span { color: var(--muted); font-size: .65rem; font-weight: 800; }
#profile-favorite-reorder { padding: 6px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--red-dark); background: rgba(255,250,242,.68); font-size: .62rem; font-weight: 850; cursor: pointer; }
#profile-favorite-reorder:hover,#profile-favorite-reorder:focus-visible,#profile-favorite-reorder.is-active { color: white; border-color: var(--red-dark); background: var(--red-dark); outline: 0; }
#profile-favorite-reorder:disabled { opacity: .55; cursor: wait; }
.profile-favorite-grid { margin-top: 18px; }
.profile-favorites .profile-empty { margin-top: 18px; padding: 32px; }
.profile-region-tabs { margin-top: 20px; }
.profile-kind-tabs { margin-top: 10px; }
.profile-region-tabs[hidden] + .profile-kind-tabs { margin-top: 20px; }
.profile-set-grid { margin-top: 14px; padding: 2px 2px 10px; display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 230px; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline proximity; scrollbar-color: var(--red-dark) transparent; }
.profile-edition-strip { margin-top: 9px; }
.profile-set-card { position: relative; min-height: 112px; padding: 13px; display: flex; flex-direction: column; overflow: hidden; scroll-snap-align: start; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: rgba(255,250,242,.72); box-shadow: 0 5px 14px rgba(48,29,22,.055); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.profile-set-card:hover { border-color: rgba(117,26,28,.55); transform: translateY(-2px); box-shadow: 0 13px 28px rgba(48,29,22,.12); }
.profile-set-card.is-active { border-color: var(--red-dark); box-shadow: inset 0 0 0 2px rgba(117,26,28,.12),0 13px 28px rgba(48,29,22,.1); }
.profile-set-card-code { position: absolute; top: 14px; right: 14px; color: var(--red-dark); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: .69rem; font-weight: 950; }
.profile-set-card > div:nth-child(2) { padding-right: 55px; }
.profile-set-card > div:nth-child(2) b, .profile-set-card > div:nth-child(2) span { display: block; }
.profile-set-card > div:nth-child(2) b { font-size: .9rem; line-height: 1.25; }
.profile-set-card > div:nth-child(2) span { margin-top: 5px; color: var(--muted); font-size: .59rem; text-transform: uppercase; }
.profile-set-card-stats { margin-top: 13px; color: var(--muted); font-size: .62rem; }
.profile-set-card-stats strong { color: var(--ink); }
.profile-set-card-progress { height: 5px; margin-top: 8px; overflow: hidden; border-radius: 99px; background: var(--paper-deep); }
.profile-set-card-progress i { height: 100%; display: block; background: linear-gradient(90deg,var(--red-dark),var(--red)); }
.profile-set-card em { margin-top: 6px; color: #8b621f; font-size: .65rem; font-style: normal; font-weight: 850; }
.profile-empty { margin: 30px 0 0; padding: 50px; border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); text-align: center; }
.profile-collection-detail { margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--line); }
.profile-collection-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.profile-view-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.profile-set-heading { display: flex; align-items: center; gap: 16px; }
.profile-set-heading h3 { margin: 0; font-size: clamp(1.45rem,3vw,2.1rem); letter-spacing: -.045em; }
.profile-set-heading > div > p:last-child { margin: 7px 0 0; color: var(--muted); font-size: .72rem; }
#profile-binder-shell { margin-top: 20px; }
#profile-binder-shell.binder-shell--cards, #profile-binder-shell.binder-shell--list { margin-top: 20px; }
#profile-collection-grid { margin-top: 0; }
.profile-card-grid { margin-top: 26px; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; align-items: start; }
.profile-card-grid .card-slot { grid-template-columns: 1fr; }
.profile-card-grid .card-info { min-height: 142px; }
.profile-card-grid .slot-number { display: none; }
.profile-card-grid .skeleton { min-height: 360px; }
.profile-card-grid.profile-favorite-grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 118px; gap: 8px; padding: 2px 2px 12px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline proximity; scrollbar-color: var(--red-dark) transparent; }
.profile-favorite-grid .card-slot { display: block; padding: 5px; scroll-snap-align: start; }
.profile-favorite-grid .card-info { display: none; }
.profile-favorite-grid .card-image-button { width: 100%; display: block; }
.profile-favorite-grid.is-reordering { scroll-snap-type: none; }
.profile-favorite-grid.is-reordering .profile-favorite-sortable { cursor: grab; transition: opacity .15s ease,transform .15s ease,box-shadow .15s ease; }
.profile-favorite-grid.is-reordering .profile-favorite-sortable:active { cursor: grabbing; }
.profile-favorite-grid.is-reordering .profile-favorite-sortable.is-dragging { opacity: .42; transform: scale(.96); }
.profile-favorite-grid.is-reordering .profile-favorite-sortable.is-drag-target { box-shadow: inset 0 0 0 2px var(--red-dark),0 7px 18px rgba(75,28,26,.16); transform: translateY(-3px); }
.profile-favorite-order-controls { margin-top: 5px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 3px; }
.profile-favorite-order-controls button { min-width: 0; height: 25px; padding: 0; border: 1px solid var(--line); border-radius: 5px; color: var(--red-dark); background: rgba(255,250,242,.86); font-weight: 900; cursor: pointer; }
.profile-favorite-order-controls button:hover:not(:disabled),.profile-favorite-order-controls button:focus-visible { color: white; border-color: var(--red-dark); background: var(--red-dark); outline: 0; }
.profile-favorite-order-controls button:disabled { opacity: .3; cursor: default; }
.profile-favorite-order-controls span { color: var(--muted); font-size: .82rem; line-height: 1; }

.community-page { min-height: calc(100vh - 145px); padding: 55px 0 70px; }
.community-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; padding-bottom: 30px; border-bottom: 1px solid var(--line); }
.community-heading h1 { margin: 0; font-size: clamp(2.5rem,6vw,4.8rem); letter-spacing: -.065em; }
.community-heading p:last-child { max-width: 560px; margin: 12px 0 0; color: var(--muted); font-size: .82rem; line-height: 1.55; }
.community-back-link { margin-bottom: 7px; color: var(--red-dark); font-size: .7rem; font-weight: 850; text-decoration: none; white-space: nowrap; }
.community-back-link:hover { text-decoration: underline; }
.community-results-heading { min-height: 56px; padding: 20px 1px 12px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: var(--muted); font-size: .7rem; }
.community-results-heading span { color: var(--ink); font-weight: 850; }
.community-results-heading small { font-size: .63rem; }
.community-grid { min-height: 220px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-content: start; }
.community-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,250,242,.72); box-shadow: 0 8px 22px rgba(48,29,22,.06); }
.community-card:hover { border-color: color-mix(in srgb,var(--red-dark) 45%,var(--line)); box-shadow: 0 15px 34px rgba(48,29,22,.11); transform: translateY(-2px); }
.community-profile-main { display: flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none; }
.community-avatar { width: 52px; height: 52px; font-size: 1.45rem; }
.community-identity { min-width: 0; }
.community-identity b, .community-identity span { display: block; }
.community-identity b { overflow: hidden; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.community-identity span { margin-top: 4px; color: var(--muted); font-size: .58rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.community-self { color: var(--red-dark) !important; }
.community-tcgs { margin-top: 15px; display: grid; gap: 6px; }
.community-tcg { min-height: 55px; padding: 9px 10px; display: grid; grid-template-columns: minmax(86px,.8fr) minmax(0,1fr) auto; align-items: center; gap: 8px; border: 1px solid rgba(117,26,28,.12); border-radius: 8px; color: var(--ink); background: rgba(255,255,255,.42); text-decoration: none; }
.community-tcg--pokemon { border-color: rgba(23,63,124,.14); }
.community-tcg:hover, .community-tcg:focus-visible { border-color: var(--red-dark); background: rgba(255,255,255,.8); outline: 0; }
.community-tcg.is-empty { opacity: .48; pointer-events: none; }
.community-tcg > b { font-size: .61rem; letter-spacing: .045em; }
.community-tcg div { min-width: 0; }
.community-tcg strong, .community-tcg span { display: block; }
.community-tcg strong { font-size: .75rem; }
.community-tcg span { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: .57rem; text-overflow: ellipsis; white-space: nowrap; }
.community-tcg > i { color: var(--red-dark); font-size: 1rem; font-style: normal; font-weight: 900; }

@media (max-width: 880px) {
  .topbar { grid-template-columns: minmax(198px,1fr) minmax(240px,660px) minmax(198px,1fr); gap: 12px; }.catalog-total { display: none; }.collection-total { display: none; }
  .tcg-home { grid-template-columns: 1fr; }.home-copy h1 span { display: inline; }.home-copy > p:last-child { margin-top: 20px; }
  .login-home { grid-template-columns: 1fr; }.login-showcase { min-height: 330px; }.login-visual-cards span { width: min(22vw,175px); }.login-access { padding-block: 52px 64px; }.login-card { width: min(100%,470px); }
  .hero { background-position: 62% center; }.hero-copy { width: min(620px,76vw); }
  .card-slot { grid-template-columns: 1fr; }.card-info { min-height: 105px; }
  .card-grid--cards { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .profile-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.community-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .profile-page-heading { align-items: start; flex-direction: column; }.profile-summary-stats { width: 100%; }.profile-summary-stats div { min-width: 0; flex: 1; }
  .card-grid--list .card-info { grid-template-columns: 105px minmax(150px,1fr) 95px minmax(210px,1fr); }
  .card-grid--list .card-variant { display: none; }
  .card-grid--list .inventory-control { grid-column: 1/-1; }
}
@media (max-width: 620px) {
  .topbar { padding: 9px 12px; grid-template-columns: 128px minmax(0,1fr) 83px; gap: 9px; }.tcg-switcher { gap: 5px; }.tcg-switcher-option, .community-link, .header-account .site-locale-button { width: 36px; height: 36px; }.community-link { margin-right: 0; }.global-search kbd { display: none; }.header-account { gap: 7px; }.account-button { width: 38px; height: 38px; padding: 2px; }.account-button .profile-avatar { width: 32px; height: 32px; font-size: .95rem; }
  .search-panel { position: fixed; top: 67px; left: 8px; right: 8px; max-height: calc(100vh - 76px); }
  .search-result { grid-template-columns: 32px minmax(0,1fr) 24px; gap: 8px; }.search-result img { width: 32px; height: 45px; }.search-set { grid-column: 2; padding: 4px 0 0; border: 0; }.search-result i { grid-column: 3; grid-row: 1/span 2; }
  .tcg-home { width: calc(100% - 24px); padding: 42px 0; }.home-copy h1 { font-size: 3.8rem; }.tcg-choice { min-height: 155px; padding: 18px; grid-template-columns: 48px minmax(0,1fr); gap: 14px; }.tcg-choice-icon { width: 48px; height: 48px; font-size: 1.45rem; }.tcg-choice > b { display: none; }.tcg-choice h2 { font-size: 1.45rem; }
  .login-showcase { min-height: 240px; }.login-visual-cards span { width: 105px; border-radius: 10px; }.login-visual-cards span:nth-child(1) { top: 7%; right: 30%; }.login-visual-cards span:nth-child(2) { top: 4%; right: 3%; }.login-visual-cards span:nth-child(3) { right: 16%; bottom: -22%; }.login-showcase-brand { left: 20px; bottom: 26px; }.login-showcase-brand b { font-size: clamp(2.85rem,13vw,4rem); }.login-access { padding: 38px 20px 50px; }.login-card-heading { margin-bottom: 25px; }.login-card-heading h1 { font-size: 2.65rem; }.login-tabs { margin-bottom: 23px; }
  .hero { min-height: 330px; padding: 36px 16px 30px; background-image: linear-gradient(90deg,rgba(3,11,21,.94),rgba(3,11,21,.58)),url("one-piece-hero.webp"); background-position: 68% center; }.hero-copy { width: 100%; }.hero-logo { width: min(72vw,340px); max-height: 112px; }.tcg-pokemon .hero-logo, .route-tcg-pokemon .hero-logo { width: min(58vw,270px); max-height: 170px; }
  main, footer { width: calc(100% - 24px); }.section-heading { align-items: start; flex-direction: column; }.section-heading > p { text-align: left; }
  .route-tcg-pokemon:not(.catalog-ready) #kind-tabs:empty { min-height: 183px; }.route-tcg-onepiece:not(.route-login):not(.route-profile):not(.catalog-ready) #kind-tabs:empty { min-height: 73px; }.series-strip { grid-auto-columns: minmax(142px,70%); }.tcg-pokemon .series-strip { grid-auto-columns: minmax(200px,82%); }.edition-strip, .profile-edition-strip { padding: 7px; }.edition-strip-label { display: none; }.set-heading { align-items: start; }.set-progress { min-width: 110px; }.set-code { width: 58px; height: 58px; }.set-heading h2 { font-size: 1.45rem; }
  .binder-toolbar { align-items: end; flex-direction: column-reverse; }.binder-actions { width: 100%; justify-content: space-between; }.rarity-list { align-self: start; }
  .collection-tools { align-items: stretch; flex-direction: column; }.sort-control { justify-content: space-between; }.sort-control select { flex: 1; }
  .binder-shell { padding: 12px 7px 12px 21px; border-radius: 10px; }.rings { left: 3px; padding: 29px 0; }.rings i { width: 28px; height: 8px; border-width: 2px; }
  .card-grid { min-height: 600px; gap: 5px; padding: 6px; }.card-slot { gap: 5px; padding: 5px; border-radius: 4px; }.slot-number { top: 2px; left: 2px; width: 19px; height: 19px; border-width: 1px; font-size: .53rem; }
  .card-info { min-height: 110px; padding: 1px 0; }.code-line { display: block; }.code-line strong { display: block; font-size: .55rem; }.rarity { display: inline-block; margin-top: 3px; padding: 2px 4px; font-size: .45rem; }
  .card-name { margin-top: 5px; font-size: .55rem; -webkit-line-clamp: 2; }.card-variant { font-size: .49rem; }.card-price { margin-top: 4px; font-size: .52rem; }.quantity-control { grid-template-columns: 23px minmax(24px,1fr) 23px; gap: 2px; }.quantity-control button { width: 23px; height: 23px; }.quantity-control output { font-size: .63rem; }
  .card-slot--empty { min-height: 225px; font-size: .57rem; }.page-nav { grid-template-columns: 1fr 1fr; }.page-buttons { grid-column: 1/-1; grid-row: 2; }.page-arrow:last-child { justify-self: end; }.page-arrow em { display: none; }
  .card-grid--cards, .card-grid--list { min-height: 0; padding: 0; }.card-grid--cards { grid-template-columns: repeat(2,minmax(0,1fr)); }.card-grid--cards .card-info { min-height: 135px; }.card-grid--list { grid-template-columns: 1fr; }.card-grid--list .card-slot { min-height: 0; padding: 10px; }.card-grid--list .card-info { min-height: 0; grid-template-columns: 88px minmax(0,1fr) 92px; gap: 8px; }.card-grid--list .card-price { text-align: right; }.card-grid--list .inventory-control { grid-column: 1/-1; grid-template-columns: 1fr 110px 34px; }.card-grid--list .quantity-control { width: 110px; }
  footer { grid-template-columns: 1fr; gap: 12px; text-align: center; }.card-dialog[open] { display: block; max-height: calc(100vh - 28px); overflow: auto; }.dialog-card-surface { width: min(100%,47.3vh); }.dialog-copy { padding: 23px; }
  .auth-dialog { padding: 27px 20px; }.auth-form { grid-template-columns: 1fr; }.auth-form button { width: 100%; }
  .profile-page { padding-top: 32px; }.profile-identity { align-items: center; }.profile-avatar--large { width: 56px; height: 56px; }.profile-set-grid { grid-auto-columns: 210px; }.profile-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.profile-card-grid.profile-favorite-grid { grid-template-columns: none; grid-auto-columns: 98px; }.profile-summary-stats { gap: 5px; }.profile-summary-stats div { padding: 8px; }.profile-summary-stats span { font-size: .48rem; }.profile-collection-heading { align-items: flex-start; flex-direction: column; }.profile-view-actions { width: 100%; justify-content: flex-start; }.profile-set-heading { align-items: flex-start; }.profile-set-heading h3 { font-size: 1.65rem; }.community-page { padding-top: 34px; }.community-heading { align-items: flex-start; flex-direction: column; gap: 16px; }.community-heading h1 { font-size: 3.2rem; }.community-back-link { margin: 0; }.community-results-heading { align-items: flex-start; flex-direction: column; gap: 4px; }.community-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto!important; animation-duration: .01ms!important; transition-duration: .01ms!important; } }