/* Push This Button show index: the lobby of the stairwell. Same materials as episode 1. */
@font-face{font-family:DM;src:url('/sundrift/fonts/dm-sans.ttf') format('truetype');font-display:swap}
@font-face{font-family:Instrument;src:url('/sundrift/fonts/instrument-serif.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--paper:#f6ead4;--cream:#efe2c4;--ink:#22150a;--amber:#ffb347;--soot:#130d09;--brass-hi:#f0cc8e;--brass:#c3904f;--brass-lo:#8a5f2c;--mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace}
*{box-sizing:border-box}
html{background:var(--soot)}
body{margin:0;min-height:100vh;color:var(--paper);font:16px/1.55 DM,system-ui,sans-serif;overflow-x:hidden;
  background:radial-gradient(ellipse 60% 50% at 78% 18%,rgba(243,197,141,.42),transparent 60%),
  repeating-conic-gradient(from 8deg at 78% 18%,rgba(120,80,45,.32) 0 6deg,rgba(0,0,0,0) 6deg 15deg),
  radial-gradient(circle at 78% 18%,#3a2414 0,#1a100a 55%,var(--soot) 100%);background-attachment:fixed}
a{color:inherit;text-underline-offset:4px}
:focus-visible{outline:3px dotted var(--amber);outline-offset:4px}
.lobby{max-width:1240px;margin:auto;padding:0 clamp(18px,4vw,56px)}
.mast{display:flex;align-items:center;gap:22px;padding:22px 0;font:600 12px/1.2 DM,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.show{text-decoration:none}
.show span{color:var(--amber);margin-left:6px}
.studio{margin-left:auto;text-decoration:none;color:#e6d6bb;letter-spacing:.08em;text-transform:none;font-weight:400;font-size:14px}
.kicker{font:600 11px DM,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin:0 0 12px}
.intro{padding:clamp(40px,9vh,110px) 0 clamp(36px,6vh,70px);max-width:720px}
h1{font:400 clamp(64px,9.5vw,150px)/.82 Instrument,Georgia,serif;letter-spacing:-.035em;margin:0 0 26px;color:#fff3df;text-shadow:0 3px 30px rgba(20,8,0,.55)}
h1 span{color:var(--amber)}
.intro p:last-child{font-size:19px;max-width:520px;color:#f0dfc2;margin:0}

/* The directory board: a brass frame, one enamel row per floor. */
.directory{position:relative;padding:22px;border-radius:14px;color:var(--ink);margin-bottom:34px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px),linear-gradient(158deg,var(--brass-hi),var(--brass) 38%,var(--brass-lo));
  box-shadow:inset 0 1px 0 #fff2cf,inset 0 -3px 10px rgba(59,34,12,.55),0 0 0 1px #4a2e12,0 28px 70px rgba(0,0,0,.65)}
.directory:before,.directory:after{content:'';position:absolute;top:10px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f8dfb0,#6b4520 70%)}
.directory:before{left:10px}.directory:after{right:10px}
.board-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px;padding:0 6px;font:600 11px DM,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.board-title b{font:600 13px var(--mono);letter-spacing:.12em;color:#ffcf7a;background:#140b05;padding:7px 10px;border-radius:4px;box-shadow:inset 0 2px 6px #000;text-shadow:0 0 6px rgba(255,179,71,.6)}
.episode{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,4vw,44px);align-items:center;background:var(--cream);border-radius:6px;padding:clamp(14px,2vw,22px);box-shadow:inset 0 1px 3px rgba(0,0,0,.35),0 1px 0 rgba(255,255,255,.4)}
.episode img{display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 0 0 3px #4a2e12,0 10px 24px rgba(0,0,0,.35)}
.floor{font:700 12px var(--mono);letter-spacing:.14em;color:#7a3d0c;margin:0 0 8px}
.episode h2{font:400 clamp(40px,4.4vw,60px)/.95 Instrument,Georgia,serif;letter-spacing:-.02em;margin:0 0 14px;color:#1d1209}
.episode p{margin:0 0 14px;color:#3a2614}
.episode-link{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:6px 20px 6px 6px;border-radius:30px;text-decoration:none;font:600 15px DM,sans-serif;color:#f6e6c8;background:linear-gradient(#2b1c12,#140c07);box-shadow:0 3px 0 #3b2410}
.episode-link i{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-style:normal;color:#4a2508;background:radial-gradient(circle at 40% 32%,#fff1cc,#ffb347 60%,#c06a1c);box-shadow:0 0 14px rgba(255,179,71,.7)}
.episode-link:active{transform:translateY(2px);box-shadow:0 1px 0 #3b2410}
.coming{font:600 11px DM,sans-serif!important;letter-spacing:.1em;text-transform:uppercase;color:#5a3a1a!important;margin:6px 0 0!important}
.next-floor{display:flex;justify-content:space-between;gap:12px;margin-top:10px;padding:14px 18px;border-radius:6px;background:rgba(239,226,196,.55);font:600 12px DM,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#3a2614;box-shadow:inset 0 1px 3px rgba(0,0,0,.3)}
.next-floor span:last-child{font-family:var(--mono)}

.follow-panel{display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:24px;align-items:center;margin-bottom:40px;padding:clamp(22px,4vw,40px);background:linear-gradient(#1c130d,#140d08);border:1px solid #5d4022;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.follow-panel h2{font:400 clamp(32px,3.6vw,48px)/1 Instrument,Georgia,serif;margin:0 0 12px;color:#fff1db}
.follow-panel p:last-child{margin:0;color:#e8d8bd;max-width:480px}
.rbs-social{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}
.rbs-social a{display:grid;place-items:center;width:44px;height:44px;color:#f0d7ae;border-radius:50%}
.rbs-social a:hover{background:rgba(255,200,130,.12)}
.rbs-social svg{width:20px;height:20px}
footer{display:flex;flex-wrap:wrap;gap:12px 28px;padding:10px 0 40px;font-size:14px;color:#e2cfae}
@media (max-width:800px){
  .episode,.follow-panel{grid-template-columns:1fr}
  .directory{padding:16px}
  .board-title{flex-wrap:wrap}
}