/* ============================================================
   RAISE — PRESALE.EXE, the money thermometer on the desk.
   A Win95 tabbed dialog where every tab is a milestone: there
   is no cap, so the finish line simply moves to the next tab.
   ============================================================ */

#raise {
  position: absolute;
  /* centred, 600px wide, but never closer than 270px to either edge (Now Playing lives right) */
  left: 50%; margin-left: calc(-1 * min(300px, 50% - 270px)); top: 12px;
  width: min(600px, 100% - 540px);
  background: #c0c0c0;
  border: 2px solid; border-color: #fff #404040 #404040 #fff;
  box-shadow: 1px 1px 0 #dfdfdf inset, -1px -1px 0 #808080 inset, 4px 4px 0 rgba(0,0,0,.35), 8px 12px 20px rgba(0,0,0,.25);
  padding: 3px;
  z-index: 67;
  cursor: move;
  font-family: var(--font-ui);
  color: #000;
  animation: rz-drop .55s cubic-bezier(.2,1.4,.4,1) both;
}
@keyframes rz-drop { from { transform: translateY(-40px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---- title bar ---- */
.rz-title {
  display: flex; align-items: center; gap: 6px;
  background: linear-gradient(90deg, #000080, #1084d0);
  color: #fff; font: 700 12px "IBM Plex Mono", monospace; letter-spacing: .5px;
  padding: 3px 4px 3px 6px; user-select: none;
}
.rz-title .rz-ico { font-size: 13px; }
.rz-title .rz-t { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.rz-live { color: #ff5a5a; font-size: 11px; animation: ps-blink 1.1s steps(2) infinite; text-shadow: 0 0 6px rgba(255,90,90,.8); }
.rz-tb { display: flex; gap: 2px; margin-left: 4px; }
.rz-tb i {
  width: 16px; height: 14px; display: flex; align-items: flex-end; justify-content: center;
  background: #c0c0c0; color: #000; font: 700 10px "IBM Plex Mono", monospace; font-style: normal;
  border: 1px solid; border-color: #fff #404040 #404040 #fff; line-height: 1; padding-bottom: 1px;
}

/* ---- body ---- */
.rz-body { padding: 8px 8px 7px; position: relative; }

.rz-top { display: flex; gap: 10px; align-items: stretch; margin-bottom: 8px; }

/* the LED counter */
.rz-led {
  flex: 1; min-width: 0;
  background: #000; color: #39ff6a;
  border: 2px solid; border-color: #404040 #fff #fff #404040;
  padding: 6px 10px 5px;
  background-image: repeating-linear-gradient(0deg, transparent 0 2px, rgba(57,255,106,.06) 2px 3px);
  position: relative; overflow: hidden;
}
.rz-led::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.08) 45%, transparent 60%);
  transform: translateX(-120%); animation: rz-sheen 5s ease-in-out infinite;
}
@keyframes rz-sheen { 0%, 60% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
.rz-k { font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 3px; color: #8be7a0; opacity: .85; }
.rz-amt {
  font: 400 50px "VT323", monospace; line-height: 1; margin: 1px 0 0;
  color: #39ff6a; text-shadow: 0 0 6px rgba(57,255,106,.75), 0 0 18px rgba(57,255,106,.35);
  letter-spacing: 1px; white-space: nowrap; font-variant-numeric: tabular-nums;
}
.rz-amt.tick { animation: rz-tick .35s steps(2); }
@keyframes rz-tick { 50% { color: #ffe14d; text-shadow: 0 0 10px #ffe14d, 0 0 30px rgba(255,225,77,.6); } }
.rz-amt .rz-cur { font-size: .6em; color: #8be7a0; margin-left: 6px; letter-spacing: 2px; }
.rz-sub { font: 400 14px "VT323", monospace; color: #8be7a0; letter-spacing: .5px; margin-top: -1px; }
.rz-sub b { color: #ffe14d; font-weight: 400; }

/* the exclusivity notice */
.rz-count {
  flex: 0 0 200px; display: flex; flex-direction: column; justify-content: center; text-align: center;
  background: #000; color: #fff;
  border: 2px solid; border-color: #404040 #fff #fff #404040;
  padding: 6px 8px 6px;
}
.rz-count small { font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 3px; color: #ff5a5a; animation: ps-blink 1.3s steps(2) infinite; }
.rz-count b {
  display: block; font: 400 15.5px "VT323", monospace; line-height: 1.15; margin: 4px 0 0;
  color: #ffd7d7; font-weight: 400; letter-spacing: .3px;
}
.rz-count b em { font-style: normal; color: #ff5a5a; font-weight: 700; text-shadow: 0 0 8px rgba(255,90,90,.8); letter-spacing: 1px; }

/* ---- the CEX note: small, calm, secondary ---- */
.rz-warn {
  display: flex; align-items: center; gap: 7px;
  background: #ffffe1; color: #333;
  border: 1px solid #9a9a7a;
  padding: 5px 9px;
}
.rz-warn-ico { font-size: 13px; line-height: 1; color: #7a5c00; }
.rz-warn-txt { font: 400 10.5px "IBM Plex Mono", monospace; line-height: 1.3; }
.rz-warn-txt b { color: #000; font-weight: 700; }

/* ---- closed ---- */
.rz-closed-badge, .rzm-closed { color: #ff5a5a; font: 700 11px "IBM Plex Mono", monospace; text-shadow: 0 0 6px rgba(255,90,90,.6); }
.rz-closed {
  margin-top: 8px; padding: 10px 12px 11px;
  background: #000; color: #f4f4f4;
  border: 2px solid; border-color: #404040 #fff #fff #404040;
  background-image: repeating-linear-gradient(0deg, transparent 0 2px, rgba(255,255,255,.05) 2px 3px);
}
.rz-closed-h { font: 700 22px "IBM Plex Mono", monospace; letter-spacing: 1px; color: #33ff66 !important; text-shadow: 0 0 10px rgba(51,255,102,.6); }
.rz-closed-p { margin-top: 5px; font: 400 17px "VT323", monospace; line-height: 1.25; color: #d7ffd7; }
.rz-closed-p b { color: #ffe14d; font-weight: 400; }
.rz-warn { margin-top: 8px; }

/* ---- social link ---- */
.rz-social {
  margin-top: 8px; padding: 10px 12px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: #000; color: #fff;
  border: 2px solid; border-color: #404040 #fff #fff #404040;
  background-image: repeating-linear-gradient(0deg, transparent 0 2px, rgba(255,255,255,.05) 2px 3px);
}
.rz-social-label {
  font: 700 18px "IBM Plex Mono", monospace;
  color: #d7ffd7; letter-spacing: .5px;
}
.rz-social-x {
  min-width: 58px; padding: 5px 15px;
  text-align: center; text-decoration: none;
  background: #c0c0c0; color: #000;
  border: 2px solid; border-color: #fff #404040 #404040 #fff;
  font: 700 18px "IBM Plex Mono", monospace;
  cursor: pointer;
}
.rz-social-x:hover { background: #000080; color: #fff; }
.rz-social-x:active { border-color: #404040 #fff #fff #404040; }

/* ---- wallet row ---- */
.rz-wallet {
  display: flex; align-items: center; gap: 6px; margin-top: 8px;
}
.rz-k2 { font: 700 10px "IBM Plex Mono", monospace; letter-spacing: 2px; white-space: nowrap; }
.rz-addr {
  flex: 1; min-width: 0;
  background: #fff; color: #000;
  border: 2px solid; border-color: #404040 #fff #fff #404040;
  font: 500 11.5px "IBM Plex Mono", monospace; padding: 4px 7px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: text; user-select: all;
}
.rz-addr.zap { animation: rz-addrzap .5s steps(2); }
@keyframes rz-addrzap { 50% { background: #000080; color: #ffe14d; } }
.rz-copy {
  min-width: 78px; padding: 4px 10px; cursor: pointer;
  background: #c0c0c0; color: #000;
  border: 2px solid; border-color: #fff #404040 #404040 #fff;
  font: 700 11px "IBM Plex Mono", monospace; white-space: nowrap;
}
.rz-copy:hover { background: #000080; color: #ffe14d; }
.rz-copy:active { border-color: #404040 #fff #fff #404040; }
.rz-copy.ok { background: #006400; color: #fff; }

/* footer line under the wallet */
.rz-foot {
  margin-top: 5px; font: 400 9.5px "IBM Plex Mono", monospace; color: #444;
  display: flex; justify-content: space-between; gap: 8px;
}
.rz-foot span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rz-foot b { color: #006400; }

/* ---- copy toast, inside the panel ---- */
.rz-toast {
  position: absolute; left: 50%; bottom: 56px; transform: translateX(-50%);
  background: #ffffe1; color: #222; border: 1px solid #000; box-shadow: 3px 3px 0 rgba(0,0,0,.4);
  font: 400 11px "IBM Plex Mono", monospace; padding: 5px 9px; white-space: nowrap; z-index: 6;
  animation: ps-toastin .3s cubic-bezier(.2,1.5,.4,1);
}
.rz-toast.bye { animation: ps-fadeout .4s ease-in forwards; }

/* ---- phones: strip on the desk + sheet ---- */
#raise-mini {
  display: block; width: calc(100% - 16px); margin: 8px 8px 0; padding: 3px; text-align: left; cursor: pointer;
  background: #c0c0c0; color: #000;
  border: 2px solid; border-color: #fff #404040 #404040 #fff;
  box-shadow: 3px 3px 0 rgba(0,0,0,.3);
  font-family: "IBM Plex Mono", monospace;
}
.rzm-row { display: flex; align-items: baseline; gap: 8px; padding: 2px 5px; }
.rzm-live { color: #ff5a5a; font: 700 10px "IBM Plex Mono", monospace; animation: ps-blink 1.1s steps(2) infinite; }
.rzm-t { font: 700 11px "IBM Plex Mono", monospace; letter-spacing: 1px; color: #000080; }
.rzm-amt {
  margin-left: auto; font: 400 26px "VT323", monospace; line-height: 1; color: #006400;
  font-variant-numeric: tabular-nums;
}
.rzm-sub { font: 700 9.5px "IBM Plex Mono", monospace; color: #333; padding-top: 0; }
.rzm-warn { color: #555; font-weight: 400; }
.rzm-cta { margin-left: auto; color: #000080; }
#raise-mini:active { border-color: #404040 #fff #fff #404040; }

#raise-sheet {
  position: fixed; inset: 0; z-index: 9640;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 10px 8px 70px; overflow-y: auto;
  background: rgba(0,0,0,.55);
  animation: ps-fadein .25s ease-out;
}
#raise-sheet.bye { animation: ps-fadeout .3s ease-in forwards; pointer-events: none; }
#raise.sheet {
  position: relative; left: auto; top: auto; margin: 0; width: 100%; max-width: 600px;
  cursor: default; animation: ps-slideup .35s cubic-bezier(.2,1.4,.4,1);
}
.rz-x { font-size: 12px !important; }

@media (max-width: 700px) {
  .rz-top { flex-direction: column; gap: 6px; }
  .rz-count { flex: none; }
  .rz-amt { font-size: 40px; }
  .rz-social-label { font-size: 15px; }
  .rz-foot span:last-child { display: none; }
}