:root { --pg-red:#bb0404; --pg-cream:#f0e8dc; --pg-gutter:clamp(20px,2.2vw,40px); --pg-header-height:73px; --pg-nav-font:500 16px/1.1 'DM Sans',sans-serif; }
html { scroll-behavior:smooth; scroll-padding-top:var(--pg-header-height); }
.pg-content-root { grid-column:fullbleed; min-width:0; width:100%; position:relative; z-index:2; }
.pg-v1 { color:#111; font-family:'DM Sans',sans-serif; }
.pg-v1 *, .pg-site-header * { box-sizing:border-box; }
.pg-v1 a { color:inherit; text-decoration:none; }
.pg-v1 button, .pg-v1 input, .pg-v1 textarea { font:inherit; }
.pg-v1 button { cursor:pointer; }
.pg-v1 img { display:block; max-width:100%; height:auto; }
.pg-v1 p,.pg-v1 h1,.pg-v1 h2,.pg-v1 h3,.pg-v1 figure { margin:0; }
.pg-section { padding:clamp(64px,8vw,140px) var(--pg-gutter); position:relative; }
.pg-heading { font:900 clamp(36px,5.8vw,96px)/.98 'Filson Pro',sans-serif; letter-spacing:-.04em; }
.pg-copy { font-size:clamp(16px,1.65vw,24px); line-height:1.4; max-width:42ch; }
.pg-eyebrow { font-size:14px; line-height:1.3; text-transform:uppercase; letter-spacing:.04em; }
.pg-text-link { display:inline-block; width:fit-content; font-size:16px; line-height:1.3; padding-bottom:6px; border-bottom:1px solid currentColor; }
.pg-text-link:hover { color:var(--pg-red); }
.pg-section-line { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.pg-section-line>.pg-copy { max-width:55ch; }
.pg-page-heading { display:grid; grid-template-columns:1fr 300px; align-items:end; gap:32px; padding-top:clamp(68px,8vw,130px); padding-bottom:56px; border-bottom:1px solid #1116; margin:0 var(--pg-gutter); padding-inline:0; }
.pg-page-title { font:900 clamp(60px,12vw,200px)/.88 'Filson Pro',sans-serif; letter-spacing:-.055em; overflow-wrap:normal; }
.pg-page-heading .pg-copy { font-size:16px; }
.pg-page-heading:has(.pg-page-title) { grid-template-columns:minmax(0,1fr) minmax(200px,24%); }
.pg-games-section { padding-top:54px; }
.pg-home-content .pg-section-line { position:relative; z-index:2; }
.pg-game-card { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr); gap:clamp(28px,5vw,90px); align-items:center; }
.pg-home-games { margin-top:50px; }
.pg-game-media { aspect-ratio:760/520; background:transparent; border-radius:24px; position:relative; overflow:hidden; }
.pg-game-media-link { display:flex; width:100%; height:100%; align-items:center; justify-content:center; padding:22px; }
.pg-game-media video { display:block; height:100%; width:auto; max-width:100%; object-fit:contain; border-radius:16px; }
.pg-game-caption { display:flex; flex-direction:column; align-items:start; gap:25px; position:relative; z-index:2; }
.pg-game-name { font:900 clamp(34px,4.8vw,80px)/1 'Filson Pro',sans-serif; text-transform:uppercase; }
.pg-game-caption .pg-copy { max-width:21ch; }.pg-join { z-index:2; background:var(--pg-cream); }.pg-studio-story { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; }
.pg-studio-copy { display:flex; flex-direction:column; align-items:start; gap:30px; }
.pg-join { border-top:1px solid #1116; }
.pg-join-title { font:900 clamp(48px,8vw,130px)/1 'Filson Pro',sans-serif; letter-spacing:-.045em; margin-top:30px !important; max-width:15ch; }
.pg-join-link:hover { color:var(--pg-red); }
.pg-team-section { padding-top:45px; }
.pg-team { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.pg-person-visual { aspect-ratio:3/4; display:flex; flex-direction:column; justify-content:space-between; padding:20px; background:var(--pg-red); color:var(--pg-cream); overflow:hidden; }
.pg-person-portrait { position:absolute; inset:auto 0 0; width:100%; height:91%; object-fit:contain; object-position:center bottom; }
.pg-person:nth-child(2) .pg-person-visual { background:#cec4b5; color:var(--pg-red); }
.pg-person:nth-child(3) .pg-person-visual { background:#bcb29f; color:var(--pg-red); }
.pg-person:nth-child(4) .pg-person-visual { background:#30281f; }
.pg-person:has(.pg-person-portrait) .pg-person-visual { position:relative; justify-content:flex-start; background:transparent; color:var(--pg-red); }
.pg-person-name { font:500 20px/1.2 'DM Sans',sans-serif; color:var(--pg-red); text-align:center; margin-top:20px !important; }
.pg-person-role { font-size:14px; color:var(--pg-red); text-align:center; margin-top:8px !important; }
.pg-studio-story { border-top:1px solid #1116; }
.pg-materials { position:relative; aspect-ratio:1; width:100%; }
.pg-materials img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; visibility:hidden; }
.pg-materials img[data-visible="true"] { visibility:visible; }
.pg-application,.pg-partner-form { display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:start; border-top:1px solid #1116; }
.pg-form-intro { display:flex; flex-direction:column; align-items:start; gap:30px; }
.pg-form-intro .pg-heading { font-size:clamp(42px,5vw,80px); }
.pg-demo-form { display:grid; grid-template-columns:1fr 1fr; gap:32px 24px; }
.pg-field { display:flex; flex-direction:column; gap:12px; min-width:0; font-size:14px; }
.pg-field input,.pg-field textarea,.pg-field select { width:100%; min-width:0; border:0; border-bottom:1px solid #1118; border-radius:0; background:transparent; padding:12px 0; font-size:18px; color:#111; outline-offset:5px; }
.pg-field input,.pg-field select { min-height:48px; }
.pg-field textarea { resize:vertical; min-height:110px; }
.pg-field-wide { grid-column:1/-1; }
.pg-submit { grid-column:1/-1; width:fit-content; border:0; border-bottom:1px solid #111; background:none; padding:8px 0; font-size:18px; }
.pg-form-status { grid-column:1/-1; font-size:14px; line-height:1.4; }
.pg-form-status:empty { display:none; }
.pg-footer { grid-column:fullbleed; padding:50px var(--pg-gutter) 35px; position:relative; z-index:2; background:var(--pg-cream); border-top:1px solid #1116; }
.pg-footer-top { display:flex; align-items:start; justify-content:space-between; gap:32px; margin-bottom:60px; }
.pg-footer nav,.pg-footer-socials { display:flex; flex-wrap:wrap; gap:16px 26px; }
.pg-footer .pg-text-link { font:var(--pg-nav-font); letter-spacing:normal; text-transform:none; padding:10px 0; border:0; }
.pg-footer-socials { color:var(--pg-red); }
.pg-v1 :focus-visible { outline:2px solid var(--pg-red); outline-offset:5px; }
@media (max-width:1100px) {
  .pg-page-heading:has(.pg-page-title) { grid-template-columns:1fr; }
  .pg-page-heading .pg-copy { max-width:40ch; }
  .pg-game-card { grid-template-columns:minmax(0,1.3fr) minmax(200px,1fr);gap:30px; }
  .pg-team { grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 20px; }
}
@media (max-width:600px) {
  .pg-section { padding-block:60px; }
  .pg-page-heading { padding-top:60px; padding-bottom:35px; }
  .pg-page-title { font-size:17.2vw;line-height:.92; }
  .pg-page-heading .pg-page-title { max-width:100%; }
  .pg-section-line { align-items:start;flex-direction:column;gap:22px; }
  .pg-games-section { padding-top:44px; }
  .pg-home-games { margin-top:32px; }
  .pg-game-card { grid-template-columns:1fr;gap:25px; }
  .pg-game-media { aspect-ratio:4/5; }
  .pg-game-media-link { padding:18px 18px 54px; }
  .pg-game-caption { gap:18px; }
  .pg-game-name { font-size:44px; }
  .pg-game-caption .pg-copy { max-width:none; }.pg-studio-story { grid-template-columns:1fr;gap:30px; }
  .pg-join-title { font-size:12vw; }
  .pg-person-visual { padding:12px; }
  .pg-person-name { font-size:17px; }
  .pg-application,.pg-partner-form { grid-template-columns:1fr;gap:48px; }
  .pg-demo-form { gap:28px 18px; }
  .pg-demo-form .pg-field { grid-column:1/-1; }
  .pg-footer-top { flex-direction:column;gap:30px;margin-bottom:40px; }
  .pg-footer nav { display:grid;grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Keep all header controls behind the opening, including before hydration. */
html:not([data-pg-header-ready="true"]) header[data-header-stick] { visibility:hidden; pointer-events:none; }
html[data-pg-skip-intro="true"] header[data-header-stick] { visibility:visible; pointer-events:auto; }.pg-submit { color:#111; }
.pg-heading,.pg-page-title,.pg-game-name,.pg-join-title { color:var(--pg-red); }
svg[aria-label="POMODORO®"] { color:var(--pg-red) !important; }
/* The moving wordmark sits in front of the tomato without changing the scene. */
.pg-hero > div:has(svg[aria-label="POMODORO®"]) { z-index:2; }

/* Leave room for the arriving header before the games heading. */
.pg-games-scroll {
  --pg-games-top:73px; position:relative;
  padding-top:calc(var(--pg-games-top) + clamp(48px,5svh,64px));
}
@media(max-width:700px) { .pg-games-scroll { --pg-games-top:112px; } }
.pg-games-scroll > .pg-games-section { position:relative; top:auto; }

/* The first desktop games composition fits below the header. */
@media (min-width:601px) {
  .pg-games-scroll > .pg-games-section {
    height:calc(100svh - var(--pg-games-top));
    display:flex; flex-direction:column;
    padding-top:clamp(20px,3svh,40px); padding-bottom:clamp(20px,3svh,40px);
  }
  .pg-games-scroll .pg-section-line { flex-shrink:0; }
  .pg-games-scroll .pg-home-games { flex:1; min-height:0; margin-top:clamp(20px,3svh,40px); }
  .pg-games-scroll .pg-game-card { height:100%; min-height:0; }
  .pg-games-scroll .pg-game-media { height:100%; min-height:0; aspect-ratio:auto; }
  .pg-games-scroll .pg-game-media-link { min-height:0; }
}
@media (prefers-reduced-motion:reduce) {
  .pg-games-scroll > .pg-games-section { height:auto; display:block; }
  .pg-games-scroll .pg-game-media { height:auto; aspect-ratio:760/520; }
}


/* Two panels close over the departing page, then open on the arriving page. */
html[data-pg-transition]::before,html[data-pg-transition]::after {
  content:""; position:fixed; left:0; width:100%; height:calc(50dvh + 1px);
  z-index:2147483000; background:var(--pg-red); pointer-events:all;
  transition:transform .5s cubic-bezier(.76,0,.24,1);
}
html[data-pg-transition]::before { top:0; transform:translateY(-101%); }
html[data-pg-transition]::after { bottom:0; transform:translateY(101%); }
html[data-pg-transition="cover"]::before,html[data-pg-transition="cover"]::after,
html[data-pg-transition="covered"]::before,html[data-pg-transition="covered"]::after { transform:translateY(0); }
html[data-pg-transition="covered"]::before,html[data-pg-transition="covered"]::after { transition:background-color .34s ease-in-out; }
html[data-pg-transition="reveal"]::before,html[data-pg-transition="reveal"]::after { transition-duration:.85s; }
@media (prefers-reduced-motion:reduce) {
  html[data-pg-transition]::before,html[data-pg-transition]::after { display:none; }
}


html[data-pg-transition][data-pg-curtain-tone="cream"]::before,
html[data-pg-transition][data-pg-curtain-tone="cream"]::after { background:var(--pg-cream); }
.pg-tomato-refresh { display:block; margin:12px auto 0; width:40px; height:40px; padding:0; border:1px solid currentColor; border-radius:50%; color:var(--pg-red); background:transparent; font-size:26px !important; line-height:1; transition:transform .4s cubic-bezier(.16,1,.3,1); }
.pg-tomato-refresh:hover:not(:disabled) { transform:rotate(90deg); }
.pg-tomato-refresh:disabled { cursor:wait; }
.pg-tomato-refresh:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
@media(prefers-reduced-motion:reduce) { .pg-tomato-refresh { transition:none; } }
.pg-tomato-refresh { position:relative; z-index:9; }

/* Mobile browser chrome must not move the cards or expose the page under the menu. */
@media(max-width:600px) {.pg-tomato-refresh { min-height:44px; min-width:44px; }
}

/* Scroll typography: composited motion, no opacity fades or scroll-time layout work. */
.pg-type-mask { display:inline-block; vertical-align:top; overflow:visible; padding:.22em .12em .3em; margin:-.22em -.12em -.3em; }
[data-type-reveal] .pg-type-mask:not([data-revealed]) { overflow:clip; }
.pg-type-word { display:inline-block; transform-origin:0% 100%; }
[data-type-reveal="waiting"] .pg-type-word { transform:translate3d(0,115%,0) rotate(3deg); }
[data-type-reveal="entering"] .pg-type-word { animation:pg-type-enter 1150ms cubic-bezier(.22,1,.36,1) var(--pg-type-delay,0ms) both; }
@keyframes pg-type-enter { from { transform:translate3d(0,115%,0) rotate(3deg); } to { transform:translate3d(0,0,0); } }
@media(prefers-reduced-motion:reduce) { .pg-type-word { animation:none!important; transform:none!important; } }


/* Descriptive copy enters by line, without rotation. */
p.pg-copy[data-type-reveal="waiting"] .pg-type-word { transform:translate3d(0,105%,0); }
p.pg-copy[data-type-reveal="entering"] .pg-type-word { animation-name:pg-copy-enter; animation-duration:850ms; }
@keyframes pg-copy-enter { from { transform:translate3d(0,105%,0); } to { transform:translate3d(0,0,0); } }

/* Footer unfolds with scroll; all links stay in the normal document flow. */
.pg-footer { overflow:clip; }
.pg-footer[data-motion="ready"] .pg-footer-top { translate:0 var(--footer-rise,0px); }
.pg-footer[data-motion="ready"] nav { translate:calc(-1 * var(--footer-side,0px)) 0; }
.pg-footer[data-motion="ready"] .pg-footer-socials { translate:var(--footer-side,0px) 0; }
@media(prefers-reduced-motion:reduce) {
 .pg-footer[data-motion="ready"] .pg-footer-top,.pg-footer[data-motion="ready"] nav,
 .pg-footer[data-motion="ready"] .pg-footer-socials { translate:none; }
}

/* The opening tomato passes in front of the games before uncovering them. */
body:has(.pg-home-content) .pg-hero-track { z-index:3; pointer-events:none; }

/* Rendered tomato sequence: scroll controls the supplied film in both directions. */
.pg-studio-story { display:block; min-height:240svh; }
.pg-studio-story-stage { position:sticky; top:100px; display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; }
.pg-studio-sequence { max-height:calc(100svh - 140px); }
.pg-studio-sequence img,.pg-studio-sequence canvas { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; visibility:visible; }
@media(max-width:600px) {
 .pg-studio-story { min-height:0; }
 .pg-studio-story-stage { position:relative; top:auto; grid-template-columns:1fr; gap:30px; }
}
@media(prefers-reduced-motion:reduce) {
 .pg-studio-story { min-height:0; }
 .pg-studio-story-stage { position:relative; top:auto; }
}

/* A brief opening hold lets the animation advance before the page moves. */
.pg-hero-track { --pg-scroll-distance:0px; }
.pg-hero { position:relative !important; top:0; overflow:clip !important; }
@media(prefers-reduced-motion:no-preference) {
 /* The page starts moving at the supplied reference pose: frame 76 of 214. */
 .pg-hero-track { --pg-scroll-distance:calc(120svh * 76 / 214); }
 .pg-hero { position:sticky !important; }
}
.pg-hero-media { clip-path:inset(0 0 var(--pg-wordmark-gap,0px)); }

/* After the opening scene leaves, only the header contents enter from the sides. */
body:has(.pg-home-content) .pg-site-header {
  opacity:1; visibility:hidden !important; pointer-events:none !important;
  transform:none; overflow:clip;
  /* Hide immediately on return so an empty band never covers the wordmark. */
  transition:none;
}
body:has(.pg-home-content) .pg-site-brand,
body:has(.pg-home-content) .pg-top-nav {
  opacity:0; will-change:transform,opacity;
  transition:transform .32s cubic-bezier(.22,1,.36,1), opacity .16s ease-out;
}
body:has(.pg-home-content) .pg-site-brand { transform:translate3d(calc(-100% - 20px),0,0); }
body:has(.pg-home-content) .pg-top-nav { transform:translate3d(calc(100% + 20px),0,0); }
html[data-pg-header-ready="true"][data-pg-home-menu-visible="true"] body:has(.pg-home-content) .pg-site-header {
  visibility:visible !important; pointer-events:auto !important; transition-delay:0s;
}
html[data-pg-header-ready="true"][data-pg-home-menu-visible="true"] body:has(.pg-home-content) .pg-site-brand,
html[data-pg-header-ready="true"][data-pg-home-menu-visible="true"] body:has(.pg-home-content) .pg-top-nav {
  opacity:1; transform:translate3d(0,0,0);
}
@media(prefers-reduced-motion:reduce) {
  body:has(.pg-home-content) .pg-site-header,
  body:has(.pg-home-content) .pg-site-brand,
  body:has(.pg-home-content) .pg-top-nav { transition:none; }
}

/* Studio now follows the opening, with the same room for the arriving header. */
.pg-home-studio {
  padding-top:calc(73px + clamp(48px,5svh,64px));
  position:relative; background:var(--pg-cream);
}
.pg-home-team { border-top:1px solid #1116; }
.pg-home-team .pg-team { margin-top:28px; }
/* Let each portrait set the card height instead of reserving an empty 3:4 frame. */
.pg-home-team .pg-person-visual { aspect-ratio:auto; padding:0; }
.pg-home-team .pg-person-portrait { position:static; height:auto; }
.pg-home-content .pg-section,
.pg-content-root[data-page="home"] + .pg-footer { border-top:0; }
@media(max-width:700px) {
  .pg-home-studio { padding-top:calc(112px + clamp(48px,5svh,64px)); }
}
@media(max-width:600px) {
  .pg-home-team .pg-team { margin-top:24px; }
}

/* Each scene shares a stationary phone and fixed copy windows. */
.pg-games-carousel { min-width:0; overflow:hidden; position:relative; }
.pg-games-track { display:grid; width:100%; height:100%; min-width:0; align-items:stretch; }
.pg-game-slide { grid-area:1 / 1; min-width:0; min-height:0; visibility:hidden; pointer-events:none; }
.pg-game-slide[data-current="true"] { visibility:visible; pointer-events:auto; z-index:2; }
.pg-game-slide[data-leaving="true"] { visibility:visible; z-index:1; }
.pg-game-slide[data-peek="true"] { visibility:visible; z-index:1; }
.pg-game-slide:is([data-peek="true"],[data-leaving="true"]) :is(.pg-games-controls,.pg-game-stores) { visibility:hidden; }
.pg-games-controls { display:flex; align-items:center; gap:14px; flex-shrink:0; color:var(--pg-red); }
.pg-game-arrow {
  display:grid; place-items:center; width:48px; height:48px;
  padding:0; border:1px solid currentColor; border-radius:50%;
  color:var(--pg-red); background:transparent; font-size:25px !important; line-height:1;
  transition:background-color .15s,color .15s;
}
.pg-game-arrow:hover { color:var(--pg-cream); background:var(--pg-red); border-color:var(--pg-red); }
.pg-game-position { min-width:53px; text-align:center; font-size:13px; font-variant-numeric:tabular-nums; }
@media(max-width:600px) {
  .pg-game-arrow { width:44px; height:44px; }
  .pg-game-position { font-size:11px; }
}

/* Games share one carousel scene with official store links. */
.pg-games-scroll .pg-home-games { margin-top:0; }
.pg-game-caption .pg-games-controls { margin-top:6px; }
.pg-games-carousel :is(.pg-game-title-window,.pg-game-copy-window) { width:100%; overflow:visible; margin-block:-6px; }
.pg-game-text-viewport { width:100%; overflow:hidden; contain:paint; padding-block:6px; margin-block:-6px; }
.pg-game-text-motion { width:100%; display:flex; flex-direction:column; gap:25px; will-change:transform; }
@media(max-width:600px) { .pg-game-text-motion { gap:18px; } }
.pg-games-carousel .pg-game-title-window { height:calc(var(--pg-game-title-height,160px) + 12px); }
.pg-games-carousel .pg-game-copy-window { height:calc(var(--pg-game-copy-height,96px) + 12px); }
.pg-game-title-motion,.pg-game-copy-motion { width:100%; height:100%; padding-block:6px; }
.pg-game-title-motion { display:flex; flex-direction:column; justify-content:flex-end; }
.pg-game-title-motion .pg-game-name { flex:none; width:100%; }

.pg-game-stores { display:flex; align-items:center; gap:22px; color:var(--pg-red); }
.pg-store-icon { display:grid; place-items:center; width:44px; height:44px; }
.pg-store-icon svg { display:block; width:36px; height:36px; }

/* The device remains stationary while the film changes inside its screen. */
.pg-game-media:has(.pg-iphone) { overflow:visible; }
.pg-iphone {
  position:relative; flex:none; height:100%; width:auto; max-width:100%;
  aspect-ratio:500 / 1060; padding:0;
  --pg-iphone-bezel:clamp(6px,.6vw,9px);
  border:var(--pg-iphone-bezel) solid #161618; border-radius:14% / 6.6%;
  background:transparent;
  box-shadow:0 0 0 1.5px #85858a,0 0 0 2.5px #28282b,
             inset 0 0 0 1px #4a4a4e,0 18px 30px -18px #30271966;
}
.pg-iphone-screen { position:relative; width:100%; height:100%; overflow:hidden; border-radius:12% / 5.6%; touch-action:pan-y; user-select:none; cursor:grab; }
.pg-games-carousel[data-dragging="true"] .pg-iphone-screen { cursor:grabbing; }
.pg-game-media .pg-iphone-screen video { width:100%; height:100%; max-width:none; object-fit:cover; border-radius:0; will-change:transform; }
.pg-iphone-island {
  position:absolute; z-index:2; top:1.7%; left:50%; transform:translateX(-50%);
  width:27%; height:3.1%; border-radius:999px; background:#070708;
  box-shadow:inset 0 -1px 0 #ffffff15; pointer-events:none;
}
.pg-iphone-island::after {
  content:''; position:absolute; top:50%; right:9%; transform:translateY(-50%);
  width:8%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 40% 35%,#354c69,#111620 60%,#050609);
}
.pg-iphone-home {
  position:absolute; z-index:2; left:34%; bottom:1.1%; width:32%; height:.5%;
  min-height:2px; max-height:4px; border-radius:999px; background:#fff;
  opacity:.8; box-shadow:0 1px 2px #0005; pointer-events:none;
}
.pg-iphone-button { position:absolute; width:3px; border-radius:2px; background:linear-gradient(90deg,#303034,#96969b); pointer-events:none; }
.pg-iphone-button-action { left:calc(-1 * var(--pg-iphone-bezel) - 5px); top:16%; height:3%; }
.pg-iphone-button-volume-up { left:calc(-1 * var(--pg-iphone-bezel) - 5px); top:24%; height:6%; }
.pg-iphone-button-volume-down { left:calc(-1 * var(--pg-iphone-bezel) - 5px); top:32%; height:6%; }
.pg-iphone-button-power { right:calc(-1 * var(--pg-iphone-bezel) - 5px); top:26%; height:9%; }
@media(max-width:600px) {
  .pg-games-carousel .pg-game-media-link { padding:12px 18px; }
}

/* The studio film and four copy phases share one natural scroll sequence. */
.pg-home-studio-story {
  min-height:calc(100svh - var(--pg-header-height) + 240svh);
  padding:0 var(--pg-gutter); background:var(--pg-cream);
  overflow-anchor:none;
}
.pg-home-studio-stage {
  top:var(--pg-header-height); height:calc(100svh - var(--pg-header-height));
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:8vw; padding-block:24px;
}
.pg-home-studio-story .pg-studio-sequence { width:min(100%,calc(100svh - var(--pg-header-height) - 48px)); max-height:none; margin:auto; }
.pg-studio-phases { display:grid; min-width:0; }
.pg-studio-phase { grid-area:1 / 1; min-width:0; align-self:center; }
.pg-studio-phase[data-current="false"] { visibility:hidden; pointer-events:none; }
.pg-home-studio-story .pg-heading { color:var(--pg-red); }
@media(max-width:600px) {
  .pg-home-studio-stage {
    position:sticky; top:var(--pg-header-height);
    grid-template-columns:minmax(0,1fr); align-content:center; gap:20px; padding-block:20px;
  }
  .pg-home-studio-story .pg-studio-sequence { width:min(100%,calc((100svh - var(--pg-header-height)) * .44)); }
  .pg-studio-phase { gap:14px; }
  .pg-home-studio-story .pg-heading { font-size:clamp(30px,8.8vw,46px); }
}
@media(prefers-reduced-motion:reduce) {
  .pg-home-studio-story { min-height:0; }
  .pg-home-studio-stage { position:relative; top:auto; height:auto; padding-block:40px; align-items:start; }
  .pg-studio-phases { display:flex; flex-direction:column; gap:40px; }
  .pg-studio-phase { visibility:visible; }
}

/* A complete final screen keeps the game above the Join/footer view. */
.pg-home-content > .pg-join {
  min-height:calc(100svh - var(--pg-header-height) - var(--pg-footer-height,120px));
  display:flex; flex-direction:column; justify-content:center; color:var(--pg-red);
}
.pg-footer { color:var(--pg-red); border-top:0; }
.pg-footer-top { margin-bottom:0; }
.pg-footer nav { max-width:75%; }
.pg-footer-socials { flex-shrink:0; }
.pg-support-page { font-family:'DM Sans',sans-serif; font-weight:500; color:var(--pg-red); }
.pg-support-page .pg-section { border-top:0; border-bottom:0; }
.pg-support-page :is(input,textarea,select,button) { font-family:inherit; font-weight:500; letter-spacing:normal; color:inherit; border-bottom-color:currentColor; }
.pg-legal-page { color:var(--pg-red); padding-bottom:clamp(72px,8vw,140px); }
.pg-legal-page .pg-page-heading { border-bottom:0; display:block; padding-bottom:clamp(48px,5vw,80px); }
.pg-legal-page .pg-page-title { font-size:clamp(46px,7vw,112px); line-height:1; letter-spacing:-.045em; }
.pg-legal-updated { margin-top:28px !important; font-size:14px; line-height:1.5; }
.pg-legal-copy { max-width:76ch; margin:0 var(--pg-gutter); font-size:clamp(16px,1.3vw,19px); line-height:1.65; }
.pg-legal-copy p { margin:0 0 1.25em; }
.pg-legal-copy h2 { margin:2.25em 0 .8em; font:900 clamp(25px,2.4vw,36px)/1.2 'Filson Pro',sans-serif; letter-spacing:-.025em; scroll-margin-top:24px; }
.pg-legal-copy h3 { margin:1.5em 0 .7em; font-weight:700; font-size:1.15em; line-height:1.3; }
.pg-legal-copy ul,.pg-legal-copy ol { list-style:revert; padding-left:1.3em; margin:0 0 1.4em; }
.pg-legal-copy li { padding-left:.15em; margin:.4em 0; }
.pg-legal-copy a { text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
@media(max-width:700px) {
  .pg-footer-top { margin-bottom:0; }
  .pg-footer nav { max-width:100%; }
  .pg-footer-socials { flex-wrap:wrap; }
  .pg-legal-copy { max-width:none; }
}

/* Footer and header links share the same type treatment. */
@media(max-width:700px) {
  :root { --pg-nav-font:500 13px/1.1 'DM Sans',sans-serif; }
}

/* Career cards: the selected cream/red layout for confirmed openings. */
.pg-careers-page { --pg-career-ink:var(--pg-red); --pg-career-muted:var(--pg-red); --pg-career-paper:#faf6ee; color:var(--pg-career-ink); font-weight:500; letter-spacing:-.02em; }
.pg-careers-page .pg-page-heading { display:block; border:0; max-width:1120px; margin-inline:auto; padding:clamp(44px,5vw,80px) var(--pg-gutter) 32px; }
.pg-careers-page .pg-page-title { font-size:clamp(40px,4.5vw,72px); line-height:1.04; max-width:20ch; margin:18px 0 0; color:var(--pg-red); }
.pg-careers-page .pg-eyebrow { color:var(--pg-red); font-size:12px; letter-spacing:.09em; }
.pg-career-copy { font-size:16px; line-height:1.5; max-width:43ch; }
.pg-careers-cards-page .pg-page-heading { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(200px,.8fr); align-items:center; gap:48px; }
.pg-careers-cards-page .pg-page-heading > .pg-career-copy { color:var(--pg-career-muted); max-width:27ch; }
.pg-careers-page .pg-job-section { display:block; max-width:1120px; margin:auto; padding:28px var(--pg-gutter) 64px; }
.pg-job-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; list-style:none; padding:0; margin:0; }
.pg-job-card-item { display:flex; min-width:0; }
.pg-job-card { display:flex; flex-direction:column; align-items:start; gap:22px; width:100%; background:var(--pg-career-paper); border-radius:8px; padding:28px 24px; min-height:260px; }
.pg-job-card-title { font:900 clamp(25px,2.3vw,34px)/1.12 'Filson Pro',sans-serif; color:var(--pg-red); letter-spacing:-.025em; }
.pg-job-meta { font-size:14px; line-height:1.5; color:var(--pg-career-muted); }
.pg-careers-page .pg-career-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:48px; padding:12px 20px; border:1px solid var(--pg-red); border-radius:5px; background:var(--pg-red); color:var(--pg-career-paper); font:500 16px/1.4 'DM Sans',sans-serif; text-align:center; text-decoration:none; }
.pg-careers-page .pg-career-button:hover { filter:brightness(.92); }
.pg-careers-page .pg-career-button-outline { background:transparent; color:var(--pg-red); }
.pg-job-card .pg-career-button { width:100%; margin-top:auto; }
.pg-careers-page :is(a,button,summary,input,textarea,select):focus-visible { outline:2px solid var(--pg-red); outline-offset:5px; }

/* Job details use the same readable hierarchy and bounded form fields. */
.pg-job-back { color:var(--pg-red)!important; margin-bottom:30px; }
.pg-job-page .pg-page-title { margin-top:0; }
.pg-job-page .pg-page-heading .pg-job-meta { margin-top:24px; font-size:16px; }
.pg-job-detail { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:start; max-width:1120px; margin:auto; padding:32px var(--pg-gutter) 48px; }
.pg-job-copy-group { display:flex; flex-direction:column; gap:20px; }
.pg-job-subheading { font:900 clamp(26px,2.4vw,34px)/1.15 'Filson Pro',sans-serif; color:var(--pg-red); letter-spacing:-.025em; }
.pg-job-bullets { padding-left:20px; margin:0; list-style:disc; display:grid; gap:16px; font-size:16px; line-height:1.5; }
.pg-job-bullets li::marker { color:var(--pg-red); }
.pg-job-page .pg-application { display:grid; grid-template-columns:1fr; gap:30px; border:0; max-width:760px; margin:auto; padding:32px var(--pg-gutter) 64px; }
.pg-career-application-intro { display:flex; flex-direction:column; gap:18px; }
@media(min-width:701px) and (max-width:899px) { .pg-job-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) {
 .pg-careers-cards-page .pg-page-heading { grid-template-columns:1fr; gap:24px; }
 .pg-careers-page .pg-page-title { font-size:clamp(38px,9vw,56px); }
 .pg-job-cards { grid-template-columns:1fr; gap:18px; }
 .pg-job-card { min-height:0; gap:20px; padding:26px; }
 .pg-job-card-title { font-size:30px; }
 .pg-job-card .pg-career-button { margin-top:6px; }
 .pg-job-detail { grid-template-columns:1fr; gap:40px; }
}




/* Transparent frames reveal the page; keep the poster only until the first paint. */
.pg-studio-sequence[data-frame] img { opacity:0; }

/* Confirmed culture copy: readable subheads, then the full pillar text. */
.pg-home-studio-story .pg-studio-copy { gap:24px; }
.pg-home-studio-story .pg-culture-lead { font-weight:700; }
@media(max-width:600px) {
 .pg-home-studio-stage { gap:16px; padding-block:16px; }
 .pg-home-studio-story .pg-studio-sequence { width:min(100%,calc((100svh - var(--pg-header-height)) * .28)); }
 .pg-home-studio-story .pg-studio-copy { gap:12px; }
 .pg-home-studio-story .pg-copy { font-size:clamp(16px,2svh,18px); line-height:1.4; }
 .pg-home-studio-story .pg-eyebrow { font-size:12px; }
}

.pg-home-studio-story .pg-culture-body strong { font-weight:700; }


/* Supplied transparent 4:3 film and character morphs at material junctions. */
.pg-studio-sequence { aspect-ratio:4 / 3; }
.pg-home-studio-story .pg-studio-sequence { width:min(100%,calc((100svh - var(--pg-header-height) - 48px) * 4 / 3)); }
.pg-studio-phase[data-leaving="true"] { visibility:visible; pointer-events:none; }
.pg-morph-char { display:inline-block; transform-origin:50% 50%; }
.pg-studio-morph-title .pg-type-mask { overflow:visible; }
@media(max-width:600px) {
 .pg-home-studio-story .pg-studio-sequence { width:min(100%,calc((100svh - var(--pg-header-height)) * .28 * 4 / 3)); }
}
@media(prefers-reduced-motion:reduce) {
 .pg-morph-char { transform:none!important; filter:none!important; opacity:1!important; }
}


/* Full game copy travels as one panel, with an intrinsic body for sizing. */
.pg-game-copy-body { display:flex; flex-direction:column; align-items:start; gap:14px; }
.pg-game-caption .pg-game-tagline { max-width:38ch; font-size:clamp(16px,1.4vw,20px); font-weight:700; line-height:1.45; }
.pg-game-caption .pg-game-description { max-width:38ch; font-size:clamp(16px,1.3vw,18px); line-height:1.5; }
/* Fill the stationary phone screen with portrait video, preserving proportions. */
.pg-iphone-screen { background:transparent; }
.pg-game-media .pg-iphone-screen video { background:#08080a; }
.pg-game-media .pg-iphone-screen video { object-fit:cover; object-position:center; }
@media(min-width:601px) {
 .pg-games-scroll > .pg-games-section { height:auto; min-height:calc(100svh - var(--pg-games-top)); }
 .pg-games-scroll .pg-game-card { height:auto; }
 .pg-games-scroll .pg-game-media { height:clamp(360px,calc(100svh - var(--pg-games-top) - clamp(40px,6svh,80px)),860px); }
}
@media(max-width:600px) {
 .pg-game-copy-body { gap:12px; }
 .pg-game-caption :is(.pg-game-tagline,.pg-game-description) { max-width:none; }
}


/* The confirmed role uses the complete job description and a real email link. */
.pg-job-cards-single { grid-template-columns:1fr; }
.pg-job-cards-single .pg-job-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 32px; min-height:0; align-items:center; }
.pg-job-cards-single .pg-job-card > :not(a) { grid-column:1; }
.pg-job-cards-single .pg-career-button { grid-column:2; grid-row:1 / span 3; width:auto; margin:0; min-width:148px; }
.pg-job-apply { margin-top:28px; }
.pg-confirmed-job-detail { display:flex; flex-direction:column; gap:44px; max-width:860px; padding:28px var(--pg-gutter) 48px; }
.pg-confirmed-job-detail .pg-job-copy-group { width:100%; padding:0; gap:20px; }
.pg-confirmed-job-detail .pg-career-copy,.pg-job-page .pg-career-application-intro .pg-career-copy { max-width:none; line-height:1.65; }
.pg-job-duty-group { display:flex; flex-direction:column; gap:16px; }
.pg-job-duty-heading { font:700 20px/1.3 'DM Sans',sans-serif; color:var(--pg-career-ink); }
.pg-job-duty-group + .pg-job-duty-group { margin-top:8px; }
.pg-job-page .pg-application { max-width:860px; align-items:start; }
.pg-job-page .pg-application > .pg-career-button { justify-self:start; }
.pg-job-email-link { color:var(--pg-red)!important; text-decoration:underline!important; text-underline-offset:3px; overflow-wrap:anywhere; }
@media(max-width:700px) {
 .pg-job-cards-single .pg-job-card { display:flex; align-items:start; gap:18px; }
 .pg-job-cards-single .pg-career-button { width:100%; margin-top:6px; }
 .pg-confirmed-job-detail { gap:36px; padding-top:20px; }
 .pg-job-duty-heading { font-size:18px; }
}

/* Keep the physical volume keys, with a comfortable transparent click area. */
button.pg-iphone-button {
  width:40px; padding:0; border:0; background:transparent;
  transform:translateX(-18px); pointer-events:auto; cursor:pointer; z-index:4;
}
button.pg-iphone-button::before { content:''; position:absolute; inset:-3px 0; }
button.pg-iphone-button-action::before { inset:-8px 0; }
button.pg-iphone-button::after {
  content:''; position:absolute; left:18px; top:0; bottom:0; width:3px;
  border-radius:2px; background:linear-gradient(90deg,#303034,#96969b);
}
button.pg-iphone-button:hover::after,
button.pg-iphone-button[data-pg-game-audio="toggle"][aria-pressed="true"]::after { background:var(--pg-red); }
button.pg-iphone-button:focus-visible { outline:2px solid var(--pg-red); outline-offset:3px; border-radius:5px; }
a.pg-store-icon { color:inherit; text-decoration:none; transition:transform 160ms ease; }
a.pg-store-icon:hover { transform:translateY(-2px); }
a.pg-store-icon:focus-visible { outline:2px solid currentColor; outline-offset:3px; border-radius:6px; }

/* Support V2 keeps the site's cream/red styling and clear keyboard focus. */
.pg-field select { font-family:inherit; appearance:auto; }
.pg-field select option { color:var(--pg-red); background:var(--pg-cream); }
.pg-support-honeypot { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.pg-support-challenge,.pg-support-privacy { grid-column:1/-1; }
.pg-support-privacy { font-size:12px; line-height:1.65; }
.pg-support-privacy a { text-decoration:underline; text-underline-offset:3px; }
.pg-submit:disabled { opacity:.55; cursor:wait; }
.pg-form-status:focus { outline:2px solid currentColor; outline-offset:6px; }
.pg-legal-support { padding-top:0; }
/* Selected clear list: the catalogue can grow without stacking large cards. */
.pg-careers-list-page .pg-page-heading > .pg-career-copy { margin-top:24px; max-width:none; color:var(--pg-career-muted); }
.pg-job-list { list-style:none; margin:28px 0 0; padding:0; border-top:1px solid #bb040440; }
.pg-job-row { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:28px 0; border-bottom:1px solid #bb040440; }
.pg-job-row-copy { display:flex; flex-direction:column; gap:12px; min-width:0; }
.pg-job-row .pg-job-card-title { font-size:clamp(24px,2.3vw,34px); }
.pg-job-row-link { flex-shrink:0; color:var(--pg-red); }
.pg-careers-all { display:inline-block; margin-top:32px; color:var(--pg-red); }
@media(max-width:600px) { .pg-job-row { align-items:start; flex-direction:column; gap:20px; } }

/* Document footers keep compact spacing; the page frame places them at the bottom. */
.pg-footer[data-footer-layout="document"] { padding-block:24px; }
.pg-footer[data-footer-layout="document"] .pg-footer-top,
.pg-footer[data-footer-layout="document"] nav,
.pg-footer[data-footer-layout="document"] .pg-footer-socials { translate:none; }
.pg-careers-list-page .pg-job-section { padding-bottom:32px; }
@media(max-width:700px) {
  .pg-footer { padding-block:20px; }
  .pg-footer-top { flex-direction:column; gap:8px; }
  .pg-footer nav { display:flex; flex-wrap:wrap; gap:0 22px; max-width:100%; }
  .pg-footer .pg-text-link { display:inline-flex; align-items:center; min-height:44px; padding:8px 0; font-size:13px; line-height:1.25; }
  .pg-footer[data-motion="ready"] .pg-footer-top,
  .pg-footer[data-motion="ready"] nav,
  .pg-footer[data-motion="ready"] .pg-footer-socials { translate:none; }
  .pg-careers-list-page .pg-page-heading { padding-top:32px; padding-bottom:24px; }
  .pg-careers-list-page .pg-job-section { padding-top:20px; padding-bottom:20px; }
}

/* Readable game copy shares the mobile screen with a proportionate phone. */
.pg-games-carousel .pg-iphone { height:var(--pg-game-device-height,100%); max-width:none; }
@media(max-width:700px) {
  .pg-games-scroll > .pg-games-section {
    height:auto; min-height:calc(100svh - var(--pg-header-height));
    display:block; padding-block:16px;
  }
  .pg-games-scroll .pg-game-card { grid-template-columns:minmax(0,1fr); height:auto; gap:12px; align-items:start; }
  .pg-games-scroll .pg-game-media { height:var(--pg-game-phone-height,clamp(140px,30svh,320px)); aspect-ratio:auto; }
  .pg-games-carousel .pg-game-media-link { padding:10px 24px; }
  .pg-games-carousel .pg-game-caption { gap:12px; }
  .pg-games-carousel .pg-game-text-motion { gap:12px; }
  .pg-games-carousel .pg-game-name { font-size:clamp(28px,7.6vw,40px); line-height:1.02; }
  .pg-games-carousel .pg-game-copy-body { gap:10px; }
  .pg-games-carousel .pg-game-tagline { font-size:16px; line-height:1.35; }
  .pg-games-carousel .pg-game-description { font-size:16px; line-height:1.4; }
  .pg-games-carousel .pg-game-caption :is(.pg-game-tagline,.pg-game-description) { max-width:none; }
  .pg-games-carousel .pg-game-stores { gap:16px; }
  .pg-games-carousel .pg-game-arrow { width:44px; height:44px; }
  .pg-games-carousel .pg-game-caption .pg-games-controls { margin-top:0; gap:10px; }
}
@media(min-width:360px) and (max-width:700px) {
  .pg-games-carousel .pg-game-caption { display:grid; grid-template-columns:auto auto; justify-content:space-between; align-items:center; }
  .pg-games-carousel .pg-game-text-viewport { grid-column:1/-1; }
}
@media(min-width:701px) and (max-height:600px) {
  .pg-games-scroll > .pg-games-section { padding-block:16px; }
  .pg-games-scroll .pg-game-card { grid-template-columns:clamp(140px,20vw,230px) minmax(0,1fr); gap:clamp(18px,3vw,32px); }
  .pg-games-scroll .pg-game-media { height:clamp(160px,calc(100svh - var(--pg-header-height) - 32px),460px); }
  .pg-games-carousel .pg-game-caption { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; min-width:0; gap:12px; }
  .pg-games-carousel .pg-game-text-viewport { grid-column:1/-1; }
  .pg-games-carousel .pg-game-text-motion { gap:12px; }
  .pg-games-carousel .pg-game-name { font-size:clamp(32px,4vw,40px); line-height:1.02; }
  .pg-games-carousel .pg-game-copy-body { gap:10px; }
  .pg-games-carousel .pg-game-caption :is(.pg-game-tagline,.pg-game-description) { max-width:none; font-size:16px; line-height:1.4; }
  .pg-games-carousel .pg-game-stores { gap:16px; }
  .pg-games-carousel .pg-game-arrow { width:44px; height:44px; }
  .pg-games-carousel .pg-game-caption .pg-games-controls { margin-top:0; gap:10px; }
}

/* Small editorial labels use the same reading face and weight as navigation. */
.pg-join .pg-eyebrow,
.pg-careers-page .pg-eyebrow,
.pg-support-page .pg-eyebrow { font:var(--pg-nav-font); letter-spacing:normal; }
.pg-careers-page .pg-text-link { font-family:'DM Sans',sans-serif; font-weight:500; }
.pg-support-page .pg-field > label { font-weight:500; }

/* Footer links follow the header: underline only while hovered. */
.pg-footer a { text-decoration:none; }
.pg-footer a:hover { text-decoration:underline; text-underline-offset:6px; }

/* Native fields remain enabled and validatable; only the hydrated presentation changes. */
.pg-field select.pg-support-select-native { position:absolute; width:1px; height:1px; min-height:0; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; pointer-events:none; }
.pg-select { min-width:0; width:100%; }
.pg-v1 .pg-select-trigger { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; min-height:48px; margin:0; padding:12px 0; border:0; border-bottom:1px solid currentColor; border-radius:0; color:var(--pg-red); background:transparent; font:500 18px/1.35 'DM Sans',sans-serif; letter-spacing:normal; text-align:left; cursor:pointer; touch-action:manipulation; }
.pg-select-value { min-width:0; overflow-wrap:anywhere; }
.pg-select-arrow { flex:none; width:9px; height:9px; margin:0 5px 4px 3px; border-right:1.7px solid currentColor; border-bottom:1.7px solid currentColor; transform:rotate(45deg); transition:transform .15s ease; }
.pg-select-trigger[aria-expanded="true"] .pg-select-arrow { transform:translateY(4px) rotate(225deg); }
.pg-select-trigger:focus-visible { outline:2px solid var(--pg-red); outline-offset:5px; }
.pg-select-trigger:disabled { opacity:.5; cursor:not-allowed; }
.pg-select-trigger[aria-invalid="true"] { border-bottom-width:2px; }
.pg-select-error { display:block; margin-top:10px; color:var(--pg-red); font:500 13px/1.4 'DM Sans',sans-serif; }
.pg-select-error[hidden],.pg-select-menu[hidden] { display:none; }
.pg-select-menu { position:fixed; z-index:120; box-sizing:border-box; margin:0; padding:6px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--pg-red) var(--pg-cream); border:1px solid var(--pg-red); border-radius:4px; background:var(--pg-cream); color:var(--pg-red); box-shadow:0 10px 28px #5b140414; font:500 16px/1.35 'DM Sans',sans-serif; letter-spacing:normal; text-align:left; touch-action:pan-y; }
.pg-select-option { position:relative; box-sizing:border-box; min-height:44px; padding:12px 34px 12px 12px; border-radius:2px; overflow-wrap:anywhere; cursor:pointer; }
.pg-select-option[aria-selected="true"]::after { position:absolute; right:13px; top:19px; width:8px; height:8px; border-radius:50%; background:currentColor; content:''; }
.pg-select-option[data-active="true"] { color:var(--pg-cream); background:var(--pg-red); }
@media (prefers-reduced-motion:reduce) { .pg-select-arrow { transition:none; } }
@media (forced-colors:active) { .pg-select-menu { border-color:ButtonText; } .pg-select-option[data-active="true"] { color:HighlightText; background:Highlight; forced-color-adjust:none; } }
.pg-select-trigger,.pg-select-option { -webkit-tap-highlight-color:transparent; }


/* A fixed, styled mannequin. Only the supplied tee mask is interactive. */
.pg-merch-section {
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  align-items:center; gap:clamp(24px,3vw,48px);
  min-height:calc(100svh - var(--pg-header-height));
  padding-block:40px; color:var(--pg-red);
  border-top:1px solid #bb040440;
}
.pg-merch-copy { display:flex; flex-direction:column; align-items:flex-start; min-width:0; transition:opacity .18s ease; }
.pg-merch-section[data-merch-active="true"] .pg-merch-copy { opacity:0; pointer-events:none; }
.pg-merch-copy .pg-eyebrow { font:var(--pg-nav-font); letter-spacing:normal; margin-bottom:40px; }
.pg-merch-copy .pg-merch-title { font-size:clamp(48px,4.6vw,74px); line-height:1.02; letter-spacing:-.045em; }
.pg-merch-intro { margin-top:28px !important; font:500 clamp(16px,1.3vw,20px)/1.4 'DM Sans',sans-serif; }
.pg-merch-product { margin-top:clamp(32px,4vw,64px); }
.pg-merch-copy .pg-merch-toggle {
  display:inline-flex; align-items:center; gap:14px; min-height:44px;
  padding:8px 0; border:0; border-radius:0; background:none; color:inherit;
  font:500 20px/1.3 'DM Sans',sans-serif; touch-action:manipulation;
}
.pg-merch-toggle:hover,.pg-merch-toggle[aria-pressed="true"] { text-decoration:underline; text-underline-offset:6px; }
.pg-merch-toggle span { transition:transform .2s ease; }
.pg-merch-toggle[aria-pressed="true"] span { transform:rotate(45deg); }
.pg-merch-hint { margin-top:6px !important; max-width:30ch; font:500 14px/1.45 'DM Sans',sans-serif; }
.pg-merch-touch-hint { display:none; }
.pg-merch-look { min-width:0; width:100%; display:flex; flex-direction:column; align-items:center;
  --pg-merch-figure-width:min(100%,490px,calc(max(440px,100svh - var(--pg-header-height) - 135px) * .670886));
}
.pg-merch-figure {
  position:relative; width:var(--pg-merch-figure-width); aspect-ratio:3392/5056;
  flex:none; -webkit-tap-highlight-color:transparent; touch-action:pan-y pinch-zoom;
}
/* Original pearl treatment, clipped to Olivia's supplied garment mask. */
.pg-v1 .pg-merch-avatar { width:100%; height:auto; user-select:none; transition:opacity .3s ease; }
.pg-merch-focus,.pg-merch-tee {
  position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .24s ease;
  -webkit-mask:url('/assets/pomodoro/merch/olivia-tee-mask.webp') center/100% 100% no-repeat;
  mask:url('/assets/pomodoro/merch/olivia-tee-mask.webp') center/100% 100% no-repeat;
}
.pg-v1 .pg-merch-focus-image { width:100%; height:100%; user-select:none; }
.pg-merch-section[data-merch-hover="true"] .pg-merch-avatar { opacity:.5; }
.pg-merch-section[data-merch-hover="true"] .pg-merch-focus { opacity:1; }
.pg-merch-tee::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(118deg,transparent 18%,#f8acd37a 32%,#ffe4a87a 43%,#fff1e39e 49%,#cfc0fba3 57%,#b9e8e985 67%,#fad2e671 78%,transparent 92%);
  background-size:190% 120%; background-position:85% 45%;
  animation:pg-merch-pearl-drift 5s ease-in-out infinite alternate; animation-play-state:paused;
}
.pg-merch-tee::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 22% 15% at var(--pg-pearl-x,52%) var(--pg-pearl-y,40%),#fff7 0%,#fff3 35%,#ffe6f02b 60%,transparent 100%);
  mix-blend-mode:screen;
}
.pg-v1 .pg-merch-mask { position:absolute; inset:0; width:100%; height:100%; opacity:0; pointer-events:none; }
.pg-merch-section[data-merch-hover="true"] .pg-merch-tee { opacity:.38; }
.pg-merch-section[data-merch-hover="true"] .pg-merch-tee::before { animation-play-state:running; }
@keyframes pg-merch-pearl-drift { from { background-position:85% 45%; } to { background-position:15% 55%; } }
.pg-merch-caption {
  display:flex; justify-content:space-between; gap:24px; width:var(--pg-merch-figure-width);
  margin-top:20px; padding-top:16px; border-top:1px solid #bb040440;
  font:500 14px/1.35 'DM Sans',sans-serif;
}
@media (max-width:1199px) and (min-width:701px) {
  .pg-merch-section { grid-template-columns:minmax(0,.45fr) minmax(0,.55fr); }
  .pg-merch-look { align-items:center; }
  .pg-merch-copy .pg-merch-title { font-size:clamp(44px,5.6vw,64px); }
  .pg-merch-caption { font-size:12px; gap:12px; }
}
@media (max-width:700px) {
  .pg-merch-section { grid-template-columns:minmax(0,1fr); gap:32px; padding-block:40px; }
  .pg-merch-copy .pg-eyebrow { margin-bottom:28px; }
  .pg-merch-copy .pg-merch-title { font-size:clamp(44px,11vw,72px); }
  .pg-merch-intro { margin-top:20px !important; }
  .pg-merch-product { margin-top:20px; }
  .pg-merch-copy .pg-merch-toggle { font-size:18px; }
  .pg-merch-look { align-items:center; --pg-merch-figure-width:min(100%,335px); }
  .pg-merch-caption { width:min(100%,335px); font-size:13px; gap:16px; }
}
@media (hover:none), (pointer:coarse) {
  .pg-merch-mouse-hint { display:none; }
  .pg-merch-touch-hint { display:inline; }
}
@media (prefers-reduced-motion:reduce) {
  .pg-v1 .pg-merch-avatar,.pg-merch-focus,.pg-merch-tee,.pg-merch-toggle span,.pg-merch-copy { transition:none; }
}

.pg-merch-section[data-merch-hover="true"] .pg-merch-figure { cursor:pointer; }


/* The final tee preview: black outline and the original three comic accents. */
.pg-merch-popup {
  position:fixed; inset:auto; z-index:140; margin:0; padding:0; border:0;
  --pg-merch-art-size:min(40vw,800px,calc(var(--pg-merch-viewport-height,100dvh) - 140px));
  width:calc(var(--pg-merch-art-size) + 212px); max-width:none;
  max-height:calc(100dvh - 24px); overflow:visible;
  color:var(--pg-red); background:transparent; font-family:'DM Sans',sans-serif;
  --pg-merch-product-turn:-7deg;
}
.pg-merch-popup[hidden] { display:none; }
.pg-merch-popup::backdrop { background:transparent; pointer-events:none; }
.pg-merch-popup-surface {
  position:relative; display:grid; grid-template-columns:var(--pg-merch-art-size) minmax(0,170px);
  align-items:start; gap:18px; width:100%; padding:12px;
}
.pg-merch-ink-filter { position:absolute; pointer-events:none; }
.pg-merch-popup-art { position:relative; width:100%; aspect-ratio:1; }
.pg-v1 .pg-merch-popup-accents { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; display:none; }
.pg-merch-popup[data-merch-variant="0"] [data-merch-accents="0"],
.pg-merch-popup[data-merch-variant="1"] [data-merch-accents="1"],
.pg-merch-popup[data-merch-variant="2"] [data-merch-accents="2"] { display:block; }
.pg-merch-popup[data-merch-variant="1"] { --pg-merch-product-turn:5deg; }
.pg-merch-popup[data-merch-variant="2"] { --pg-merch-product-turn:-3deg; }
.pg-v1 .pg-merch-popup-product {
  position:absolute; left:15.278%; top:22.077%; width:69.444%; height:55.846%;
  object-fit:contain; transform:rotate(var(--pg-merch-product-turn)); user-select:none; pointer-events:none;
  filter:url(#pg-merch-packshot-ink) drop-shadow(2px 3px 0 #17131130);
}
.pg-merch-popup-caption { margin-top:calc(var(--pg-merch-art-size) * .57); padding:0; }
.pg-v1 .pg-merch-popup-title {
  margin:0; padding:0; border:0; background:transparent; color:var(--pg-red);
  font:600 16px/1.4 'DM Sans',sans-serif;
}
.pg-merch-popup-details { list-style:none; margin:8px 0 0; padding:0; color:var(--pg-red); font:500 14px/1.55 'DM Sans',sans-serif; }
.pg-v1 .pg-merch-popup-availability { margin:16px 0 0; color:var(--pg-red); font:600 14px/1.55 'DM Sans',sans-serif; }
.pg-v1 .pg-merch-close {
  position:absolute; right:0; top:calc(var(--pg-merch-art-size) * .57 - 54px); display:grid; place-items:center; width:44px; height:44px;
  padding:0; border:0; border-radius:50%; color:var(--pg-red);
  background:transparent; font:500 28px/1 'DM Sans',sans-serif; cursor:pointer; touch-action:manipulation;
}
.pg-merch-close:hover { color:var(--pg-cream); background:var(--pg-red); }
.pg-merch-close:focus-visible { outline:2px solid var(--pg-red); outline-offset:4px; }
.pg-merch-popup:not([hidden]) .pg-merch-popup-surface { animation:pg-merch-popup-enter .36s cubic-bezier(.4,1.6,.5,1) both; }
.pg-merch-popup:not([hidden]) .pg-merch-popup-accents { animation:pg-merch-popup-opacity .2s .08s linear both; }
.pg-merch-popup:not([hidden]) .pg-merch-popup-caption { animation:pg-merch-popup-content .24s .1s ease-out both; }
@keyframes pg-merch-popup-enter { from { opacity:0; transform:scale(0); } to { opacity:1; transform:scale(1); } }
@keyframes pg-merch-popup-opacity { from { opacity:0; } to { opacity:1; } }
@keyframes pg-merch-popup-content { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"]) {
  width:min(520px,calc(var(--pg-merch-viewport-width,100vw) - 24px),max(180px,calc(var(--pg-merch-viewport-height,100dvh) - 180px)));
  overflow:auto;
}
.pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"])::backdrop { background:rgb(240 232 220 / .92); backdrop-filter:blur(5px); }
.pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"]) .pg-merch-popup-surface { grid-template-columns:minmax(0,1fr); gap:0; }
.pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"]) .pg-merch-popup-caption { margin-top:0; text-align:center; padding:0 6px 12px; }
.pg-v1 .pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"]) .pg-merch-close { top:0; }
/* The compact entrance stays within its final bounds so its scrollable
   container never grows temporary horizontal or vertical scrollbars. */
.pg-merch-popup:is([data-merch-layout="compact"],[data-merch-layout="landscape"]):not([hidden]) .pg-merch-popup-surface { animation-timing-function:cubic-bezier(.2,.8,.2,1); }
/* Keep the whole product and its close control visible in a short landscape. */
.pg-merch-popup[data-merch-layout="landscape"] { width:min(520px,calc(var(--pg-merch-viewport-width,100vw) - 24px)); }
.pg-merch-popup[data-merch-layout="landscape"] .pg-merch-popup-surface { grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); align-items:center; gap:16px; }
.pg-merch-popup[data-merch-layout="landscape"] .pg-merch-popup-art { max-width:calc(var(--pg-merch-viewport-height,100dvh) - 48px); justify-self:center; }
.pg-merch-popup[data-merch-layout="landscape"] .pg-merch-popup-caption { margin-top:0; text-align:left; padding:12px 0; }
@media (prefers-reduced-motion:reduce) {
  .pg-merch-tee { transition:none; }
  .pg-merch-tee::before { animation:none; background-position:50% 50%; }
  .pg-merch-popup:not([hidden]) .pg-merch-popup-surface,
  .pg-merch-popup:not([hidden]) .pg-merch-popup-accents,
  .pg-merch-popup:not([hidden]) .pg-merch-popup-caption { animation:none; }
}
