/* The family computer, circa 2003. All popups live inside this desktop. */
body.chaos-active { overflow: hidden !important; }
.window.chaos-spam {
  position: fixed !important;
  margin: 0 !important;
  right: auto !important;
  bottom: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - 58px) !important;
  max-width: calc(100vw - 16px) !important;
  display: block;
  padding-bottom: 2px;
  color: #000;
  background: #ece9d8;
  font: 11px/1.35 Tahoma,Arial,sans-serif;
  box-shadow: 2px 3px 5px #0007;
}
.chaos-spam > .titlebar { height: 27px; font-size: 11px; }
.chaos-spam .window-controls button { width: 19px; height: 19px; }
.chaos-spam .window-controls button:first-child,
.chaos-spam .window-controls button:nth-child(2) { display: none; }
.chaos-spam .window-title .icon { width: 16px; height: 16px; }
.chaos-spam .close-glyph { width: 10px; height: 10px; }
.chaos-spam .close-glyph::before,
.chaos-spam .close-glyph::after { height: 12px; }
.chaos-browser-menu { display: flex; gap: 12px; padding: 3px 5px; border-bottom: 1px solid #aca899; font-size: 10px; }
.chaos-address { display: flex; gap: 6px; align-items: center; padding: 3px 4px; font-size: 10px; }
.chaos-address > div { display: flex; gap: 4px; align-items: center; background: white; height: 20px; padding: 1px 3px; border: 1px solid #7f9db9; min-width: 0; overflow: hidden; white-space: nowrap; flex: 1; }
.chaos-address .icon { width: 15px; height: 15px; }
.chaos-ad-page { background: #fff; padding: 3px; border: 2px inset #eee; text-align: center; }
.chaos-ad-page > small { font: 8px Arial,sans-serif; color: #777; }
.chaos-gif-link { display: block; padding: 0; border: 0; background: white; width: 100%; cursor: pointer; }
.chaos-gif-link img { display: block; width: 100%; height: auto; }
.chaos-ad-links { padding: 4px 0 2px; font-size: 10px; color: #999; }
.chaos-ad-links button { color: #00e; font: 10px "Times New Roman",serif; background: none; border: 0; text-decoration: underline; padding: 0 4px; }
.chaos-browser > footer { font-size: 9px; padding: 2px 4px; border-top: 1px solid #aaa; color: #333; display: flex; justify-content: space-between; }
.chaos-browser > footer span { border-left: 1px solid #aaa; padding-left: 5px; min-width: 90px; }
.window.chaos-classic { border: 2px outset #fff; border-radius: 0; background: #d4d0c8; }
.window.chaos-classic > .titlebar { border-radius: 0; background: linear-gradient(90deg,#0a246a,#a6caf0); height: 23px; box-shadow: none; margin: 0; text-shadow: none; }
.chaos-classic .window-controls .close { background: #d4d0c8; border: 2px outset #fff; color: #000; box-shadow: none; border-radius: 0; width: 17px; height: 16px; }
.chaos-classic .close-glyph::before,.chaos-classic .close-glyph::after { width: 1.5px; height: 10px; }
.chaos-message { padding: 10px 13px 12px; }
.chaos-message p { margin: 0 0 12px; }
.chaos-message > small { font-size: 10px; color: #555; }
.chaos-filename { overflow-wrap: anywhere; font-size: 10px; }
.chaos-buttons { display: flex; justify-content: flex-end; gap: 6px; padding: 0 10px 10px; }
.chaos-message .chaos-buttons { padding: 0; }
.chaos-buttons .xp-button { min-width: 70px; padding: 3px 9px; }
.chaos-system-message { display: flex; align-items: flex-start; gap: 12px; padding: 16px 13px 6px; }
.chaos-system-message p { margin: 0 0 12px; }
.chaos-error-icon { flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; color: #fff; background: radial-gradient(circle at 30% 25%,#ff7e6b,#d00000 75%); border: 1px solid #a00000; box-shadow: inset 1px 1px #ff9e9e; font: bold 30px/26px Arial,sans-serif; text-align: center; }
.chaos-warning { flex: 0 0 33px; width: 33px; height: 30px; color: #000; background: #ffd533; clip-path: polygon(50% 0,100% 100%,0 100%); font: bold 23px/35px Tahoma,sans-serif; text-align: center; filter: drop-shadow(1px 1px #967d00); }
.chaos-report-copy { margin: 0 14px 12px; font-size: 10px; }
.chaos-registry { padding: 9px; }
.chaos-registry-banner { display: flex; align-items: center; gap: 9px; background: #fff; border: 1px solid #a5b3c7; padding: 8px; color: #184d99; }
.chaos-registry-banner > span { font: bold 31px/1 Arial,sans-serif; color: #c00000; }
.chaos-registry-banner b { font: bold 20px "Times New Roman",serif; }
.chaos-registry-banner small { font: bold 13px Arial,sans-serif; }
.chaos-registry p { margin: 10px 2px; }
.chaos-error-total { border: 1px solid #aaa; background: white; padding: 5px 9px; }
.chaos-error-total b { font: bold 23px Tahoma,sans-serif; color: #d00000; margin-right: 8px; }
.chaos-scan-bar { height: 16px; background: #fff; border: 2px inset #ddd; padding: 1px; margin: 9px 0; }
.chaos-scan-bar i { display: block; height: 100%; width: 100%; background: repeating-linear-gradient(90deg,#2c9c20 0 7px,transparent 7px 9px); }
.chaos-scan-bar .chaos-transfer-progress { width: 38%; }
.chaos-fine-print { font-size: 9px; color: #555; }
.chaos-registry .chaos-buttons { padding: 0; }
#chaos-effects { position: fixed; inset: 0; pointer-events: none; z-index: 50000; overflow: hidden; }
.chaos-heat { position: absolute; inset: 0; opacity: 0; background: linear-gradient(transparent 20%,#a4240012 60%,#f54a0066); transition: opacity 2s; }
.chaos-fire { position: absolute; left: 0; right: 0; bottom: -8px; height: 0; transition: height 3.2s cubic-bezier(.2,.1,.35,1); background: linear-gradient(transparent 75%,#7c1700); }
.chaos-fire img { display: block; height: 100%; width: 100%; object-fit: fill; image-rendering: pixelated; }
.chaos-burning .chaos-fire { height: 57dvh; }
.chaos-burning .chaos-heat { opacity: 1; }
.chaos-recovery { position: fixed; top: 12px; right: 12px; z-index: 60000; width: 282px; max-width: calc(100vw - 24px); border: 2px solid #0054e3; border-radius: 5px 5px 0 0; background: #ece9d8; color: #000; box-shadow: 2px 3px 5px #0005; font: 11px/1.35 Tahoma,Arial,sans-serif; }
.chaos-recovery > header { display: flex; align-items: center; gap: 5px; padding: 3px 5px; color: #fff; background: linear-gradient(#4095f6,#0055e7 35%,#0645c3 85%,#0b66ed); min-height: 24px; font-size: 11px; }
.chaos-recovery > header .icon { width: 16px; height: 16px; }
.chaos-recovery > header > span { font-size: 9px; margin-left: auto; border: 1px solid #9bc3ff; padding: 0 3px; }
.chaos-recovery-body { padding: 9px 10px; }
.chaos-recovery-body p { margin: 0 0 5px; font-weight: bold; }
.chaos-recovery-body small { font-size: 10px; display: block; margin-bottom: 9px; }
.chaos-recovery-body .xp-button { min-width: 95px; display: block; margin-left: auto; }
.chaos-still .chaos-fire,.chaos-still .chaos-heat { transition: none; }
.chaos-finale .chaos-recovery {
  inset: 0;
  width: 100%;
  height: 100dvh;
  max-width: none;
  overflow-y: auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: #0000aa;
  color: #fff;
  z-index: 49000;
  font: 14px/1.15 "Lucida Console", "Courier New", monospace;
}
.chaos-finale .chaos-recovery-body { max-width: 790px; padding: 30px; }
.chaos-finale .chaos-recovery-body p { margin: 0 0 20px; font-weight: normal; }
.chaos-finale [data-chaos-reset] {
  display: inline-block;
  padding: 8px 14px;
  border: 2px solid #fff;
  border-radius: 0;
  background: #fff;
  color: #0000aa;
  font: bold 14px "Lucida Console", "Courier New", monospace;
  cursor: pointer;
}
.chaos-finale [data-chaos-reset]:focus-visible { outline: 2px dashed #fff; outline-offset: 4px; }
.chaos-finale .chaos-recovery-body .chaos-recovery-hint { margin-top: 14px; }
.chaos-finale .chaos-stop-code { overflow-wrap: anywhere; }
.chaos-finale .chaos-heat { opacity: 0; }
.chaos-finale .chaos-fire { height: 45dvh; }
@media (max-width: 900px) {
 .window.chaos-spam { position: fixed !important; width: auto; }
 .chaos-recovery { top: 8px; right: 8px; width: 267px; }
 .chaos-spam .titlebar { border-radius: 5px 5px 0 0; }
 .chaos-finale .chaos-recovery { inset: 0; width: 100%; }
 .chaos-finale .chaos-recovery-body { padding: 22px 18px; }
}
@media (prefers-reduced-motion: reduce) {
 .chaos-fire,.chaos-heat { transition: none; }
}