#hud{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 20px;align-items:start}
#hud .room-heading{grid-column:1;grid-row:1;justify-self:start}
#run-clock [hidden]{display:none!important}
#run-clock{grid-column:2;grid-row:1;text-align:right;align-self:start;color:#eee1c6;max-width:270px;text-shadow:0 2px 8px #000}
#run-time,#run-penalty{font:21px/1.35 var(--font-body);font-variant-numeric:var(--figures);letter-spacing:.02em}
#run-penalty{font-size:15px;margin-left:7px;color:#e0bb84}
#run-status{display:block;max-width:250px;font:13px/1.4 var(--font-body);margin-top:3px;white-space:normal}
#hud .hud-actions{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:flex-end;gap:13px}
#hud .hud-actions .lantern{margin:0;width:22px;height:30px}
#hud .hud-actions #sound{min-width:44px;min-height:44px}
#hud #films-link,#leaderboard-link{position:static;display:inline-flex;align-items:center;min-height:44px;padding:0;color:#dcd1b9;font:13px/1.25 var(--font-control);text-decoration:underline;text-underline-offset:3px}
#leaderboard-link:hover,#leaderboard-link:focus-visible{color:#fff0d2}
body.character-charge #leaderboard-link,body.passage-confront #leaderboard-link{visibility:hidden}
body.run-finished #action-rail,html.ending-active body.run-finished #action-rail,html.ending-active body.rail-recovery-active #action-rail{display:block!important;max-height:calc(100svh - 145px);overflow:auto;touch-action:pan-y;z-index:95}
body.run-intro-active::after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.28);z-index:90;pointer-events:none}
body.run-intro-active #action-rail{display:block!important;top:50%;bottom:auto;transform:translate(-50%,-50%);width:min(740px,calc(100vw - 24px));max-height:86svh;min-height:0;padding:20px 24px 18px;overflow:visible;z-index:95}
body.run-intro-active #portrait-line{display:none!important}
body.run-intro-active #action-rail>.rail-copy,body.run-intro-active #next-room,body.run-intro-active #help-me,
body.run-finished #action-rail>.rail-copy,body.run-finished #next-room,body.run-finished #help-me{display:none!important}
.run-intro h1,.run-finish h1{font:27px/1.15 var(--font-display);color:#29271f;margin:0 0 6px;letter-spacing:var(--tracking-display)}
.run-subtitle{font:italic 16px/1.4 var(--font-body);margin:0 0 12px}
.run-intro{display:flex;flex-direction:column;max-height:calc(86svh - 40px);min-height:0}
.run-intro-heading,.run-intro-footer{flex:none}
.run-intro-body{position:relative;display:flex;min-height:0;flex:0 1 auto;overflow:hidden}
.run-intro-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;scrollbar-color:#77613e #d9c99e;scrollbar-width:thin;width:100%;padding:0 4px 2px 0}
.run-intro.has-overflow .run-intro-scroll{padding-bottom:8px}
.run-intro.has-more .run-intro-scroll{mask-image:linear-gradient(to bottom,#000 calc(100% - 38px),transparent calc(100% - 8px))}
.run-intro.has-more .run-intro-body::after{content:"";position:absolute;pointer-events:none;left:0;right:0;bottom:0;height:36px;background:linear-gradient(to bottom,rgba(232,214,178,0),#e8d6b2 90%)}
.run-rules-copy{max-height:none;overflow:visible;padding:0}
.run-intro p,.run-finish p{font:15px/1.45 var(--font-body);color:#302d22;margin:0 0 12px;white-space:pre-line}
.run-intro .run-rules-copy p{margin-bottom:9px}
.run-intro .run-rules-copy p:last-child{margin-bottom:0}
.run-intro-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding-top:6px;border-top:1px solid #80633e33;margin-top:8px}
#action-rail .run-intro .run-skip{margin:0 0 0 auto;flex:none;width:auto;min-height:44px}
.run-intro-more{font:13px/1.3 var(--font-body);color:#49311b}
body.run-intro-active #action-rail .run-transcript-toggle{display:block;background:transparent;border:0;box-shadow:none;text-decoration:underline;text-underline-offset:3px;font:14px/1.4 var(--font-control);min-height:30px;min-width:0;width:auto;padding:0 0 6px;color:#49311b;text-align:left}
.run-intro .run-intro-transcript{font-size:14px;padding:6px 0 10px;border-bottom:1px solid #80633e33;margin-bottom:10px}
#action-rail .plain-action{background:transparent!important;border:0!important;text-decoration:underline;text-underline-offset:4px;box-shadow:none;padding:8px 0!important;min-width:0!important}
#action-rail .run-intro .plain-action:disabled{opacity:.55}
.run-finish{color:#302d22;padding:4px 0}
/* Standalone result surface. This does not reserve or restore an instruction rail. */
#run-surfaces>.run-intro{padding:20px 24px;background:#e8d6b2;border:1px solid #80633e;border-radius:4px;box-shadow:0 6px 28px #0007;max-height:calc(100svh - 145px)}
#run-surfaces .run-intro .run-skip{margin-left:auto;min-height:44px}
#run-surfaces .run-intro .run-transcript-toggle{background:transparent;border:0;box-shadow:none;text-decoration:underline;text-underline-offset:3px;font:14px/1.4 var(--font-control);min-height:44px;min-width:0;width:auto;padding:0;color:#49311b;text-align:left}
#run-surfaces>.run-finish{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));max-height:calc(100svh - 145px);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:20px 24px;background:#e8d6b2;border:1px solid #80633e;border-radius:4px;box-shadow:0 6px 28px #0007;pointer-events:auto}
#run-surfaces>.run-finish button{min-height:44px;font:16px/1.3 var(--font-control);padding:9px 14px;background:#40331f;color:#f3e6c8;border:1px solid #705736;cursor:pointer}
#run-surfaces>.run-finish button:disabled{opacity:.55;cursor:default}
#run-surfaces>.run-finish .plain-action{background:transparent;color:#42301a;border:0;text-decoration:underline;text-underline-offset:4px;padding:8px 0}
@media(max-width:699px){#run-surfaces>.run-finish{bottom:12px;padding:16px;max-height:calc(100svh - 145px)}}
.run-totals{display:grid;grid-template-columns:1fr auto;gap:2px 15px;margin:10px 0 14px}
.run-totals p{margin:0;font-size:15px}
.run-totals p:first-child{grid-column:1/-1;font-size:21px;margin-bottom:5px}
.run-totals .penalty-row{grid-column:1/-1;font-size:13px}
.run-totals .run-progress,.run-totals .run-receipt{grid-column:1/-1}
#run-clock .run-receipt{display:block;font:11px/1.35 var(--font-body);letter-spacing:.02em;overflow-wrap:anywhere}
.run-finish .run-receipt{font-size:12px}
.run-finish .run-attestation{margin-top:6px}
.run-intro .run-recording-note{font-size:13px;margin-bottom:8px;flex:none}
.run-intro .contest-rule-section h3{font:21px/1.2 var(--font-display);margin:14px 0 7px}
.run-finish form{display:grid;gap:8px;margin-top:14px}
.run-finish label{font-size:15px}
.run-finish input{min-height:44px;max-width:100%;width:100%;padding:9px 12px;font:16px/1.3 var(--font-control);letter-spacing:.04em;background:#f8edcf;color:#28261f;border:1px solid #786341;outline-offset:3px;border-radius:0}
.run-finish .field-hint{font-size:13px;margin:0}
.run-finish form button{justify-self:start}
.run-finish a{color:#42301a;text-underline-offset:3px}
.run-finish a:hover{color:#70411c}
.run-finish .run-error:empty{display:none}
.run-finish .run-error{font-size:14px;color:#6b281d;margin:0}
.run-finish .claim-code{font-family:var(--font-body);font-variant-numeric:var(--figures);letter-spacing:.06em;font-size:19px;user-select:all;overflow-wrap:anywhere}
.run-navigation{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin-top:8px}
.run-navigation a{color:#302d22;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
#recovery .recovery-actions{display:flex;gap:12px;flex-wrap:wrap}
#recovery .recovery-explanation{font-size:14px;line-height:1.5;margin:10px 0 12px;color:var(--rail-text);text-shadow:none;opacity:1}
#action-rail .recovery-actions button{width:auto}
body[data-rail-style="a"] #next-reason{white-space:normal}
@media(max-width:700px){
  #hud{gap:0 10px;grid-template-columns:minmax(0,1fr) minmax(90px,auto)}
  #run-time{font-size:19px}
  #run-penalty{display:block;font-size:13px;margin:0}
  #run-status{font-size:12px;max-width:160px}
  #hud .hud-actions{grid-column:1/-1;justify-self:end;gap:12px;margin-top:1px}
  #hud .hud-actions .lantern{display:none}
  #hud #films-link,#leaderboard-link{font-size:12px}
  body.run-intro-active #hud{top:2px;align-items:center}
  body.run-intro-active #run-clock,body.run-intro-active #resident{display:none}
  body.run-intro-active #hud .hud-actions{grid-column:2;grid-row:1;margin-top:0}
  .run-intro h1,.run-finish h1{font-size:24px}
  .run-intro p,.run-finish p{font-size:14px;line-height:1.45}
  body.run-intro-active #action-rail{padding:16px 14px 12px}
  .run-intro{max-height:calc(86svh - 30px)}
  .run-intro .run-subtitle{font-size:14px;margin-bottom:6px}
  .run-intro .run-rules-copy p{font-size:14px;line-height:1.35;margin-bottom:8px}
  .run-intro h1{font-size:23px}
  .run-intro .run-intro-transcript{font-size:13px;line-height:1.4}
  body.run-intro-active #action-rail .run-transcript-toggle{font-size:13px;min-height:28px;padding-bottom:5px}
  .run-intro-footer{margin-top:6px;padding-top:4px}
  .run-totals{display:block}
  .run-totals p{margin-bottom:3px}
  .run-totals p:first-child{font-size:20px}
  .run-navigation{gap:14px}
  #recovery .recovery-actions{display:grid;grid-template-columns:1fr 1fr}
  #action-rail .recovery-actions button{min-width:0;width:100%;padding:10px 9px}
}
