/* The night collection uses each game's actual catalogue artwork. */
.night-folio {display:none}
[data-nocturne] {color-scheme:dark}
[data-nocturne] .landing {background:radial-gradient(ellipse at 9% -30%,color-mix(in srgb,var(--accent) 14%,var(--bg)),transparent 54%),var(--bg)}
[data-nocturne] .landing-wrap {width:min(1420px,calc(100% - clamp(32px,8vw,136px)))}
[data-nocturne] .mast {height:70px}
[data-nocturne] .mast .brand {letter-spacing:-.065em}
[data-nocturne] .entry {align-items:center;gap:clamp(22px,5vw,90px);grid-template-columns:minmax(0,1.52fr) minmax(285px,.83fr);margin:clamp(20px,4vh,52px) 0}
[data-nocturne] .poster {--align:50% 32%;position:relative;isolation:isolate;display:flex;justify-content:flex-end;overflow:hidden;min-height:clamp(520px,66vh,710px);padding:clamp(24px,3.3vw,58px);border:1px solid color-mix(in srgb,var(--accent) 29%,transparent);background:var(--bg)}
[data-nocturne] .art-pane {position:absolute;inset:0;z-index:-3;width:auto;height:100%;margin:0;overflow:hidden}
[data-nocturne] .art-pane img {display:block;width:100%;height:100%;object-fit:cover;object-position:var(--align);animation:none;filter:saturate(.92) contrast(1.02)}
[data-nocturne] .poster .poster-tint {display:block;position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#06090e33 0%,transparent 33%,color-mix(in srgb,var(--bg) 62%,transparent) 64%,var(--bg) 100%),linear-gradient(90deg,#080a0b55,transparent 70%)}
[data-nocturne] .poster::after {content:"";position:absolute;inset:11px;z-index:-1;pointer-events:none;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
[data-nocturne] .poster-copy {position:relative;min-width:0;max-width:100%;padding:0}
[data-nocturne] #minimal-eyebrow {color:var(--accent);display:flex;align-items:center;gap:10px;letter-spacing:.18em;font:700 11px/1.2 ui-monospace,monospace;letter-spacing:.14em}
[data-nocturne] #minimal-eyebrow::before {content:"";width:26px;height:1px;background:currentColor}
[data-nocturne] #hero-title {margin:12px 0 0;max-width:100%;font-size:clamp(48px,5.2vw,92px);font-weight:700;letter-spacing:-.065em;line-height:.94;text-wrap:balance;overflow-wrap:break-word;text-shadow:0 2px 16px #0005}
[data-nocturne][data-font=serif] #hero-title {font-family:Georgia,"Times New Roman",serif;font-weight:500}
[data-nocturne] #hero-text {font:normal clamp(14px,1.13vw,18px)/1.5 system-ui,sans-serif;color:var(--bodyInk);max-width:40ch;margin:12px 0 0;text-shadow:0 1px 8px #070707}
[data-nocturne] .night-folio {display:flex;align-items:center;gap:10px;position:absolute;inset:20px 21px auto;pointer-events:none;color:#faf6e8;font:650 10px/1.2 ui-monospace,monospace;letter-spacing:.12em}
[data-nocturne] .night-folio span {background:#080b0bc4;padding:6px 9px;border:1px solid #fff3;border-radius:2px}
[data-nocturne] .night-folio b {color:var(--accent);font:inherit}
[data-nocturne] .night-folio i {margin-left:auto;width:16px;aspect-ratio:1;border:1px solid var(--accent);transform:rotate(45deg);box-shadow:inset 0 0 0 3px #0008}
[data-nocturne] .auth-paper {align-self:center;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--paper));box-shadow:0 14px 55px #0003;min-height:0}
[data-nocturne] .auth-paper h2 {font-family:system-ui,sans-serif;font-weight:650;letter-spacing:-.055em}
[data-nocturne] .auth-tabs {background:color-mix(in srgb,var(--bg) 75%,var(--paper));border:1px solid color-mix(in srgb,var(--accent) 16%,var(--paper))}
[data-nocturne] .auth-tabs button {color:var(--paperInk);opacity:.79}
[data-nocturne] .auth-tabs button[aria-selected=true] {background:color-mix(in srgb,var(--accent) 16%,var(--paper));color:var(--paperInk);opacity:1}
[data-nocturne] .auth-paper .field-hint,[data-nocturne] .auth-paper .lead {color:color-mix(in srgb,var(--paperInk) 76%,var(--paper))}
[data-nocturne] #access-form input {color:var(--paperInk);background:color-mix(in srgb,var(--bg) 62%,var(--paper));border-color:color-mix(in srgb,var(--paperInk) 27%,var(--paper))}
[data-nocturne] #access-form input::placeholder {color:color-mix(in srgb,var(--paperInk) 60%,var(--paper))}
[data-nocturne] .auth-paper .eye {color:var(--paperInk)}
[data-nocturne] .landing-footer {font-size:12px}
[data-nocturne] #pocket-enter[hidden] {display:none}
[data-template=hand-of-anubis] .poster {--align:55% 23%;border-radius:44% 44% 0 0 / 22% 22% 0 0}
[data-template=hand-of-anubis] .poster::after {border-radius:inherit;border-bottom:3px double var(--accent)}
[data-template=hand-of-anubis] .night-folio {top:clamp(18px,4.5vh,42px);justify-content:center}
[data-template=hand-of-anubis] .night-folio i {display:none}
[data-template=tombstone] .poster {--align:54% center;border-block:2px solid var(--accent);border-inline:0}
[data-template=tombstone] .poster::after {border:0;border-left:2px dotted #e3cba77d;inset:12px 0 12px 14px}
[data-template=tombstone] #hero-title {font-weight:700;letter-spacing:-.085em}
[data-template=le-vampire] .poster {--align:50% 32%;border-radius:65px 4px}
[data-template=le-vampire] .poster::after {border-radius:53px 2px}
[data-template=le-vampire] #hero-title {font-style:italic}
[data-template=stormforged] .poster {--align:55% 27%;clip-path:polygon(0 0,94% 0,100% 7%,100% 100%,0 100%);border-bottom:5px solid var(--accent)}
[data-template=stormforged] .poster::after {border:0;inset:auto 16px 19px auto;width:80px;height:6px;background:repeating-linear-gradient(115deg,var(--accent) 0 2px,transparent 2px 7px)}
[data-template=stormforged] #hero-title,[data-template=punk-rocker] #hero-title {font-family:Impact,"Arial Black",system-ui,sans-serif;text-transform:uppercase;font-weight:900;letter-spacing:-.04em}
[data-template=miami-mayhem] .poster {--align:65% 28%;border-radius:32px 32px 6px 6px;border-bottom:4px solid #ff9fc8}
[data-template=miami-mayhem] .poster::after {border:0;border-top:1px solid #ffc5cd;border-radius:inherit;inset:9px}
[data-template=miami-mayhem] #hero-title {font-family:Georgia,serif;font-weight:700;font-style:italic}
[data-template=the-crypt] .poster {--align:68% center;border:0;min-height:clamp(540px,67vh,730px)}
[data-template=the-crypt] .art-pane {inset:0 4% 0 16%;clip-path:polygon(50% 0,100% 16%,100% 100%,0 100%,0 16%)}
[data-template=the-crypt] .poster::after {border:0;inset:0 auto 18px 6px;width:1px;background:linear-gradient(transparent,var(--accent),transparent)}
[data-template=punk-rocker] .poster {--align:66% 30%;border:0;border-top:6px solid var(--accent)}
[data-template=punk-rocker] .poster::after {border:0;inset:18px auto auto 42%;width:68px;height:16px;transform:rotate(-8deg);background:repeating-linear-gradient(130deg,#eaf6b0c9 0 3px,transparent 3px 7px)}
[data-template=punk-rocker] #hero-title {transform:rotate(-2deg);transform-origin:left bottom}
[data-template=supernova] .poster {--align:63% 30%;border:0;background:radial-gradient(circle at 55% 32%,#342447,var(--bg) 68%)}
[data-template=supernova] .art-pane {inset:4% 2% auto 10%;height:85%;border-radius:50%;border:1px solid #d5b9ff55}
[data-template=supernova] .poster::after {inset:4% 2% auto 10%;height:85%;border-radius:50%;transform:rotate(-12deg) scale(1.04,.88)}
[data-template=supernova] #hero-title,[data-template=frozen-frenzy] #hero-title {font-size:clamp(43px,4.7vw,72px)}
[data-template=frozen-frenzy] .poster {--align:55% 37%;border:0}
[data-template=frozen-frenzy] .art-pane {clip-path:polygon(4% 0,100% 0,100% 83%,74% 96%,45% 85%,0 100%,0 24%)}
[data-template=frozen-frenzy] .poster::after {inset:21px 15px auto auto;width:26%;height:4px;border:0;background:repeating-linear-gradient(90deg,var(--accent) 0 1px,transparent 1px 6px)}
[data-template=the-luxe] .poster {--align:64% 33%;border:3px double var(--accent)}
[data-template=the-luxe] .poster::after {inset:11px;border:1px solid #ead49c8f;border-radius:60px 0}
[data-template=the-luxe] #hero-title {letter-spacing:-.07em}
@media(min-width:821px){
  :is([data-template=miami-mayhem],[data-template=punk-rocker],[data-template=the-crypt]) .entry {grid-template-columns:minmax(285px,.83fr) minmax(0,1.52fr)}
  :is([data-template=miami-mayhem],[data-template=punk-rocker],[data-template=the-crypt]) .poster {grid-area:1/2}
  :is([data-template=miami-mayhem],[data-template=punk-rocker],[data-template=the-crypt]) .auth-paper {grid-area:1/1}
}
@media(max-width:820px){
  [data-nocturne] .landing-wrap {width:calc(100% - 24px)}
  [data-nocturne] .mast {height:54px}
  [data-nocturne] .entry {grid-template-columns:minmax(0,1fr);margin:12px 0 22px;gap:12px}
  [data-nocturne] .poster {min-height:clamp(310px,82vw,410px);padding:22px 18px 17px;--align:50% 20%}
  [data-nocturne] #hero-title {font-size:clamp(37px,10vw,64px);line-height:.95;margin-top:7px}
  :is([data-template=supernova],[data-template=frozen-frenzy]) #hero-title {font-size:clamp(33px,8.7vw,58px)}
  [data-nocturne] #hero-text {font-size:13px;line-height:1.36;margin-top:8px;max-width:39ch}
  [data-nocturne] #minimal-eyebrow {font-size:9px;gap:6px}
  [data-nocturne] .night-folio {inset:15px 17px auto}
  [data-template=hand-of-anubis] .night-folio {top:14px}
  [data-nocturne] .pocket-enter {padding:0 11px;min-height:44px;margin-top:6px;font-size:13px}
  [data-nocturne] .auth-paper {padding:17px}
}
@media(prefers-reduced-motion:no-preference){
  [data-nocturne][data-motion=true] .art-pane img {animation:night-arrival 1050ms ease-out both}
  @keyframes night-arrival {from {transform:scale(1.035)} to {transform:scale(1)}}
}

/* Three distinct editorial compositions: archive print, forge and jewellery window. */
[data-template=tombstone] .poster {padding:0 0 22px}
[data-template=tombstone] .art-pane {position:relative;inset:auto;z-index:0;flex:1 1 0;min-height:210px;width:100%;height:auto;clip-path:polygon(0 0,100% 0,100% 95%,91% 96%,79% 94.7%,62% 97%,51% 95%,34% 98%,18% 97%,0 100%)}
[data-template=tombstone] .art-pane img {position:absolute;inset:0;object-position:50% 44%}
[data-template=tombstone] .poster .poster-tint {display:none}
[data-template=tombstone] .poster::after {display:none}
[data-template=tombstone] .poster-copy {margin:0;padding:18px 0 0}
[data-template=tombstone] .night-folio {z-index:1}
[data-template=stormforged] .poster-copy {border-left:3px solid var(--accent);padding-inline-start:15px}
[data-template=the-luxe] .poster-copy {width:100%;text-align:center}
[data-template=the-luxe] #minimal-eyebrow {justify-content:center}
[data-template=the-luxe] #minimal-eyebrow::after {content:"";width:26px;height:1px;background:currentColor}
[data-template=the-luxe] #hero-text {margin-inline:auto}
[data-template=supernova] .night-folio i {border-radius:50%;box-shadow:0 0 10px var(--accent)}
@media(max-width:820px){
 [data-template=tombstone] .poster {padding-bottom:10px}
 [data-template=tombstone] .art-pane {height:clamp(166px,40vw,208px);min-height:0;flex:0 0 auto}
 [data-template=tombstone] .poster-copy {padding:11px 6px 0}
 [data-template=frozen-frenzy] .art-pane {inset:0 0 0 24%;width:76%;clip-path:polygon(25% 0,100% 0,100% 92%,81% 100%,0 100%,0 27%)}
 [data-template=frozen-frenzy] .poster .poster-tint {background:linear-gradient(90deg,var(--bg) 0%,transparent 72%),linear-gradient(0deg,var(--bg),transparent 84%)}
 [data-template=stormforged] .poster-copy {padding-inline-start:10px}
}