/* The forbidden button opens a self-contained 2017 BitConnect parody. */
.retro-only { display: none !important; }
.broadcast-button > b { font-size: .76rem; line-height: 1.35; letter-spacing: .04em; }
.forbidden-label { display: block; margin-top: 7px; color: inherit; opacity: .6; font: .48rem/1.5 var(--mono); letter-spacing: .08em; text-align: center; pointer-events: none; }

/* Time-travel dialog. */
.retro-boot {
  width: min(380px, calc(100vw - 28px));
  max-height: calc(100svh - 28px);
  margin: auto;
  padding: 4px;
  overflow: auto;
  color: #171717;
  background: #ece9d8;
  border: 3px solid #0755d9;
  border-radius: 8px 8px 3px 3px;
  box-shadow: 0 18px 60px #0009, inset 0 0 0 1px #fff8;
  font: 13px/1.45 Tahoma, Arial, Helvetica, sans-serif;
}
.retro-boot::backdrop { background: #020918cc; backdrop-filter: blur(2px); }
.retro-boot:not([open]) { display: none; }
.retro-boot-title { margin: -2px -2px 0; padding: 6px 8px; border-radius: 5px 5px 0 0; background: linear-gradient(#3f9bff 0%, #0866e6 15%, #0050cf 68%, #003caa 100%); color: #fff; font-weight: bold; text-shadow: 1px 1px #00398f; }
.retro-boot-body { padding: 18px 15px 13px; }
.retro-boot-body strong { display: block; margin-bottom: 5px; color: #c81e28; font: 800 17px/1.25 Arial, sans-serif; }
.retro-boot-body p { margin: 0 0 12px; }
.retro-boot progress { display: block; width: 100%; height: 21px; margin: 13px 0 16px; border: 2px inset #fff; border-radius: 1px; background: #fff; accent-color: #37a329; }
.retro-boot progress::-webkit-progress-bar { background: #fff; }
.retro-boot progress::-webkit-progress-value { background: repeating-linear-gradient(90deg, #45bd35 0 11px, #8bdd73 11px 14px); }
.retro-boot progress::-moz-progress-bar { background: repeating-linear-gradient(90deg, #45bd35 0 11px, #8bdd73 11px 14px); }
.retro-boot button { display: block; min-width: 126px; min-height: 42px; margin: 0 auto; border: 1px solid #003c74; border-radius: 3px; background: linear-gradient(#fff, #ece9d8 72%, #d5d2c2); color: #222; box-shadow: inset 0 0 0 1px #fff; font: 700 12px Tahoma, Arial, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.retro-boot button:active { background: #d5d2c2; }
.retro-boot button:focus-visible { outline: 2px solid #0753a4; outline-offset: 2px; }

body.retro-mode {
  margin: 0;
  padding: 0;
  min-width: 320px;
  color: #303642;
  background: #edf1f5;
  color-scheme: light;
  font: 15px/1.55 Arial, Helvetica, sans-serif;
  overflow-anchor: none;
}
body.retro-mode .retro-only { display: block !important; }
body.retro-mode > .topbar,
body.retro-mode > main,
body.retro-mode > .site-footer,
body.retro-mode > .noise,
body.retro-mode > .cursor-glow { display: none !important; }
body.retro-mode *, body.retro-mode *::before, body.retro-mode *::after { box-sizing: border-box; scroll-behavior: auto; }
body.retro-mode :where(button, a):focus-visible { outline: 3px solid #ffd233; outline-offset: 3px; }

/* Fake Internet Exploder chrome, intentionally ugly in a very specific way. */
body.retro-mode .retro-toolbar {
  position: sticky;
  z-index: 100;
  top: 0;
  width: 100%;
  padding: 0 3px 3px;
  border: 1px solid #003caa;
  border-top: 0;
  border-radius: 7px 7px 0 0;
  background: #ece9d8;
  color: #111;
  box-shadow: 0 2px 5px #0004;
  font: 12px/1.2 Tahoma, Arial, Helvetica, sans-serif;
}
.retro-titlebar { min-height: 32px; display: flex; align-items: center; gap: 8px; margin: 0 -3px; padding: 3px 4px 3px 8px; border-radius: 7px 7px 0 0; background: linear-gradient(#3f9bff 0%, #0866e6 14%, #0050cf 64%, #003cac 100%); color: #fff; box-shadow: inset 0 1px #79b9ff, inset 0 -1px #002c8b; font-weight: bold; text-shadow: 1px 1px #00358c; }
.retro-titlebar img { flex: 0 0 18px; width: 18px; height: 18px; }
.retro-titlebar > span { display: flex; flex: 1; min-width: 0; align-items: center; gap: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.retro-return { flex: 0 0 auto; min-height: 27px; padding: 3px 11px 3px 8px; border: 1px solid #fff; border-radius: 5px; background: linear-gradient(135deg, #a9ed94 0%, #4caf38 35%, #2e8b22 72%, #58bb43 100%); color: #fff; box-shadow: inset 0 0 0 1px #1d6f16, 0 1px #002a83; font: 700 10px Tahoma, Arial, sans-serif; letter-spacing: .01em; text-shadow: 1px 1px #1d5c17; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.retro-return b { display: inline-block; margin-right: 5px; color: #fff; font-size: 15px; vertical-align: -1px; }
.retro-return:active { background: #287a1e; }
.retro-menubar { min-height: 26px; display: flex; align-items: center; gap: 17px; margin-top: 1px; padding: 0 8px; border-bottom: 1px solid #aca899; background: #ece9d8; }
.retro-menubar .retro-version { margin-left: auto; color: #777; font: 10px "Courier New", monospace; }
.retro-addressbar { min-height: 35px; display: flex; align-items: center; gap: 7px; margin: 0 -1px; padding: 3px 6px; border-top: 1px solid #fff; background: linear-gradient(90deg, #eef4fd, #d9e8fb); }
.retro-addressbar code { display: block; flex: 1; min-width: 0; padding: 4px 7px 4px 24px; overflow: hidden; border: 1px solid #7f9db9; background: #fff radial-gradient(circle at 12px 50%, #45ae32 0 4px, #fff 4.5px); color: #222; font: 12px/1.35 Tahoma, Arial, sans-serif; white-space: nowrap; text-overflow: ellipsis; }
.retro-sound { min-height: 27px; padding: 0 8px; border: 1px solid #2f721f; border-radius: 3px; background: linear-gradient(#a6eb8e, #3fa12d); color: #10390b; box-shadow: inset 0 1px #d9ffce; font: 700 9px Tahoma, Arial, sans-serif; text-shadow: 0 1px #caffbd; cursor: pointer; }

.retro-quick-exit {
  position: fixed;
  z-index: 120;
  right: 18px;
  bottom: 18px;
  min-height: 50px;
  padding: 0 18px;
  border: 2px solid #fff;
  border-radius: 5px;
  background: linear-gradient(#3f9bff 0%, #0866e6 18%, #0050cf 70%, #003caa 100%);
  color: #fff;
  box-shadow: 0 5px 18px #001d5790, inset 0 1px #8fc5ff;
  font: 700 11px Tahoma, Arial, sans-serif;
  letter-spacing: .02em;
  text-shadow: 1px 1px #00358c;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.retro-quick-exit span { margin-right: 5px; font-size: 17px; vertical-align: -1px; }
.retro-quick-exit:hover { filter: brightness(1.12); }
.retro-quick-exit:active { transform: translateY(2px); }

/* Dedicated 2017 page. Nothing below styles the real website. */
.retro-site { min-height: 100vh; overflow: hidden; background: #f4f6f8; color: #363b43; }
.retro2017-shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
.retro2017-topline { background: #263544; color: #cbd3dc; font-size: 10px; letter-spacing: .08em; }
.retro2017-topline .retro2017-shell { min-height: 31px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.retro2017-login { color: #f7a11a; font-weight: 700; }

.retro2017-header { position: relative; z-index: 2; background: #fff; border-bottom: 1px solid #dce2e8; box-shadow: 0 2px 10px #1c2e4415; }
.retro2017-header-inner { min-height: 91px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.retro2017-logo { width: 242px; height: 54px; overflow: hidden; flex: 0 0 242px; }
.retro2017-logo img { display: block; width: 324px; max-width: none; height: 54px; object-fit: fill; object-position: left center; }
.retro2017-nav { display: flex; align-items: stretch; gap: 2px; color: #3f4852; font-size: 11px; font-weight: 800; }
.retro2017-nav span { position: relative; padding: 35px 11px 33px; cursor: default; }
.retro2017-nav span:first-child { color: #ef7e16; }
.retro2017-nav span:first-child::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 21px; height: 2px; background: #ef7e16; }

.retro2017-hero { position: relative; min-height: 515px; overflow: hidden; color: #fff; background: linear-gradient(125deg, #123963 0%, #126ab1 48%, #0a81bf 100%); }
.retro2017-hero::before { content: ""; position: absolute; width: 700px; height: 700px; right: -260px; top: -340px; border: 120px solid #fff0; border-left-color: #fff0b; transform: rotate(32deg); }
.retro2017-hero::after { content: ""; position: absolute; width: 560px; height: 560px; left: -390px; bottom: -420px; border: 90px solid #39a0d933; transform: rotate(24deg); }
.retro2017-grid { position: absolute; inset: 0; opacity: .17; background-image: linear-gradient(#fff 1px, transparent 1px), linear-gradient(90deg, #fff 1px, transparent 1px); background-size: 54px 54px; transform: perspective(500px) rotateX(58deg) scale(1.8) translateY(180px); transform-origin: bottom; }
.retro2017-hero-inner { position: relative; z-index: 1; min-height: 515px; display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: center; gap: 70px; padding: 62px 0; }
.retro2017-kicker, .retro2017-section-label { margin: 0 0 12px; color: #ffad2f; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.retro2017-pitch h1 { margin: 0; max-width: 700px; font: 900 clamp(40px, 5.4vw, 66px)/.96 Arial, Helvetica, sans-serif; letter-spacing: -.055em; text-shadow: 0 3px 0 #073565; }
.retro2017-pitch h1 span { color: #ff9a1b; }
.retro2017-lede { max-width: 680px; margin: 22px 0 0; color: #dceaf7; font-size: 16px; line-height: 1.65; }
.retro2017-cta-row { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 27px; }
.retro2017-cta { min-height: 49px; padding: 0 22px; border: 0; border-radius: 2px; color: #fff; box-shadow: inset 0 1px #ffffff70, 0 3px 0 #0004; font: 900 11px Arial, Helvetica, sans-serif; letter-spacing: .06em; cursor: pointer; text-shadow: 0 1px #0004; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.retro2017-cta:hover { filter: brightness(1.08); }
.retro2017-cta:active { transform: translateY(2px); box-shadow: inset 0 1px #ffffff55, 0 1px 0 #0005; }
.retro2017-cta-primary, .retro2017-cta-orange { background: linear-gradient(#ffb52d, #f0780c); border: 1px solid #df6d08; }
.retro2017-cta-secondary { background: linear-gradient(#268fd2, #095494); border: 1px solid #074a82; }
.retro2017-action-message { min-height: 1.5em; margin: 12px 0 0; color: #b8d9f2; font-size: 11px; }
.retro2017-offer { position: relative; min-height: 372px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 35px 23px 27px; overflow: hidden; border: 5px solid #fff; border-radius: 50%; background: radial-gradient(circle at 35% 27%, #fff 0 4%, #eaf6ff 25%, #95cef1 51%, #1765a6 52%, #0b477d 100%); box-shadow: 0 12px 40px #001f4380, inset 0 0 0 8px #ffffff30; text-align: center; transform: rotate(2deg); }
.retro2017-offer::after { content: ""; position: absolute; inset: 20px; border: 1px dashed #fff8; border-radius: 50%; }
.retro2017-offer img { position: relative; z-index: 1; width: 93px; height: 93px; object-fit: contain; filter: drop-shadow(0 7px 7px #00305f88); animation: retro2017Float 2.4s ease-in-out infinite; }
.retro2017-offer > span { position: relative; z-index: 1; margin-top: 5px; color: #123d67; font-size: 12px; font-weight: 900; letter-spacing: .14em; }
.retro2017-offer strong { position: relative; z-index: 1; margin-top: -1px; color: #ee6f0b; font: 900 42px/.95 Arial, sans-serif; letter-spacing: -.07em; text-shadow: 0 2px #fff; }
.retro2017-offer b { position: relative; z-index: 1; color: #fff; font-size: 29px; line-height: 1; text-shadow: 0 2px #073862; }
.retro2017-offer small { position: relative; z-index: 1; max-width: 195px; margin-top: 14px; color: #dceeff; font-size: 9px; line-height: 1.35; }
.retro2017-ribbon { position: absolute; z-index: 2; top: 33px; right: -42px; width: 190px; padding: 7px 0; background: #e84a3d; color: #fff; font: 900 9px Arial, sans-serif; letter-spacing: .08em; transform: rotate(39deg); }

.retro2017-ticker { overflow: hidden; border-top: 1px solid #ffd574; border-bottom: 1px solid #b75c07; background: linear-gradient(#ffb62a, #ef7b0b); color: #fff; box-shadow: inset 0 1px #fff5; font: 900 11px/36px Arial, sans-serif; white-space: nowrap; }
.retro2017-ticker > div { display: inline-flex; min-width: 200%; justify-content: space-around; gap: 70px; animation: retro2017Ticker 20s linear infinite; }

.retro2017-proof { padding: 67px 0 72px; background: #fff; text-align: center; }
.retro2017-proof h2, .retro2017-plans h2, .retro2017-matrix h2 { margin: 0; color: #243445; font: 800 clamp(29px, 3.5vw, 43px)/1.12 Arial, sans-serif; letter-spacing: -.035em; }
.retro2017-proof h2 span, .retro2017-matrix h2 span { color: #1671b8; }
.retro2017-numbers { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 37px; border: 1px solid #dbe2e8; box-shadow: 0 8px 30px #233a5012; }
.retro2017-numbers article { min-height: 135px; display: flex; flex-direction: column; justify-content: center; padding: 20px 10px; border-right: 1px solid #dbe2e8; background: linear-gradient(#fff, #f4f7f9); }
.retro2017-numbers article:last-child { border-right: 0; }
.retro2017-numbers strong { color: #ef7e16; font: 900 clamp(27px, 3.2vw, 43px)/1 Arial, sans-serif; letter-spacing: -.055em; }
.retro2017-numbers span { margin-top: 10px; color: #66717c; font-size: 10px; font-weight: 900; letter-spacing: .14em; }

.retro2017-plans { padding: 70px 0 78px; background: #edf2f6; text-align: center; }
.retro2017-plans .retro2017-section-label { color: #1671b8; }
.retro2017-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); align-items: stretch; gap: 19px; margin-top: 39px; }
.retro2017-plan-grid article { position: relative; min-height: 365px; display: flex; flex-direction: column; align-items: center; padding: 37px 27px 28px; border: 1px solid #d6dde4; border-top: 5px solid #1b72b2; background: #fff; box-shadow: 0 8px 20px #193c5c12; }
.retro2017-plan-grid article.is-featured { border-top-color: #ef7e16; transform: translateY(-9px); box-shadow: 0 15px 33px #193c5c26; }
.retro2017-plan-grid article > span { position: absolute; top: 13px; right: 16px; color: #dce3e9; font-size: 28px; font-weight: 900; }
.retro2017-icon { width: 72px; height: 72px; display: grid; place-items: center; border: 3px solid #cae1f2; border-radius: 50%; background: #eaf5fd; color: #1874b7; font: 900 31px/1 Arial, sans-serif; }
.retro2017-plan-grid .is-featured .retro2017-icon { border-color: #ffd8b6; background: #fff0e2; color: #ef7e16; }
.retro2017-plan-grid h3 { margin: 20px 0 10px; color: #243445; font-size: 16px; }
.retro2017-plan-grid p { margin: 0; color: #707983; font-size: 13px; line-height: 1.7; }
.retro2017-plan-grid b { width: 100%; margin-top: auto; padding-top: 22px; border-top: 1px solid #e4e9ed; color: #1671b8; font-size: 10px; letter-spacing: .12em; }
.retro2017-plan-grid .is-featured b { color: #ef7e16; }

.retro2017-matrix { padding: 75px 0; color: #d6e7f6; background: linear-gradient(130deg, #102b49, #154e7c); }
.retro2017-matrix-inner { display: grid; grid-template-columns: minmax(360px, .9fr) minmax(0, 1.1fr); align-items: center; gap: 75px; }
.retro2017-matrix h2 { color: #fff; }
.retro2017-matrix h2 span { color: #ff9820; }
.retro2017-matrix p:not(.retro2017-section-label) { max-width: 580px; margin: 20px 0 25px; color: #bfd3e5; line-height: 1.75; }
.retro2017-pyramid { display: grid; gap: 15px; padding: 25px; }
.retro2017-pyramid > div { display: flex; justify-content: center; gap: 18px; }
.retro2017-pyramid span { position: relative; min-width: 86px; min-height: 57px; display: grid; place-items: center; border: 2px solid #83bde5; background: linear-gradient(#2589cb, #115889); color: #fff; box-shadow: 0 6px 0 #071f34; font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.retro2017-pyramid > div:first-child span { min-width: 120px; border-color: #ffbe63; background: linear-gradient(#ffad31, #e96f08); box-shadow: 0 6px 0 #813500; }
.retro2017-pyramid > div:not(:last-child) span::after { content: ""; position: absolute; left: 50%; bottom: -17px; width: 1px; height: 15px; background: #83bde5; }

.retro2017-testimonials { padding: 65px 0 75px; background: #fff; text-align: center; }
.retro2017-quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 31px; }
.retro2017-quotes blockquote { position: relative; margin: 0; padding: 29px 25px 24px; border: 1px solid #dce2e7; background: #f7f9fa; color: #535d67; font: italic 15px/1.7 Georgia, serif; }
.retro2017-quotes blockquote::before { content: "“"; position: absolute; top: -3px; left: 13px; color: #f08a24; font: 58px/1 Georgia, serif; }
.retro2017-quotes cite { display: block; margin-top: 18px; color: #1370b4; font: 800 9px/1.4 Arial, sans-serif; letter-spacing: .06em; }

.retro2017-footer { padding: 45px 0 48px; border-top: 5px solid #f18a21; background: #182532; color: #aab4be; text-align: center; }
.retro2017-footer strong { color: #fff; font-size: 23px; letter-spacing: -.03em; }
.retro2017-footer p { max-width: 870px; margin: 17px auto 9px; color: #d5dbe0; font-size: 12px; font-weight: 700; line-height: 1.65; }
.retro2017-footer small { color: #7f8b95; font-size: 10px; }

@keyframes retro2017Float { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-8px) rotate(3deg); } }
@keyframes retro2017Ticker { to { transform: translateX(-50%); } }

@media (max-width: 860px) {
  .retro2017-header-inner { min-height: 78px; flex-direction: column; justify-content: center; gap: 7px; padding: 10px 0 0; }
  .retro2017-logo { width: 216px; height: 48px; flex: 0 0 48px; }
  .retro2017-logo img { width: 288px; height: 48px; }
  .retro2017-nav { width: 100%; justify-content: center; overflow-x: auto; }
  .retro2017-nav span { flex: 0 0 auto; padding: 12px 8px 14px; }
  .retro2017-nav span:first-child::after { bottom: 6px; }
  .retro2017-hero-inner { grid-template-columns: minmax(0, 1fr) 260px; gap: 35px; }
  .retro2017-offer { min-height: 290px; }
  .retro2017-offer img { width: 74px; height: 74px; }
  .retro2017-offer strong { font-size: 33px; }
  .retro2017-matrix-inner { grid-template-columns: 1fr; gap: 40px; text-align: center; }
  .retro2017-matrix p:not(.retro2017-section-label) { margin-left: auto; margin-right: auto; }
}

@media (max-width: 640px) {
  .retro-titlebar { min-height: 39px; padding-left: 6px; }
  .retro-titlebar > span { font-size: 10px; }
  .retro-return { min-height: 34px; padding: 4px 8px 4px 6px; font-size: 9px; }
  .retro-menubar { gap: 12px; font-size: 10px; }
  .retro-menubar .retro-version { display: none; }
  .retro-addressbar { gap: 6px; font-size: 10px; }
  .retro-addressbar code { font-size: 11px; }
  .retro-sound { padding: 0 5px; font-size: 8px; }
  .retro-quick-exit { right: 10px; bottom: 10px; min-height: 48px; padding: 0 13px; font-size: 10px; }
  .retro2017-shell { width: min(100% - 26px, 1120px); }
  .retro2017-topline .retro2017-shell { min-height: 35px; justify-content: center; text-align: center; }
  .retro2017-topline .retro2017-shell > span:first-child { display: none; }
  .retro2017-header-inner { width: 100%; }
  .retro2017-nav { justify-content: flex-start; padding: 0 8px; }
  .retro2017-hero-inner { min-height: 0; grid-template-columns: 1fr; gap: 37px; padding: 48px 0 55px; text-align: center; }
  .retro2017-pitch h1 { font-size: clamp(38px, 12vw, 54px); }
  .retro2017-lede { font-size: 14px; }
  .retro2017-cta-row { justify-content: center; }
  .retro2017-cta { width: min(100%, 290px); }
  .retro2017-offer { width: min(310px, 92vw); min-height: 310px; justify-self: center; }
  .retro2017-ticker > div { min-width: 430%; }
  .retro2017-proof, .retro2017-plans, .retro2017-matrix, .retro2017-testimonials { padding-top: 53px; padding-bottom: 58px; }
  .retro2017-numbers { grid-template-columns: repeat(2, 1fr); }
  .retro2017-numbers article:nth-child(2) { border-right: 0; }
  .retro2017-numbers article:nth-child(-n+2) { border-bottom: 1px solid #dbe2e8; }
  .retro2017-plan-grid, .retro2017-quotes { grid-template-columns: 1fr; }
  .retro2017-plan-grid article, .retro2017-plan-grid article.is-featured { min-height: 315px; transform: none; }
  .retro2017-pyramid { padding: 10px 0; }
  .retro2017-pyramid > div { gap: 7px; }
  .retro2017-pyramid span { min-width: 0; width: 23%; min-height: 51px; padding: 3px; font-size: 7px; }
  .retro2017-pyramid > div:nth-child(2) span { width: 34%; }
  .retro2017-pyramid > div:first-child span { width: 43%; min-width: 0; }
}

@media (max-width: 390px) {
  .retro-addressbar > span { display: none; }
  .retro-titlebar img { display: none; }
  .retro-return b { margin-right: 3px; font-size: 12px; }
  .retro2017-pitch h1 { font-size: 36px; }
  .retro2017-cta { padding: 0 14px; }
  .retro2017-numbers strong { font-size: 27px; }
  .retro2017-numbers span { font-size: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  body.retro-mode *, body.retro-mode *::before, body.retro-mode *::after { animation: none !important; }
}
