/* A shop landing, scoped independently from the illustrated catalog window. */
body .pf-landing { --pl-ink:#493c43; --pl-pink:#fbe0e8; --pl-coral:#bf3f58; --pl-mint:#dff5ed; width:min(1200px,calc(100% - 2rem)); margin:2rem auto 4rem; color:var(--pl-ink); font-family:'Chiron GoRound TC',sans-serif; }
.pf-landing * { box-sizing:border-box; }
.pf-landing a { color:inherit; text-decoration:none; }
.pf-landing a:focus-visible { outline:3px solid #823c70; outline-offset:4px; }
.pf-landing .material-symbols-rounded { font-family:'Material Symbols Rounded'; font-weight:normal; font-style:normal; font-size:1.35rem; line-height:1; font-feature-settings:'liga'; font-variation-settings:'FILL' 1; }
.pf-landing-hero { position:relative; display:grid; grid-template-columns:1fr 1fr; align-items:center; min-height:365px; overflow:hidden; border:3px solid #fff; border-radius:2rem; background:linear-gradient(125deg,#ffe7ef 0%,#fff9e8 58%,#def5ed 100%); box-shadow:0 8px 0 #d8bdac,0 14px 34px #5c45402b; }
.pf-landing-hero--solo { grid-template-columns:1fr; min-height:290px; }
.pf-landing-hero__copy { position:relative; z-index:1; padding:clamp(2rem,5vw,4.5rem); }
.pf-landing-kicker,.pf-landing-eyebrow { color:#9d5268; font-size:.78rem; font-weight:900; letter-spacing:.12em; }
.pf-landing-kicker { display:inline-flex; align-items:center; gap:.35rem; padding:.5rem .8rem; border-radius:999px; background:#fff9; }
.pf-landing-hero h1 { margin:.75rem 0 .4rem; color:#743c51; font-size:clamp(2.3rem,4vw,4rem); line-height:1.15; overflow-wrap:anywhere; }
.pf-landing-hero__copy > p { margin:0; font-size:clamp(1rem,1.3vw,1.15rem); line-height:1.7; }
.pf-landing-actions { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.5rem; }
.pf-landing .pf-landing-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:48px; padding:.7rem 1.2rem; border:2px solid #fff; border-radius:999px; background:#b63853; box-shadow:0 3px 0 #8d3349; color:#fff; font-weight:800; }
.pf-landing .pf-landing-button:hover { background:#992d45; color:#fff; }
.pf-landing .pf-landing-button--secondary { background:#fff; border-color:#e8aebc; box-shadow:0 3px 0 #e8aebc; color:#843b50; }
.pf-landing .pf-landing-button--secondary:hover { background:#fff1f4; color:#743246; }
.pf-landing-hero__character { align-self:stretch; position:relative; display:flex; justify-content:center; min-height:320px; padding:1.5rem 1.5rem 0; }
.pf-landing-hero__character::before { content:''; position:absolute; inset:12% 12% 0; border-radius:50% 50% 0 0; background:#fff8; }
.pf-landing-hero__character img { position:relative; max-width:100%; width:auto; height:100%; max-height:390px; object-fit:contain; object-position:bottom; }
.pf-landing-hero__art {position:relative;display:flex;align-items:end;justify-content:center;width:100%;height:100%}
.pf-landing-hero__art[hidden] {display:none}
.pf-landing-hero__art--service img {width:100%;height:100%;max-height:320px;object-fit:contain;object-position:center}
.pf-landing-hero.is-service-slide :is(.pf-landing-speech,.pf-landing-speech-open) {display:none}
.pf-landing-speech { position:absolute; right:1.5rem; bottom:1.5rem; max-width:14rem; padding:.7rem 1rem; border:2px solid #fff; border-radius:1rem; background:#fff4f5ed; box-shadow:0 3px 0 #e6b9c1; font-size:var(--pf-ui-secondary, 14px); }
.pf-landing-speech strong { color:#9b405b; }
.pf-landing-speech [data-pf-landing-mute] {float:right;display:grid;place-items:center;width:44px;height:44px;margin:-.5rem -.6rem 0 .25rem;padding:0;border:0;border-radius:50%;background:transparent;color:#653c4b;cursor:pointer}
.pf-landing-speech [data-pf-landing-mute]:focus-visible {outline:3px solid #823c70;outline-offset:2px}
.pf-landing-speech-open:not([hidden]) {position:absolute;right:1.5rem;bottom:1.5rem;display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:6px 12px;border:1px solid #d3a6a7;border-radius:999px;background:#fff8ef;color:#653c4b;font:inherit;font-weight:800;cursor:pointer}
.pf-landing-speech-open:focus-visible {outline:3px solid #823c70;outline-offset:2px}
.pf-landing-speech p { margin:.2rem 0 0; line-height:1.5; }
.pf-landing-section { margin-top:3rem; }
.pf-landing-heading { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin-bottom:1rem; }
.pf-landing-heading h2 { margin:.2rem 0 0; color:#653c4b; font-size:clamp(1.45rem,2vw,1.85rem); }
.pf-landing-heading > a { flex:none; color:#963b56; font-weight:800; font-size:.9rem; }
.pf-landing-heading > a:hover,.pf-landing-product h3 a:hover { color:#a4314b; text-decoration:none; }
.pf-landing-categories { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; }
.pf-landing-category { display:flex; align-items:center; gap:.7rem; min-width:0; min-height:76px; padding:.9rem; border:2px solid #fff; border-radius:1.1rem; background:#fbdfe8; box-shadow:0 3px 0 #e9b9c6; }
.pf-landing-category:nth-child(4n + 2) { background:#d9f3e9; box-shadow:0 3px 0 #acd9c8; }
.pf-landing-category:nth-child(4n + 3) { background:#fff0c9; box-shadow:0 3px 0 #e7d39f; }
.pf-landing-category:nth-child(4n + 4) { background:#e7e4fb; box-shadow:0 3px 0 #cbc2e9; }
.pf-landing-category strong { min-width:0; overflow-wrap:anywhere; }
.pf-landing-category__arrow { margin-left:auto; }
.pf-landing-category:hover { transform:translateY(-2px); }
.pf-landing-products { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.pf-landing-product { min-width:0; overflow:hidden; border:2px solid #f0d8d3; border-radius:1.2rem; background:#fffdfa; box-shadow:0 4px 0 #e9d2c7; }
.pf-landing-product__image { display:grid; place-items:center; aspect-ratio:1; padding:1rem; background:#fff0f2; }
.pf-landing-product:nth-child(even) .pf-landing-product__image { background:#e9f7f1; }
.pf-landing-product__image img { display:block; width:100%; height:100%; object-fit:contain; }
.pf-landing-product__body { padding:1rem; }
.pf-landing-product h3 { margin:0 0 .5rem; font-size:1rem; line-height:1.45; overflow-wrap:anywhere; }
.pf-landing-product__price { color:#a4314b; font-weight:800; }
.pf-landing-product__status {margin:0 0 .35rem;color:#526750;font-size:.875rem;line-height:1.4}
.pf-landing-empty { padding:1.25rem; border-radius:1rem; background:#fff9; }
@media (max-width:760px) { body .pf-landing { width:min(100% - 1.25rem,600px); margin-top:1rem; } .pf-landing-hero { grid-template-columns:1fr; } .pf-landing-hero__copy { padding:2rem 1.5rem 1rem; } .pf-landing-hero--solo .pf-landing-hero__copy { padding:2rem 1.5rem; } .pf-landing-hero__character { min-height:230px; max-height:300px; } .pf-landing-hero__character img { max-height:280px; } .pf-landing-section { margin-top:2rem; } .pf-landing-categories,.pf-landing-products { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:380px) { .pf-landing-heading { align-items:start; flex-direction:column; gap:.4rem; } .pf-landing-category { padding:.7rem; font-size:.85rem; } .pf-landing-category__arrow { display:none; } }
@media (prefers-reduced-motion:reduce) { .pf-landing-category:hover { transform:none; } }
/* Editorial browsing rhythm inspired by the reference, using shop-owned content. */
body.pf-game-page.pf-components-page .pf-game-main--landing .pf-game-header {display:none}
.pf-landing-brand-logo {width:58px;height:58px;object-fit:contain}
.pf-landing-hero__copy [data-pf-slide][hidden] {display:none}
.pf-landing-hero h2 {margin:.75rem 0 .4rem;color:#743c51;font-size:clamp(2.3rem,4vw,4rem);line-height:1.15}
.pf-hero-controls {position:absolute;z-index:3;left:clamp(1rem,4vw,4rem);bottom:1rem;display:flex;align-items:center;gap:.4rem;color:#5b3c43;font-size:.875rem;font-weight:700}
.pf-hero-controls[hidden] {display:none}
.pf-hero-controls button {display:grid;place-items:center;width:44px;height:44px;border:1px solid #be918b;border-radius:999px;background:#fffdf8;color:#653c4b;cursor:pointer}
.pf-hero-controls button:focus-visible {outline:3px solid #244c3a;outline-offset:2px}
.pf-landing-section-guide {display:flex;align-items:center;gap:.6rem;margin:0 0 1rem;color:#68414d}
.pf-landing-section-guide img {width:52px;height:62px;object-fit:contain;object-position:bottom}
.pf-landing-section-guide p {margin:0;line-height:1.5}
.pf-landing-editorial {display:flex;flex-direction:column;justify-content:end;align-items:center;min-width:0;min-height:260px;padding:1rem;overflow:hidden;border:2px solid #f0d8d3;border-radius:1.2rem;background:linear-gradient(145deg,#fce0eb,#e5f5e9);box-shadow:0 4px 0 #e9d2c7}
.pf-landing-editorial img {min-height:0;max-width:100%;height:210px;object-fit:contain;object-position:bottom}
.pf-landing-editorial p {margin:.5rem 0 0;color:#653c4b;font-size:.875rem;line-height:1.45}
.pf-landing-footer {display:flex;flex-wrap:wrap;gap:2rem 5rem;width:min(1200px,calc(100% - 2rem));margin:0 auto 3rem;padding:2rem;border-top:1px solid #dabfae;color:#493c43;font-family:'Chiron GoRound TC',sans-serif}
.pf-landing-footer nav {display:flex;flex-direction:column;gap:.55rem}
.pf-landing-footer__official a {display:flex;align-items:center;gap:.4rem}
.pf-landing-footer strong {font-weight:900}
.pf-landing-footer a {color:#653c4b}
.pf-landing-footer a:focus-visible {outline:3px solid #244c3a;outline-offset:3px}
.pf-landing-service {display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,260px);align-items:center;gap:1rem;padding:clamp(1.5rem,4vw,3rem);border:2px solid #fff;border-radius:1.5rem;background:linear-gradient(125deg,#dff6eb,#fff1e1 65%,#f9ddea)}
.pf-landing-service h2 {margin:0 0 .5rem;font-size:clamp(1.5rem,2.2vw,2rem);color:#653c4b}
.pf-landing-service p {line-height:1.6}
.pf-landing-service__guide {display:flex;align-items:center;gap:.5rem}
.pf-landing-service__guide img {width:95px;height:140px;object-fit:contain}
.pf-landing-service__guide p {font-size:.875rem}
.pf-landing > .pf-landing-section[aria-labelledby="pf-landing-categories"] {margin:0 0 1.5rem}
.pf-landing > .pf-landing-section[aria-labelledby="pf-landing-categories"] .pf-landing-heading {margin-bottom:.6rem}
.pf-landing > .pf-landing-section[aria-labelledby="pf-landing-categories"] .pf-landing-categories {display:flex;gap:1rem;overflow-x:auto;scrollbar-width:thin;padding:2px 2px 10px}
.pf-landing > .pf-landing-section[aria-labelledby="pf-landing-categories"] .pf-landing-category {flex:0 0 112px;display:flex;flex-direction:column;align-items:center;justify-content:start;gap:.5rem;min-height:0;padding:0;border:0;background:none;box-shadow:none;border-radius:0;text-align:center;font-size:.875rem}
.pf-category-portrait {display:grid;place-items:center;width:76px;height:76px;overflow:hidden;border-radius:50%;background:#ffe5ec;color:#7c4350}
.pf-category-portrait .material-symbols-rounded {font-size:28px;font-variation-settings:'FILL' 1}
.pf-category-portrait img {display:block;width:100%;height:100%;object-fit:contain}
.pf-landing > .pf-landing-section[aria-labelledby="pf-landing-categories"] .pf-landing-category:nth-child(even) .pf-category-portrait {background:#dff4e9}
.pf-intent-grid,.pf-collection-tiles,.pf-help-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.pf-intent-grid a {display:flex;align-items:center;gap:.75rem;min-height:92px;padding:1.2rem;border:2px solid #fff;border-radius:1.2rem;background:#e0f5ec;box-shadow:0 3px 0 #bad8c8;font-weight:800}
.pf-intent-grid a:nth-child(2) {background:#ffe6ec;box-shadow:0 3px 0 #e4bfca}
.pf-intent-grid a:nth-child(3) {background:#fff0cb;box-shadow:0 3px 0 #e3d1a8}
.pf-intent-grid a > .pf-material-symbol:last-child {margin-left:auto}
.pf-collection-tiles {grid-template-columns:repeat(4,minmax(0,1fr))}
.pf-collection-tiles a {display:grid;grid-template-columns:1fr auto;align-items:center;gap:.75rem;padding:.75rem;border:2px solid #f0d8d3;border-radius:1.2rem;background:#fffdfa;box-shadow:0 4px 0 #e9d2c7}
.pf-collection-tiles a > span:first-child {grid-column:1/-1;display:grid;place-items:center;aspect-ratio:1.2;background:#fce8ed;border-radius:.8rem;overflow:hidden}
.pf-collection-tiles a:nth-child(even) > span:first-child {background:#e3f5ec}
.pf-collection-tiles img {width:100%;height:100%;object-fit:contain}
.pf-collection-tiles strong {overflow-wrap:anywhere}
.pf-collection-products {grid-template-columns:repeat(4,minmax(0,1fr))}
.pf-landing-help,.pf-landing-story {padding:clamp(1.25rem,3vw,2.5rem);border-radius:1.5rem;background:#e7f6ee}
.pf-landing-help h2,.pf-landing-story h2 {margin:0 0 1rem;color:#653c4b}
.pf-help-grid > div {padding:1rem;border:1px solid #d2e5d8;border-radius:1rem;background:#fffdf8}
.pf-help-grid p {margin:.5rem 0 0;line-height:1.6}
.pf-feature-split {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1rem,4vw,3rem);align-items:center;padding:clamp(1.2rem,3vw,2.5rem);border-radius:1.5rem;background:#fff3ef}
.pf-feature-split[hidden] {display:none}
.pf-feature-collections > h2 {color:#653c4b;font-size:clamp(1.45rem,2vw,1.85rem)}
.pf-collection-tabs {display:flex;gap:.6rem;margin:0 0 1rem;overflow-x:auto;padding:3px 3px 8px}
.pf-collection-tabs[hidden] {display:none}
.pf-collection-tabs button {flex:0 0 auto;min-height:44px;padding:.55rem 1rem;border:1px solid #9eaf98;border-radius:999px;background:#fffdf8;color:#36513e;font:inherit;font-weight:800;cursor:pointer}
.pf-collection-tabs button[aria-selected=true] {border-color:#a15648;background:#a93f3c;color:#fff}
.pf-collection-tabs button:focus-visible {outline:3px solid #244c3a;outline-offset:2px}
.pf-feature-split h2 {font-size:clamp(1.6rem,2.5vw,2rem);color:#653c4b}
.pf-feature-split h3 {font-size:clamp(1.6rem,2.5vw,2rem);color:#653c4b}
.pf-feature-split__copy > p {line-height:1.6}
.pf-feature-thumbs {display:flex;gap:.5rem}
.pf-feature-thumbs a {width:64px;height:64px;padding:4px;border-radius:.65rem;background:#fff}
.pf-feature-thumbs img {width:100%;height:100%;object-fit:contain}
.pf-feature-split__image {display:grid;place-items:center;aspect-ratio:1.25;min-width:0;overflow:hidden;border-radius:1.1rem;background:#e2f4eb}
.pf-feature-split__image img {width:100%;height:100%;object-fit:contain}
.pf-showcase-rail {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.pf-showcase-rail a {display:flex;flex-direction:column;gap:.6rem;font-weight:800}
.pf-showcase-rail img {width:100%;aspect-ratio:1;object-fit:contain;border-radius:1.1rem;background:#e8f6ef}
.pf-showcase-controls {display:flex;justify-content:end;gap:.5rem;margin-top:.5rem}
.pf-showcase-controls[hidden] {display:none}
.pf-showcase-controls button {display:grid;place-items:center;min-width:44px;min-height:44px;border:1px solid #9eaf98;border-radius:999px;background:#fffdf8;color:#36513e;cursor:pointer}
.pf-showcase-controls button:disabled {opacity:.45;cursor:default}
.pf-showcase-controls button:focus-visible {outline:3px solid #244c3a;outline-offset:2px}
.pf-feature-pair {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.pf-feature-pair > a {position:relative;display:flex;align-items:end;min-height:270px;overflow:hidden;border-radius:1.2rem;background:#fce8ed}
.pf-feature-pair > a:nth-child(even) {background:#e4f4e9}
.pf-feature-pair img {position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.pf-feature-pair > a > span {position:relative;display:flex;flex-direction:column;align-items:start;gap:.5rem;margin:1rem;padding:.8rem;border-radius:.8rem;background:#fffdf4ed;color:#653c4b}
.pf-keeper-band {display:flex;align-items:center;justify-content:center;gap:clamp(1rem,4vw,3rem);padding:1.5rem;border-radius:1.5rem;background:#fff0bd;color:#653c4b}
.pf-keeper-band img {width:140px;height:190px;object-fit:contain;object-position:bottom}
.pf-keeper-band h2 {margin:0;font-size:clamp(1.5rem,2.4vw,2rem)}
.pf-more-directions {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.pf-more-directions a {display:flex;align-items:center;gap:.7rem;padding:.6rem;border:1px solid #e8d6ca;border-radius:1rem;background:#fffdfa}
.pf-more-directions img {width:60px;height:60px;object-fit:contain;border-radius:.7rem;background:#fce8ed}
.pf-more-directions strong {overflow-wrap:anywhere}
@media(max-width:760px) {
 body.pf-game-page.pf-components-page .pf-game-main--landing .pf-landing {margin-top:4rem}
 .pf-landing-hero__copy {padding-bottom:1rem}
 .pf-landing-hero__character {padding-bottom:3rem}
 .pf-landing-speech,.pf-landing-speech-open:not([hidden]) {bottom:4rem}
 .pf-hero-controls {left:1rem;bottom:.5rem}
 .pf-landing-editorial {min-height:190px;padding:.6rem}
 .pf-landing-editorial img {height:145px}
 .pf-landing-footer {gap:1.5rem 3rem;padding:1.5rem .5rem}
 .pf-landing-service {grid-template-columns:1fr}
 .pf-landing-service__guide img {width:70px;height:90px}
 .pf-landing-categories {display:flex;gap:.6rem;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;padding:2px 2px 10px}
 .pf-landing-category {flex:0 0 auto;max-width:85%;min-height:56px;padding:.65rem .9rem;gap:.45rem}
 .pf-landing-category strong {overflow-wrap:normal;word-break:normal}
 .pf-intent-grid {grid-template-columns:1fr}
 .pf-intent-grid a {min-height:64px;padding:.75rem 1rem}
 .pf-collection-tiles {display:flex;overflow-x:auto;scrollbar-width:thin;padding:2px 2px 10px}
 .pf-collection-tiles a {flex:0 0 min(65vw,240px)}
 .pf-collection-products {grid-template-columns:repeat(2,minmax(0,1fr))}
 .pf-help-grid {grid-template-columns:1fr;gap:.6rem}
 .pf-feature-split {grid-template-columns:1fr}
 .pf-feature-pair {grid-template-columns:1fr}
 .pf-showcase-rail {display:flex;overflow-x:auto;scrollbar-width:thin;padding-bottom:10px}
 .pf-showcase-rail a {flex:0 0 min(70vw,250px)}
 .pf-keeper-band img {width:100px;height:140px}
 .pf-more-directions {grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
 .pf-more-directions a {flex-direction:column;align-items:start}
}