.stallonism-console{position:relative;z-index:2;margin:35px 4% 55px;scroll-margin-top:110px;color:#d9e8e5}.console-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 15px}.console-heading .eyebrow{color:#82b7c7;margin:0;font-size:9px}.console-heading p{font-size:13px;margin:0;color:#a8b9bd}.console-machine{filter:drop-shadow(0 15px 25px #0009);border-radius:24px;overflow:hidden;background:#03090d}.console-crown{aspect-ratio:1672/190;background:url('/assets/stallonism-console.webp') center 16%/100% auto no-repeat}.console-screen{position:relative;isolation:isolate;overflow:hidden;margin:0 1.2%;padding:14px 4% 17px;min-height:158px;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(ellipse at center,#06491c 0,#012710 55%,#001508 100%);border:7px ridge #858b89;border-radius:12px;box-shadow:inset 0 0 0 2px #01e84a,inset 0 0 22px #00ef4280,0 0 10px #01c53550}.console-screen::before{content:'';position:absolute;inset:6px;z-index:-1;border:1px solid #2bff62;border-radius:6px;background:repeating-linear-gradient(0deg,transparent 0 3px,#00ff3710 3px 4px),repeating-linear-gradient(90deg,transparent 0 3px,#00ff3709 3px 4px);pointer-events:none}.console-screen::after{content:'';position:absolute;left:0;right:0;height:24px;top:-28px;background:linear-gradient(transparent,#3dff7214,transparent);pointer-events:none}.is-playing .console-screen::after{animation:console-scan 6s linear infinite}.is-playing .console-screen{box-shadow:inset 0 0 0 2px #33ff6b,inset 0 0 32px #00ef4290,0 0 13px #01c53570}.console-screen-meta{display:flex;justify-content:space-between;gap:12px;color:#74ed97;font:10px/1.5 ui-monospace,monospace;letter-spacing:.1em}.console-screen blockquote{font:700 clamp(19px,2.5vw,36px)/1.32 'Courier New',monospace;letter-spacing:.055em;text-transform:uppercase;color:#94ffa8;text-shadow:0 0 4px #2cfc59,0 0 12px #18ed355e;margin:15px auto;max-width:1080px;text-align:center;overflow-wrap:anywhere}.console-screen blockquote.is-changing{animation:console-refresh .3s ease-out}.screen-decoration{display:block;text-align:center;font:8px monospace;letter-spacing:.15em;color:#3aff6b;opacity:.75}.console-controls{aspect-ratio:1672/280;background:url('/assets/stallonism-console.webp') center 77%/100% auto no-repeat;display:grid;grid-template-columns:repeat(5,1fr);padding:0 10.4%}.console-controls button{position:relative;appearance:none;border:0;border-radius:28%;background:transparent;cursor:pointer;color:#a4ffac;min-width:0;min-height:64px;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.console-controls button::before{content:'';position:absolute;left:14%;right:14%;top:11%;bottom:31%;border-radius:50%;transition:background .15s,box-shadow .15s}.console-controls button:hover::before,.console-controls button:active::before,.console-controls button.is-held::before{background:#30ff681f;box-shadow:inset 0 0 15px #56ff6680,0 0 20px #30ff6860}.console-controls button:focus-visible{outline:2px solid #6fffb8;outline-offset:-5px}.console-controls button[aria-pressed=true]::before{box-shadow:inset 0 0 10px #5cff9b66}.console-controls button span{position:absolute;bottom:25%;left:7%;right:7%;font:700 clamp(8px,1.4vw,20px)/1.2 'Courier New',monospace;text-shadow:0 0 5px #2dff55;background:#07100a;border:1px solid #6c776b;padding:2px 0}.console-information{border:1px solid #244345;background:linear-gradient(110deg,#0b1a1eee,#09120fea);padding:25px 28px;display:grid;grid-template-columns:1fr 1.7fr;gap:12px 35px;margin:18px 0;border-radius:8px}.console-information div>span{font:10px/1.5 Arial,sans-serif;color:#73c3a2;letter-spacing:.18em}.console-information p{font:17px/1.6 Georgia,serif;margin:8px 0 0}.console-information .console-chapter{grid-column:1/-1;font:10px/1.6 Arial,sans-serif;color:#83a5ac;letter-spacing:.1em;text-transform:uppercase;border-top:1px solid #345049;padding-top:12px}.console-options{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap}.console-options label{display:flex;flex-direction:column;gap:8px;font:11px Arial,sans-serif;color:#9eb7bb}.console-options select,.console-tools button{min-height:44px;border:1px solid #36585c;background:#0b171b;color:#cfe7e1;border-radius:4px;font:11px/1.5 Arial,sans-serif;padding:10px 13px}.console-options select{max-width:min(390px,100%);width:100%;color-scheme:dark}.console-tools{display:flex;flex-wrap:wrap;gap:8px}.console-tools button:hover,.console-tools button[aria-pressed=true]{border-color:#42ef82;color:#9affb4;background:#0c281b}.stallonism-console button:focus-visible,.stallonism-console select:focus-visible,.stallonism-console summary:focus-visible{outline:2px solid #71ffc1;outline-offset:3px}.console-help,.console-status{font:11px/1.7 Arial,sans-serif;color:#8da5a6;margin:15px 0 0}.console-status{color:#88d7b3;min-height:19px;margin-top:6px}.console-review{border-top:1px solid #314442;margin-top:18px;padding-top:16px;font:12px/1.7 Arial,sans-serif;color:#99b3b2}.console-review summary{cursor:pointer;color:#b0d3c4}.console-review a{color:#97ebba;text-decoration:underline}.console-review #engine-review-list{max-height:470px;overflow:auto;margin-top:20px;padding-right:15px}.console-review article{padding:15px 0;border-top:1px solid #263e35}.console-review article blockquote{margin:8px 0;font:18px/1.6 Georgia,serif;color:#dbebe1}.console-review article p{margin:4px 0}.console-review article small{color:#82aa9f}.console-invitation{text-align:center;max-width:790px;margin:45px auto 5px}.console-invitation h3{font:18px/1.5 Arial,sans-serif;letter-spacing:.15em;color:#c6ac80;margin-bottom:16px}.console-invitation p{font:20px/1.7 Georgia,serif}.console-invitation .actions{justify-content:center;margin-top:25px}.console-invitation .button{font-size:11px}.desktop-nav .nav-engine{font-size:9px;letter-spacing:.07em}@keyframes console-scan{to{top:100%}}@keyframes console-refresh{from{opacity:.35;filter:blur(1px)}to{opacity:1;filter:blur(0)}}@media(max-width:750px){.stallonism-console{margin:28px 4% 40px}.console-heading{display:block}.console-heading p{margin-top:9px;font-size:12px}.console-machine{border-radius:10px}.console-screen{min-height:190px;padding:12px 5%;border-width:4px;margin:0 1%}.console-screen blockquote{font-size:clamp(17px,3.3vw,25px);letter-spacing:.025em;margin:15px auto}.console-screen-meta{font-size:8px;letter-spacing:0}.console-controls{min-height:83px;background-size:100% 336%;background-position:center 77%;padding:0 6%}.console-controls button span{font-size:9px;bottom:24%;left:1%;right:1%;padding:3px 0}.console-information{grid-template-columns:1fr;padding:18px;gap:15px}.console-information p{font-size:17px}.console-options{align-items:stretch;flex-direction:column}.console-options label{width:100%}.console-options select{max-width:100%}.console-tools{display:grid;grid-template-columns:1fr 1fr}.console-invitation{margin-top:32px}.console-invitation p{font-size:18px}.console-invitation .actions{flex-direction:column}.console-invitation .button{white-space:normal}}@media(prefers-reduced-motion:reduce){.console-screen::after,.console-screen blockquote.is-changing{animation:none!important}.console-controls button::before{transition:none}}
/* Keep the device separate from the hero portrait. */
.stallonism-console{background:radial-gradient(ellipse at top,#152431,#080f14 60%);padding:38px 3% 36px;border:1px solid #23353f;border-radius:12px;margin-top:45px}.console-heading .eyebrow{font-size:clamp(13px,1.5vw,19px);letter-spacing:.12em;color:#adcfe0}.console-heading{align-items:start}.console-heading p{max-width:330px}@media(max-width:750px){.stallonism-console{padding:22px 2.5%;margin-top:28px}.console-heading{padding:0 2%}.console-heading .eyebrow{font-size:14px}}
@media(max-width:750px){.console-controls{width:100%;height:83px;aspect-ratio:auto;min-height:83px;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 5%}.console-controls button{width:100%;min-width:0}.console-controls button span{font-size:8px;letter-spacing:-.04em}}

/* 1976 dashboard radio — deliberately quieter than the book covers above it. */
.stallonism-console{
  max-width:1120px;
  margin:44px auto 55px;
  padding:26px clamp(16px,4vw,42px) 30px;
  border:1px solid #66594366;
  border-radius:6px;
  background:linear-gradient(180deg,#211f1a 0%,#171814 55%,#171814 100%);
  color:var(--cream);
}
.console-heading{max-width:820px;margin:0 auto 21px;align-items:center;gap:18px}
.console-heading .eyebrow{font:700 11px/1.6 Arial,sans-serif;color:#c8ab81;letter-spacing:.14em;margin:0}
.console-heading p{font-size:12px;line-height:1.5;max-width:350px;color:#b8afa1}
.console-machine{
  position:relative;
  display:grid;
  grid-template-columns:84px minmax(0,1fr) 84px;
  grid-template-rows:25px minmax(104px,auto) 40px;
  width:min(100%,720px);
  margin:0 auto 17px;
  padding:1px 4px 4px;
  overflow:visible;
  border:2px solid #9b9080;
  border-radius:10px;
  background:
    linear-gradient(170deg,#d7c9b2 0%,#5d554c 5%,#252422 10%,#191916 76%,#645a50 97%,#aaa08f 100%);
  box-shadow:inset 0 0 0 2px #0c0c0b,0 11px 16px #0008;
  filter:none;
}
.console-machine::before,.console-machine::after{
  content:'';
  display:block;
  width:55px;
  height:55px;
  align-self:center;
  justify-self:center;
  border-radius:50%;
  border:3px solid #100f0d;
  background:
    radial-gradient(circle at 36% 27%,#eee7d9 0%,#a69c8c 19%,#554e45 53%,#aba294 76%,#282624 100%);
  box-shadow:0 0 0 2px #9e9687,0 0 0 6px #151514,inset 1px 1px 7px #ffffff7a,2px 4px 7px #000b;
}
.console-machine::before{grid-column:1;grid-row:2}
.console-machine::after{grid-column:3;grid-row:2}
.console-crown{
  grid-column:1/-1;
  grid-row:1;
  height:auto;
  aspect-ratio:auto;
  display:flex;
  justify-content:center;
  align-items:center;
  background:none;
}
.console-crown::before{
  content:'STALLONISM';
  font:bold 13px/1 Georgia,serif;
  letter-spacing:.13em;
  color:#8d3029;
  text-shadow:0 1px 0 #d2c4b1;
}
.console-screen{
  grid-column:2;
  grid-row:2;
  min-width:0;
  min-height:104px;
  margin:0;
  padding:10px 15px 9px;
  border:3px solid #17130e;
  border-radius:6px;
  background:radial-gradient(ellipse at center,#6d2b04 0%,#401805 65%,#1e0b03 100%);
  box-shadow:inset 0 0 0 2px #a14f16,inset 0 0 21px #e16b1b80,0 0 4px #b75a14a1;
}
.console-screen::before{
  inset:4px;
  border:1px solid #f6a03e46;
  border-radius:2px;
  background:repeating-linear-gradient(0deg,transparent 0 3px,#f89f1410 3px 4px);
}
.console-screen::after,.is-playing .console-screen::after{display:none;animation:none}
.is-playing .console-screen{box-shadow:inset 0 0 0 2px #bf6a25,inset 0 0 25px #f08a2888,0 0 6px #c15e18b3}
.console-screen-meta{color:#f2ac60;font:8px/1.4 'Courier New',monospace;letter-spacing:.06em}
.console-screen blockquote{
  font:700 clamp(15px,1.8vw,23px)/1.24 'Courier New',monospace;
  letter-spacing:.035em;
  text-transform:uppercase;
  text-align:center;
  max-width:100%;
  margin:8px auto 6px;
  color:#ffc574;
  text-shadow:0 0 4px #f6a138,0 0 9px #d77428a6;
  overflow-wrap:anywhere;
}
.console-screen blockquote.is-long{font-size:clamp(13px,1.6vw,18px);letter-spacing:.01em}
.console-screen blockquote.is-very-long{font-size:clamp(12px,1.35vw,16px);letter-spacing:0}
.screen-decoration{display:none}
.console-controls{
  grid-column:2;
  grid-row:3;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:7px;
  width:auto;
  height:auto;
  min-height:0;
  aspect-ratio:auto;
  padding:3px 0 0;
  background:none;
}
.console-controls button{
  flex:0 0 37px;
  width:37px;
  min-width:37px;
  min-height:29px;
  height:29px;
  border:1px solid #a49a8a;
  border-radius:3px;
  background:linear-gradient(155deg,#a1998b,#504b43 48%,#1e1c1b 95%);
  box-shadow:0 2px 0 #0a0908,inset 1px 1px 0 #e5dcd044;
  touch-action:manipulation;
}
.console-controls button:hover,.console-controls button:active,.console-controls button[aria-pressed=true]{border-color:#e8b57a;background:linear-gradient(150deg,#bfb5a7,#5e564b 60%,#292521)}
.console-controls button::before{display:none}
.console-controls button span{
  position:static;
  display:block;
  padding:0;
  border:0;
  background:none;
  color:transparent;
  font-size:0;
  text-shadow:none;
}
.console-controls button span::after{font:700 17px/1 Arial,sans-serif;color:#191713;text-shadow:0 1px 0 #e9daca55}
#engine-back span::after{content:'↤'}
#engine-prev span::after{content:'◀'}
#engine-play span::after{content:'▶'}
#engine-pause span::after{content:'Ⅱ'}
#engine-next span::after{content:'▶▶';font-size:12px}
.console-controls button:focus-visible{outline:2px solid #f6b35e;outline-offset:3px}
.console-information{
  max-width:760px;
  margin:0 auto 15px;
  padding:16px 18px;
  grid-template-columns:1fr 1.4fr;
  gap:9px 22px;
  border:1px solid #64523977;
  border-radius:4px;
  background:#1d1d18;
}
.console-information div>span{color:#c1a077;font-size:9px}
.console-information p{font-size:14px;line-height:1.55;margin-top:4px}
.console-information .console-chapter{font-size:9px;color:#ad9c87;border-color:#63574355;padding-top:8px}
.console-options,.console-help,.console-status,.console-review{max-width:760px;margin-left:auto;margin-right:auto}
.console-options label{color:#baa98d}
.console-options select,.console-tools button{background:#25241f;border:1px solid #75624d;color:#d5c8b6}
.console-tools button:hover,.console-tools button[aria-pressed=true]{border-color:#e3a65c;background:#35281b;color:#ffcf91}
.stallonism-console button:focus-visible,.stallonism-console select:focus-visible,.stallonism-console summary:focus-visible{outline-color:#edb36c}
.console-help,.console-status{color:#ad9f8a}
.console-status{color:#e6b46e}
.console-review{border-color:#5d4d37;color:#b7a994}
.console-review summary{color:#c8b08c}
.console-review a{color:#e7b96f}
.console-invitation{max-width:700px;margin:27px auto 0}
.console-invitation h3{font-size:14px;margin-bottom:12px}
.console-invitation p{font-size:16px;line-height:1.65}
.console-invitation .actions{margin-top:16px}
@media(max-width:750px){
  .stallonism-console{margin:28px 3% 36px;padding:19px 10px 25px}
  .console-heading{padding:0 6px;margin-bottom:14px}
  .console-heading .eyebrow{font-size:11px}
  .console-heading p{margin-top:5px;font-size:11px}
  .console-machine{grid-template-columns:52px minmax(0,1fr) 52px;grid-template-rows:22px minmax(98px,auto) 40px;border-radius:7px;padding:1px 1px 4px}
  .console-machine::before,.console-machine::after{width:33px;height:33px;border-width:2px;box-shadow:0 0 0 2px #968c7d,0 0 0 4px #151514,inset 1px 1px 5px #ffffff6b}
  .console-crown::before{font-size:10px}
  .console-screen{min-height:98px;padding:8px 7px 7px;border-width:2px}
  .console-screen-meta{font-size:7px;letter-spacing:0}
  .console-screen blockquote{font-size:clamp(13px,3vw,17px);line-height:1.24;letter-spacing:0;margin:8px auto}
  .console-screen blockquote.is-long{font-size:clamp(12px,2.5vw,15px)}
  .console-screen blockquote.is-very-long{font-size:clamp(11px,2.3vw,13px)}
  .console-controls{width:auto;height:auto;min-height:0;gap:6px;padding:3px 0 0;background:none}
  .console-controls button{flex-basis:32px;width:32px;min-width:32px;min-height:28px;height:28px}
  .console-controls button span{font-size:0;letter-spacing:0;bottom:auto;left:auto;right:auto;padding:0;border:0}
  .console-controls button span::after{font-size:14px}
  .console-information{grid-template-columns:1fr;padding:13px 16px;gap:9px}
  .console-information p{font-size:13px}
  .console-invitation{margin-top:21px}
  .console-invitation p{font-size:15px}
}
@media(max-width:400px){
  .console-machine{grid-template-columns:41px minmax(0,1fr) 41px}
  .console-machine::before,.console-machine::after{width:27px;height:27px}
  .console-controls{gap:4px}
  .console-controls button{flex-basis:28px;width:28px;min-width:28px}
}

/* The author's authentic radio reference, re-created as a photographic faceplate.
   Interactive hotspots are HTML links/buttons above the image, not part of the bitmap. */
.console-machine{
  display:block;
  position:relative;
  width:min(100%,880px);
  max-width:880px;
  aspect-ratio:3/1;
  height:auto;
  margin:0 auto 6px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent url('/assets/stallonism-radio-authentic.png') center/100% 100% no-repeat;
  box-shadow:none;
  filter:none;
}
.console-machine::before,.console-machine::after{display:none}
.console-crown{display:none}
.console-screen{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  left:29.4%;
  top:28.1%;
  width:41.2%;
  height:25%;
  min-width:0;
  min-height:0;
  padding:0 1%;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:hidden;
}
.console-screen::before,.console-screen::after,.is-playing .console-screen::after{display:none}
.is-playing .console-screen{box-shadow:none}
.console-screen-meta{display:none}
.console-screen blockquote,
.console-screen blockquote.is-long,
.console-screen blockquote.is-very-long{
  width:100%;
  max-width:100%;
  margin:0;
  font:800 clamp(12px,1.7vw,17px)/1.13 'Courier New',monospace;
  letter-spacing:0;
  color:#3e1c04;
  text-shadow:0 1px 1px #ffdc8366;
  text-align:center;
  overflow-wrap:anywhere;
}
.console-screen blockquote.is-long{font-size:clamp(11px,1.4vw,14px)}
.console-screen blockquote.is-very-long{font-size:clamp(10px,1.25vw,12px)}
.console-controls{
  position:absolute;
  left:26.6%;
  top:60.1%;
  width:46.8%;
  height:19.9%;
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:3.6%;
  padding:0;
  margin:0;
  min-height:0;
  aspect-ratio:auto;
  background:none;
}
.console-controls button{
  position:relative;
  flex:1 1 0;
  width:auto;
  min-width:0;
  height:100%;
  min-height:0;
  border:0;
  border-radius:6px;
  background:transparent;
  box-shadow:none;
  padding:0;
  touch-action:manipulation;
}
.console-controls button:hover,.console-controls button:active,.console-controls button[aria-pressed=true]{
  background:#ffb84c1d;
  box-shadow:inset 0 0 0 2px #ffca7e99;
  border-color:transparent;
}
.console-controls button::before{display:none}
.console-controls button span{
  position:static;
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  background:none;
  color:transparent;
  font-size:0;
  text-shadow:none;
}
.console-controls button span::after{
  font:700 clamp(10px,1.6vw,17px)/1 Arial,sans-serif;
  color:#d1c9bd;
  text-shadow:0 1px 2px #000;
}
#engine-back span::after{content:'↤'}
#engine-prev span::after{content:'◀'}
#engine-play span::after{content:'▶'}
#engine-pause span::after{content:'Ⅱ'}
#engine-next span::after{content:'▶▶';font-size:clamp(9px,1.2vw,14px)}
.radio-knob-link{
  display:block;
  position:absolute;
  z-index:3;
  top:30%;
  width:15%;
  height:42%;
  border-radius:50%;
  background:transparent;
  cursor:pointer;
}
#engine-book-knob{left:6.2%}
#engine-chapter-knob{right:6.2%}
.radio-knob-link:hover,.radio-knob-link:focus-visible{
  outline:3px solid #ffc16a;
  outline-offset:1px;
  box-shadow:0 0 16px #ffba5366;
}
.radio-knob-guide{
  max-width:880px;
  margin:1px auto 17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.radio-knob-guide a{
  font:700 10px/1.6 Arial,sans-serif;
  letter-spacing:.09em;
  color:#c4a681;
  border-bottom:1px solid #a7896155;
  padding:3px 0;
}
.radio-knob-guide a:hover{color:#ffe0ad}
.radio-full-quote{display:none}
@media(max-width:700px){
  .console-machine{max-width:100%;aspect-ratio:3/1}
  .console-screen{top:28.5%;height:24.5%;padding:0 1.2%}
  .console-screen blockquote,
  .console-screen blockquote.is-long,
  .console-screen blockquote.is-very-long{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    font-size:clamp(9px,1.9vw,13px);
    line-height:1.1;
  }
  .console-controls{left:26.8%;top:58.5%;width:46.5%;height:24%;gap:3%}
  .console-controls button{min-height:30px;transform:translateY(-2px)}
  .console-controls button span::after{font-size:clamp(10px,2vw,14px)}
  .radio-knob-guide{gap:10px;margin-top:6px;flex-wrap:wrap}
  .radio-knob-guide a{font-size:9px;letter-spacing:0}
  .radio-full-quote{
    display:block;
    max-width:760px;
    margin:7px auto 16px;
    font:italic 18px/1.5 Georgia,serif;
    color:#f4c18a;
    border-left:2px solid #c6843a;
    padding:9px 14px;
  }
}
@media(max-width:420px){
  .console-controls button{min-height:26px;transform:translateY(-3px)}
  .console-controls button span::after{font-size:10px}
  .radio-knob-guide a{font-size:8px}
  .radio-full-quote{font-size:16px}
}

/* On phones, preserve the intended dark lettering on the amber radio. */
@media(max-width:700px){
  .console-screen blockquote,
  .console-screen blockquote.is-long,
  .console-screen blockquote.is-very-long{
    color:#080808!important;
    -webkit-text-fill-color:#080808!important;
    text-shadow:none!important;
  }
  .radio-full-quote{
    color:#101010;
    -webkit-text-fill-color:#101010;
    background:linear-gradient(145deg,#f7d19a,#e7ac65);
    border-left:3px solid #a95725;
    border-radius:5px;
    font-style:normal;
    font-weight:700;
  }
}
