*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#1a110b;color:#fff;font:500 1rem/1.55 Cormorant,Georgia,serif}a,button{font:inherit}.skip{position:fixed;z-index:99;top:.8rem;left:1rem;transform:translateY(-180%);padding:.8rem;background:white;color:#111}.skip:focus{transform:none}:focus-visible{outline:3px solid var(--rfb-focus);outline-offset:4px}.brand{display:flex;align-items:center;gap:.8rem;color:#fff;text-decoration:none;font:700 .75rem Montserrat,sans-serif;letter-spacing:var(--rfb-track-label)}.brand img{width:3.2rem;height:3.2rem;border-radius:var(--rfb-r-round)}.case-heading p, .passport-heading p{margin:0;color:#efc369;font:700 var(--rfb-t-micro) Montserrat,sans-serif;letter-spacing:var(--rfb-track-word)}@keyframes rain{to{background-position:0 45px}}@keyframes leaf{50%{transform:translate(4rem,5rem) rotate(260deg)}}.story-footer{min-height:4rem;padding:1rem 5vw;display:flex;justify-content:space-between;align-items:center;background:#ead8b8;color:var(--rfb-wood-deep)}.story-footer a{color:#7a2436;font-weight:700}.story-footer.dark{background:var(--rfb-night);color:#ddd0b8}.evidence-room{position:relative;min-height:100svh;overflow:hidden;background:radial-gradient(circle at 76% 43%,#25475e,var(--rfb-night-2) 42%,#04080c 76%)}.case-window{position:absolute;inset:0;background:linear-gradient(90deg,#03080df5 0 35%,transparent 70%),url('../assets/ghost-trolley.webp') center/cover;opacity:.48}.case-rain{position:absolute;inset:0;background:repeating-linear-gradient(107deg,transparent 0 30px,#d4edff25 31px 32px,transparent 33px 51px);animation:rain 1s linear infinite}.detective-portrait{position:absolute;z-index:3;right:2%;bottom:-3%;width:min(48vw,42rem)}.detective-portrait img{width:100%;filter:drop-shadow(0 2rem 1.5rem var(--rfb-scrim-4))}.case-heading{position:absolute;z-index:5;left:6%;top:18%;width:min(37rem,46vw)}.case-heading h1{margin:.4rem 0;font:400 clamp(4rem,8vw,8rem)/.8 Limelight;text-transform:uppercase;text-shadow:.16rem .16rem var(--rfb-crimson)}.case-heading span{font-size:1.3rem}.evidence{position:absolute;z-index:7;padding:.75rem 1rem;color:#21180e;background:linear-gradient(135deg,var(--rfb-brass-lit),#b88437);border:1px solid var(--rfb-brass-lit);box-shadow:0 .8rem 1.3rem var(--rfb-scrim-3);cursor:pointer;transition:.22s}.evidence small,.evidence strong{display:block;font-family:Montserrat}.evidence small{font-size:var(--rfb-t-micro);letter-spacing:var(--rfb-track-label)}.evidence:hover,.evidence.active{transform:translateY(-.5rem);box-shadow:0 1rem 1.5rem #000,0 0 1.6rem #e6bb6966}.evidence-method{left:7%;top:57%;transform:rotate(-3deg)}.evidence-fedora{left:25%;top:65%;transform:rotate(2deg)}.evidence-patches{left:44%;top:74%;transform:rotate(-2deg)}.evidence-note{position:absolute;z-index:7;left:6%;bottom:5%;width:min(31rem,45vw);padding:1rem 1.3rem;color:#21190f;background:var(--rfb-paper);box-shadow:0 1rem 2rem var(--rfb-scrim-3);transform:rotate(-1deg)}.evidence-note small,.type-label{font:700 var(--rfb-t-micro) Montserrat;letter-spacing:var(--rfb-track-label);color:var(--rfb-crimson-deep)}.evidence-note p{margin:.3rem 0}.case-cta{position:absolute;z-index:8;right:5%;bottom:5%;padding:.9rem 1.2rem;color:white;text-decoration:none;background:#841f32;border:1px solid var(--rfb-brass)}.case-cta span,.case-cta strong{display:block}.case-cta span{font:700 var(--rfb-t-micro) Montserrat;letter-spacing:var(--rfb-track-label)}.case-desk{min-height:41rem;padding:6rem 6vw;display:grid;grid-template-columns:1.2fr .8fr;gap:5vw;align-items:center;background:radial-gradient(circle at 30% 20%,#987146,#46301c 70%)}.folder-sheet{padding:3rem;color:#251e16;background:var(--rfb-paper);box-shadow:0 1.5rem 2rem #160b05aa;transform:rotate(-1deg)}.folder-sheet h2{font:400 clamp(2.6rem,5vw,5rem)/.9 Limelight;text-transform:uppercase}.folder-sheet dl,.passport-profile dl{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.folder-sheet dl div,.passport-profile dl div{border-top:1px solid #8b7657;padding-top:.65rem}.folder-sheet dt,.passport-profile dt{font:700 var(--rfb-t-micro) Montserrat;text-transform:uppercase;letter-spacing:var(--rfb-track-body)}.folder-sheet dd,.passport-profile dd{margin:0}.case-desk blockquote{font-size:clamp(2rem,4vw,3.7rem);font-style:italic;line-height:1.08}.passport-stage{position:relative;min-height:100svh;padding-top:7rem;overflow:hidden;background:radial-gradient(circle at 76% 25%,#f1d394,#a97236 54%,var(--rfb-wood));color:#20180f}.map-drift{position:absolute;inset:0;background:url('../assets/pyramids.webp') center/cover;opacity:.18;mix-blend-mode:multiply;animation:drift 20s ease-in-out infinite alternate}@keyframes drift{to{transform:scale(1.04) translateX(-1%)}}.gus-traveler{position:absolute;z-index:5;right:1%;bottom:-2%;width:min(43vw,40rem)}.gus-traveler img{width:100%;filter:drop-shadow(0 2rem 1.5rem #321807cc);animation:breathe 5s ease-in-out infinite}@keyframes breathe{50%{transform:translateY(-.55rem) rotate(.5deg)}}.passport-heading{position:absolute;z-index:4;left:5%;top:13%;width:44%}.passport-heading h1{margin:.4rem 0;font:400 clamp(3.2rem,6.15vw,6.15rem)/.8 Limelight;text-transform:uppercase}.passport-heading span{font-size:1.3rem}.passport-book{position:absolute;z-index:6;left:5%;bottom:5%;width:min(66vw,58rem);min-height:47%;display:grid;grid-template-columns:.9fr 1.1fr;color:var(--rfb-wood-deep);background:var(--rfb-paper);border:1rem solid #803044;border-radius:.7rem;box-shadow:0 2rem 3rem color-mix(in srgb, var(--rfb-wood-deep) 76%, transparent)}.passport-profile,.passport-stamps{padding:1.4rem}.passport-profile h2{margin:.1rem 0 1rem;font:400 3rem Limelight}.passport-seal{float:right;display:grid;place-items:center;width:4rem;height:4rem;border:4px double #873246;border-radius:var(--rfb-r-round);color:#873246;font:700 1rem Montserrat;transform:rotate(8deg)}.passport-profile>p,.passport-stamps>p{font:700 var(--rfb-t-micro) Montserrat;letter-spacing:var(--rfb-track-label);color:#873246}.passport-stamps{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.passport-stamps>p{grid-column:1/-1;margin:0}.stamp-button{min-height:5rem;color:#873246;background:transparent;border:4px double currentColor;border-radius:var(--rfb-r-round);font:700 .72rem Montserrat;cursor:pointer;transition:.22s}.stamp-button small{display:block;font-size:var(--rfb-t-micro)}.stamp-button:hover,.stamp-button.active{transform:scale(1.07) rotate(-2deg);background:#e6cc94}.travel-note{grid-column:1/-1;padding:.8rem 1.5rem;background:#dcc696;border-top:1px dashed #796241}.travel-note small{font:700 var(--rfb-t-micro) Montserrat;letter-spacing:var(--rfb-track-label);color:#873246}.travel-note p{display:inline;margin-left:.7rem}.travel-note a{float:right;color:#712337;font-weight:700}.slow-note{position:absolute;z-index:7;right:3%;top:18%;width:23%;color:#fff4d9;font-size:1.35rem;font-style:italic;text-shadow:0 2px 8px #321807}
@media(max-width:900px){.case-heading{top:14%;width:88%}.detective-portrait{width:72vw;right:-10%;bottom:15%}.evidence-method{left:4%;top:53%}.evidence-fedora{left:4%;top:63%}.evidence-patches{left:4%;top:73%}.evidence-note{left:4%;bottom:2%;width:63%}.case-cta{right:3%;bottom:3%;max-width:33%}.case-desk{grid-template-columns:1fr}.passport-stage{min-height:74rem}.passport-heading{position:relative;left:6%;top:2rem;width:88%}.gus-traveler{width:72vw;right:-10%;bottom:38%}.passport-book{left:4%;bottom:4%;width:92%;min-height:39rem;grid-template-columns:1fr}.slow-note{top:27rem;left:6%;width:43%}.travel-note p{display:block;margin:.3rem 0}.travel-note a{float:none}}@media(max-width:600px){.case-heading h1{font-size:3.5rem}.detective-portrait{width:94vw;opacity:.82}.evidence-note{width:92%}.case-cta{display:none}.folder-sheet{padding:1.6rem}.folder-sheet dl,.passport-profile dl{grid-template-columns:1fr}.passport-heading h1{font-size:3rem}.gus-traveler{width:92vw;opacity:.8}.passport-book{border-width:.55rem}.slow-note{width:60%}.story-footer{gap:1rem;flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none;transition:none;scroll-behavior:auto}}

/* ============================================================================
   The character gateway — two worlds, two doors, one rule about pairing.

   Rebuilt 2026-09-08 (Phase 4). Previously the character and its own label were
   positioned independently, so at tablet Scarlet's art sat left while her card
   sat right and Gus's did the reverse — the pairing read as crossed. Here each
   door is a self-contained grid: the guide above, the invitation below, always
   in the same column as each other.
   ========================================================================= */
.character-gateway{
  position:relative; isolation:isolate;
  display:grid;
  grid-template-columns:1fr;
  gap:var(--rfb-s5);
  align-content:start;
  padding:calc(var(--rfb-head-h) + var(--rfb-s6)) var(--rfb-gutter) var(--rfb-s8);
  min-height:100svh;
}
@media (min-width:760px){
  .character-gateway{
    grid-template-columns:1fr 1fr;
    gap:var(--rfb-s6);
    align-content:center;
    padding-block:calc(var(--rfb-head-h) + var(--rfb-s5)) var(--rfb-s7);
  }
}

/* The seam between the two worlds, and their weather. */
.character-gateway{ background:var(--rfb-night); }
.world-split{
  position:absolute; inset:0; z-index:var(--rfb-z-under); pointer-events:none;
  background:
    linear-gradient(90deg,
      color-mix(in srgb, var(--rfb-night) 88%, transparent) 0 46%,
      color-mix(in srgb, var(--rfb-wood-deep) 62%, transparent) 54% 100%),
    url('../assets/crossroads-waystation-v2.webp') center/cover;
}
/* Below the split point the two worlds stack, so the wash turns vertical. */
@media (max-width:759.98px){
  .world-split{
    background:
      linear-gradient(180deg,
        color-mix(in srgb, var(--rfb-night) 88%, transparent) 0 46%,
        color-mix(in srgb, var(--rfb-wood-deep) 62%, transparent) 54% 100%),
      url('../assets/crossroads-waystation-v2.webp') center/cover;
  }
}
@media (min-width:760px){
  .world-split::after{
    content:""; position:absolute; top:0; bottom:0; left:50%; width:2px;
    background:linear-gradient(180deg, transparent,
      var(--rfb-brass) 28% 72%, transparent);
    box-shadow:0 0 3rem color-mix(in srgb, var(--rfb-brass-lit) 60%, transparent);
  }
}
.noir-weather{ position:absolute; inset:0 50% 0 0; }
.travel-weather{ position:absolute; inset:0 0 0 50%; }
@media (max-width:759.98px){
  .noir-weather{ inset:0 0 50% 0; }
  .travel-weather{ inset:50% 0 0 0; }
}

.gateway-title{
  grid-column:1/-1; text-align:center; max-width:44rem; margin-inline:auto;
}
.gateway-title p{
  margin:0; color:var(--rfb-brass);
  font:700 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
}
.gateway-title h1{
  margin:var(--rfb-s2) 0; font:600 var(--rfb-t-h2)/1 var(--rfb-display);
  text-wrap:balance;
}
.gateway-title span{
  display:block; color:var(--rfb-paper-dim);
  font:italic var(--rfb-t-body)/1.4 var(--rfb-display); text-wrap:pretty;
  max-width:38rem; margin-inline:auto;
}
@media (min-width:600px){ .gateway-title span{ font-size:var(--rfb-t-lead); } }

/* ---- a door: guide above, invitation below, never separated ---- */
.character-door{
  /* neutralise any offset a retired rule may still be applying */
  position:relative; inset:auto;
  display:grid; grid-template-columns:minmax(0,38%) minmax(0,1fr); gap:var(--rfb-s4);
  align-items:center; justify-items:center;
  min-height:0; padding:var(--rfb-s4);
  border:1px solid color-mix(in srgb, var(--rfb-brass) 22%, transparent);
  border-radius:var(--rfb-r-md);
  background:linear-gradient(180deg, transparent 40%,
             color-mix(in srgb, var(--rfb-night) 78%, transparent));
  text-decoration:none; color:var(--rfb-paper);
  transition:border-color var(--rfb-med) var(--rfb-ease),
             transform var(--rfb-med) var(--rfb-ease);
}
.character-door:hover,.character-door:focus-visible{
  border-color:var(--rfb-brass); transform:translateY(-4px);
}
.character-door>img{
  position:static; inset:auto;
  width:auto; max-width:100%;
  height:clamp(120px, 22svh, 190px);
  object-fit:contain; object-position:bottom;
  filter:drop-shadow(0 18px 28px color-mix(in srgb, var(--rfb-night) 80%, transparent));
}
@media (min-width:760px){
  .character-door>img{
    width:auto; max-width:100%;
    height:auto;
    max-height:clamp(120px, min(40svh, calc(100svh - 600px)), 440px);
  }
}

.door-copy{
  position:static; inset:auto;
  display:block; width:100%; text-align:left;
  padding:0;
  border-left:1px solid color-mix(in srgb, var(--rfb-brass) 26%, transparent);
  padding-left:var(--rfb-s4);
}
@media (min-width:760px){
  .door-copy{
    text-align:center; padding:var(--rfb-s3) var(--rfb-s3) var(--rfb-s2);
    border-left:0;
    border-top:1px solid color-mix(in srgb, var(--rfb-brass) 26%, transparent);
  }
}
.door-copy small{
  display:block; color:var(--rfb-brass);
  font:700 var(--rfb-t-micro)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-word); text-transform:uppercase;
}
.door-copy strong{
  display:block; margin:var(--rfb-s1) 0 var(--rfb-s2);
  font:600 var(--rfb-t-h3)/1.05 var(--rfb-display); text-transform:uppercase;
}
.door-copy strong em{ color:var(--rfb-brass-lit); font-style:normal; }
.door-copy b{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--rfb-tap); padding:0 var(--rfb-s4);
  border:1px solid color-mix(in srgb, var(--rfb-brass) 55%, transparent);
  border-radius:var(--rfb-r-sm);
  font:600 var(--rfb-t-label)/1 var(--rfb-ui);
  letter-spacing:var(--rfb-track-label); text-transform:uppercase;
  color:var(--rfb-brass-lit);
}
.character-door:hover .door-copy b{ background:var(--rfb-brass); color:var(--rfb-ink); }

.gateway-fedora{
  grid-column:1/-1; justify-self:center; pointer-events:none;
  order:-1; margin-bottom:calc(var(--rfb-s5) * -1);
}
.gateway-fedora img{ width:clamp(44px,5vw,72px); height:auto; display:block; }


@media (min-width:760px){
  /* Portrait door: guide above, invitation below, in one column of its own. */
  .character-door{
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
    align-items:end; justify-items:center;
  }
}