@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500&family=Noto+Serif+SC:wght@300;400;500&display=swap');

/* V3 — quieter editorial hierarchy and interaction-led disclosure. */
:root{
  --psq-display:'Cormorant Garamond','Noto Serif SC','Songti SC',serif;
  --psq-body:'Manrope','Noto Sans SC','PingFang SC',sans-serif;
  --psq-meta:'DM Mono','SFMono-Regular',monospace;
  --psq-ease:cubic-bezier(.22,1,.36,1);
  --psq-hairline:rgba(236,238,239,.14);
}

body{
  font-family:var(--psq-body);
  font-weight:300;
  letter-spacing:-.012em;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.serif,.pname,.name,.headline,.scene-title,.pull-quote{
  font-family:var(--psq-display);
  font-weight:300;
  letter-spacing:-.022em;
}

h1{
  font-weight:300!important;
  line-height:.98;
  letter-spacing:-.028em!important;
}

h1 em,h2 em,.headline em{
  font-weight:300;
  font-style:italic;
}

.mono,.eyebrow,.tag,.idx,.num,.roman,.numeral,.beat-label,.chapter-num,
.navback,.nav-links,.pmeta,.label,.hint,.cta,.enter,.buy,.price{
  font-family:var(--psq-meta);
  letter-spacing:.14em;
}

p,.desc,.hook,.pline,.tagline,.oneliner,.scene-copy{
  font-weight:300;
  letter-spacing:.005em;
}

nav,.topnav{
  border-color:transparent;
}

a,button,.panel,.door-card,.piece,.frame{
  -webkit-tap-highlight-color:transparent;
}

:focus-visible{
  outline:1px solid var(--gilt-soft,#ddbf85);
  outline-offset:5px;
}

/* Desktop: keep identity visible; let explanation arrive through intent. */
@media (hover:hover) and (pointer:fine){
  .panel .pline,
  .panel .plink,
  .door-card .tagline,
  .door-card .enter,
  .frame .caption,
  .frame .frame-link,
  .piece .desc,
  .piece .pname,
  .piece .pname2,
  .piece .pmeta,
  .piece .buy,
  .piece .price,
  .card .info,
  .chapter-media .caption,
  .scene .scene-line,
  .scene .scene-scroll{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .42s var(--psq-ease),transform .58s var(--psq-ease);
  }

  .panel:hover .pline,.panel:focus-visible .pline,.panel:focus-within .pline,
  .panel:hover .plink,.panel:focus-visible .plink,.panel:focus-within .plink,
  .door-card:hover .tagline,.door-card:focus-visible .tagline,.door-card:focus-within .tagline,
  .door-card:hover .enter,.door-card:focus-visible .enter,.door-card:focus-within .enter,
  .frame:hover .caption,.frame:focus-visible .caption,.frame:focus-within .caption,
  .frame:hover .frame-link,.frame:focus-visible .frame-link,.frame:focus-within .frame-link,
  .piece:hover .desc,.piece:focus-visible .desc,.piece:focus-within .desc,
  .piece:hover .pname,.piece:focus-visible .pname,.piece:focus-within .pname,
  .piece:hover .pname2,.piece:focus-visible .pname2,.piece:focus-within .pname2,
  .piece:hover .pmeta,.piece:focus-visible .pmeta,.piece:focus-within .pmeta,
  .piece:hover .buy,.piece:focus-visible .buy,.piece:focus-within .buy,
  .piece:hover .price,.piece:focus-visible .price,.piece:focus-within .price,
  .card:hover .info,.card:focus-visible .info,.card:focus-within .info,
  .chapter-media:hover .caption,.chapter-media:focus-within .caption,
  .scene:hover .scene-line,.scene:focus-within .scene-line,
  .scene:hover .scene-scroll,.scene:focus-within .scene-scroll{
    opacity:1;
    transform:translateY(0);
  }

  .panel .pname,.door-card .pname,.frame .pname{
    transition:transform .58s var(--psq-ease),color .35s ease;
  }
  .panel:hover .pname,.door-card:hover .pname,.frame:hover .pname{
    transform:translateY(-4px);
  }
}

/* Touch has no hover: selected and cinematic content remains legible. */
@media (hover:none), (pointer:coarse){
  .panel .pline,.panel .plink,.door-card .tagline,.door-card .enter,
  .frame .caption,.frame .frame-link,.piece .desc,.piece .pname,.piece .pname2,
  .piece .pmeta,.piece .buy,.piece .price,.card .info,
  .chapter-media .caption,.scene .scene-line,.scene .scene-scroll{
    opacity:0;
    transform:translateY(8px);
    transition:opacity .35s var(--psq-ease),transform .48s var(--psq-ease);
  }

  .piece.psq-revealed .desc,.piece.psq-revealed .pname,.piece.psq-revealed .pname2,
  .piece.psq-revealed .pmeta,.piece.psq-revealed .buy,.piece.psq-revealed .price,
  .card.psq-revealed .info{
    opacity:1;
    transform:none;
  }
}

.psq-touch-hint{
  position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:180;
  transform:translate(-50%,8px);padding:7px 12px;border:1px solid rgba(236,238,239,.16);
  border-radius:999px;background:rgba(15,16,17,.66);backdrop-filter:blur(12px);
  color:rgba(236,238,239,.7);font-family:var(--psq-meta);font-size:.56rem;
  letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;opacity:0;
  transition:opacity .45s ease,transform .55s var(--psq-ease);pointer-events:none;
}
.psq-touch-hint.show{opacity:1;transform:translate(-50%,0);}

/* V5 — image-first product gallery. Hidden copy must not reserve layout space. */
.shelf{
  background:transparent!important;
  border:0!important;
  gap:clamp(12px,2vw,24px)!important;
}

.shelf .piece{
  position:relative;
  display:block!important;
  padding:0!important;
  overflow:hidden;
  background:transparent!important;
  border:0!important;
  transform:none!important;
  isolation:isolate;
}

.shelf .piece .frame,
.shelf .piece .pframe{
  margin:0!important;
  border-radius:0!important;
  width:100%;
}

.shelf .piece::after,
.grid .card[data-name]::after{
  content:'';
  position:absolute;
  inset:36% 0 0;
  z-index:1;
  background:linear-gradient(180deg,transparent,rgba(10,11,13,.78));
  opacity:0;
  pointer-events:none;
  transition:opacity .42s var(--psq-ease);
}

body.psq-event-index .grid{
  gap:clamp(12px,2vw,24px)!important;
  border:0!important;
}

body.psq-event-index .grid > .card{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:transparent!important;
  transform:none!important;
  isolation:isolate;
}

body.psq-event-index .grid > .card .frame{
  position:absolute;inset:0;
}

body.psq-event-index .grid > .card::after{
  content:'';position:absolute;inset:36% 0 0;z-index:1;
  background:linear-gradient(180deg,transparent,rgba(10,11,13,.8));
  opacity:0;pointer-events:none;
  transition:opacity .42s var(--psq-ease);
}

body.psq-event-index .grid > .card .label{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:18px!important;text-align:left!important;
  opacity:0;transform:translateY(8px);
  transition:opacity .35s var(--psq-ease),transform .48s var(--psq-ease);
}

body.psq-event-index .grid > .card .label .pname{
  color:var(--parchment,#eceeef);
  font-size:clamp(.95rem,1.8vw,1.25rem)!important;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}

@media (hover:hover) and (pointer:fine){
  body.psq-event-index .grid > .card:hover::after,
  body.psq-event-index .grid > .card:focus-visible::after,
  body.psq-event-index .grid > .card:hover .label,
  body.psq-event-index .grid > .card:focus-visible .label{
    opacity:1;transform:none;
  }
}

@media (hover:none), (pointer:coarse){
  body.psq-event-index .grid > .card.psq-revealed::after,
  body.psq-event-index .grid > .card.psq-revealed .label{
    opacity:1;transform:none;
  }
}

.shelf .piece .pname,
.shelf .piece .pname2,
.shelf .piece .pmeta,
.shelf .piece .buy{
  position:absolute!important;
  z-index:2;
  margin:0!important;
}

.shelf .piece .pname,
.shelf .piece .pname2{
  left:18px;right:18px;bottom:46px;
  color:var(--parchment,#eceeef);
  font-size:clamp(.95rem,1.6vw,1.18rem)!important;
  line-height:1.12!important;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}

.shelf .piece .pmeta{
  left:18px;bottom:18px;
  font-size:.62rem!important;
  color:rgba(236,238,239,.68)!important;
}

.shelf .piece .buy{
  right:18px;bottom:15px;
  width:auto!important;padding:0 0 3px!important;
  border:0!important;border-bottom:1px solid rgba(236,238,239,.38)!important;
  background:transparent!important;color:rgba(236,238,239,.82)!important;
  font-size:.56rem!important;
}

.grid{
  background:transparent!important;
  gap:1px;
}

.grid .card[data-name]{
  aspect-ratio:1/1;
  background:transparent!important;
}

.grid .card[data-name] .info{
  position:absolute!important;
  left:0;right:0;bottom:0;z-index:3;
  padding:18px!important;
  pointer-events:none;
}

.grid .card[data-name] .info h4{
  color:var(--parchment,#eceeef);
  font-size:clamp(.86rem,1.4vw,1.05rem)!important;
  line-height:1.15;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}

.grid .card[data-name] .info .price{
  color:rgba(236,238,239,.66)!important;
  font-size:.58rem!important;
}

@media (hover:hover) and (pointer:fine){
  .shelf .piece:hover::after,
  .shelf .piece:focus-visible::after,
  .grid .card[data-name]:hover::after,
  .grid .card[data-name]:focus-visible::after{opacity:1;}
}

@media (hover:none), (pointer:coarse){
  .shelf .piece.psq-revealed::after,
  .grid .card[data-name].psq-revealed::after{opacity:1;}
}

@media(max-width:640px){
  h1,h2,h3,.serif,.pname,.name,.headline,.scene-title,.pull-quote{
    letter-spacing:-.03em;
  }
  .eyebrow,.tag,.idx,.num,.roman,.numeral,.beat-label,.chapter-num{
    letter-spacing:.18em;
  }
  .mobile-character-tools{
    border-bottom-color:var(--psq-hairline);
  }
  .shelf{gap:8px!important;padding-left:4vw!important;padding-right:4vw!important;}
  .shelf .piece .pname,.shelf .piece .pname2{left:12px;right:12px;bottom:38px;font-size:.82rem!important;}
  .shelf .piece .pmeta{left:12px;bottom:12px;font-size:.5rem!important;}
  .shelf .piece .buy{right:12px;bottom:10px;font-size:.48rem!important;}
  .grid .card[data-name] .info{padding:12px!important;}
  body.psq-event-index .grid{gap:8px!important;}
  body.psq-event-index .grid > .card .label{padding:12px!important;}
}

/* V16 — Event uses equal-sized, two-column chapter previews. */
body.psq-event-index .grid{
  max-width:1240px;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:clamp(14px,1.8vw,24px)!important;
  background:transparent!important;
  border:0!important;
}

body.psq-event-index .grid > .card{
  aspect-ratio:16/9;
  border:0!important;
}

body.psq-event-index .grid > .card:first-child{
  grid-column:auto;
  aspect-ratio:16/9;
}

body.psq-event-index .grid > .card .frame,
body.psq-event-index .grid > .card .frame img{
  width:100%;
  height:100%;
}

body.psq-event-index .grid > .card .frame img{
  display:block;
  object-fit:cover;
  transform:scale(1.002);
  filter:saturate(.9) brightness(.94);
  transition:transform .9s var(--psq-ease),filter .55s ease;
}

@media (hover:hover) and (pointer:fine){
  body.psq-event-index .grid > .card:hover .frame img,
  body.psq-event-index .grid > .card:focus-visible .frame img{
    transform:scale(1.025);
    filter:saturate(1) brightness(.86);
  }
}

/* V10 — all product-bearing pages dissolve from the dark world into a pale materialisation field. */
body.psq-has-products{
  --psq-product-start:55vh;
  --psq-product-mid:78vh;
  --psq-product-light:98vh;
  --psq-product-shelf:115vh;
  background-color:#ecedeb!important;
  background-image:var(--psq-product-gradient,linear-gradient(180deg,#151617 0%,#ecedeb 100%))!important;
  background-repeat:no-repeat!important;
  background-position:center top!important;
  background-size:100% 100%!important;
  background-attachment:scroll!important;
}

body.psq-has-products .shelf{
  --psq-product-gap:clamp(10px,1.6vw,20px);
  width:min(100%,1240px)!important;
  max-width:1240px!important;
  margin:clamp(32px,4vw,56px) auto clamp(58px,7vw,92px)!important;
  padding-inline:clamp(14px,4vw,52px)!important;
  display:flex!important;
  flex-wrap:wrap;
  justify-content:center;
  gap:var(--psq-product-gap)!important;
  background:transparent!important;
  border:0!important;
}

body.psq-has-products .shelf > .piece{
  flex:0 0 calc((100% - 3 * var(--psq-product-gap)) / 4);
  min-width:0;
}

body.psq-has-products .shelf-head,
body.psq-has-products .other-head,
body.psq-has-products .chapter-nav{
  color:#292b2c!important;
  border:0!important;
  box-shadow:none!important;
}
body.psq-has-products .shelf-head,
body.psq-has-products .other-head{
  margin-top:clamp(220px,30vh,360px)!important;
}
body.psq-has-products .shelf.psq-product-entry-direct{
  margin-top:clamp(220px,30vh,360px)!important;
}
body.psq-has-products .shelf-head .tag,
body.psq-has-products .other-head .tag{
  color:#6e592f!important;
}
body.psq-has-products .shelf-head p,
body.psq-has-products .other-head p,
body.psq-has-products .chapter-nav a{
  color:#626568!important;
}
body.psq-has-products .chapter-nav a:hover{color:#292b2c!important;}

body.psq-has-products .shelf::before,
body.psq-has-products .shelf::after,
body.psq-has-products .shelf-head::before,
body.psq-has-products .shelf-head::after,
body.psq-has-products .other-head::before,
body.psq-has-products .other-head::after,
body.psq-has-products .chapter-nav::before,
body.psq-has-products .chapter-nav::after{
  border:0!important;
  box-shadow:none!important;
}

@media(max-width:640px){
  body.psq-has-products .shelf,
  body.psq-has-products .shelf.psq-product-count-1,
  body.psq-has-products .shelf.psq-product-count-2,
  body.psq-has-products .shelf.psq-product-count-3,
  body.psq-has-products .shelf.psq-product-count-5,
  body.psq-has-products .shelf.psq-product-count-6,
  body.psq-has-products .shelf.psq-product-count-7{
    width:100%!important;
    max-width:none!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    --psq-product-gap:8px;
    padding-inline:4vw!important;
  }
  body.psq-has-products .shelf > .piece{
    flex-basis:calc((100% - var(--psq-product-gap)) / 2);
    grid-column:auto!important;
    width:auto!important;
  }
}

@media(max-width:640px){
  body.psq-event-index .grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  body.psq-event-index .grid > .card,
  body.psq-event-index .grid > .card:first-child{
    grid-column:auto;
    aspect-ratio:4/5;
  }
  body.psq-event-index .grid > .card:nth-child(1) .frame img{object-position:50% 50%;}
  body.psq-event-index .grid > .card:nth-child(2) .frame img{object-position:50% 50%;}
  body.psq-event-index .grid > .card:nth-child(3) .frame img{object-position:42% 50%;}
  body.psq-event-index .grid > .card:nth-child(4) .frame img{object-position:50% 55%;}
  body.psq-event-index .grid > .card:nth-child(5) .frame img{object-position:38% 55%;}
}

/* Enlarge character detail films only above the existing mobile breakpoint. */
@media(min-width:641px){
  .scene:has(video){
    max-width:900px;
    aspect-ratio:16/9;
  }
}

.psq-expand-video{position:absolute;right:14px;bottom:14px;z-index:20;display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid #ffffff70;border-radius:50%;background:#10111299;color:white;cursor:pointer;}
.psq-expand-video svg{width:20px;height:20px;}
.scene:fullscreen{width:100vw!important;max-width:none!important;height:100dvh!important;min-height:0!important;margin:0!important;border:0!important;aspect-ratio:auto!important;background:#000;transform:none!important;}
.scene:fullscreen video{object-fit:contain!important;object-position:50% 50%!important;}
.scene:fullscreen .scene-copy,.scene:fullscreen .scene-veil{display:none;}

/* V22 — a single product format across chapters, independent of story width. */
.shelf .piece .frame,.shelf .piece .pframe{
  aspect-ratio:1 / 1!important;
  height:auto!important;
  background:#fff;
}
.shelf .piece .frame img,.shelf .piece .pframe img{
  display:block;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}
body.psq-event-detail,body.psq-event-index{padding-inline:0;}
body.psq-event-detail .topnav,body.psq-event-index .topnav,
body.psq-event-detail .chapter,body.psq-event-index .head,
body.psq-event-index > .grid{width:calc(100% - 2 * clamp(14px,4vw,52px));}
body.psq-has-products .shelf-head h2{color:#292b2c!important;}
body.psq-has-products footer,
body.psq-has-products footer .fmark{color:#55595c!important;}
body.psq-has-products footer a{color:#343738!important;}
body.psq-has-products footer{border-color:rgba(41,43,44,.2);}
body.psq-event-detail .chapter-lore{color:#b3b5b8;}
.shelf .piece:focus-within::after{opacity:1;}

/* V23 — keep revealed product details legible on narrow cards. */
.deck .card{position:relative;}
.psq-coming-soon{max-width:1180px;margin:24px auto 80px;padding:0 5vw;color:#b3b5b8;}
.deck .card > .play-tap{z-index:8;}
.play-tap.hidden{pointer-events:none;visibility:hidden;}
@media(max-width:640px){
  .shelf .piece::after{
    inset:0;
    background:linear-gradient(180deg,rgba(10,11,13,.5),rgba(10,11,13,.94));
  }
  .shelf .piece .pname,.shelf .piece .pname2{
    bottom:68px;
    font-size:14px!important;
    line-height:1.2!important;
  }
  .shelf .piece .pmeta{
    bottom:44px;
    font-size:12px!important;
    letter-spacing:.02em;
    color:#eceeef!important;
  }
  .shelf .piece .buy{
    left:12px;right:auto;bottom:12px;
    font-size:12px!important;
    letter-spacing:0;
  }
}