/* KILL MY IDEA — authentic 1995 stylesheet. No flexbox. No mercy. */

body {
  background: #000003 url(assets/stars.gif) repeat 0 0;
  color: #00ff41;
  font-family: "Times New Roman", Times, serif;
  font-size: 18px;
  margin: 0;
  padding: 12px 0 40px 0;
}

a { color: #00ffff; }
a:visited { color: #ff80ff; }

.page {
  background: transparent;
}

.topmarquee {
  color: #ffff00;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  font-size: 20px;
  background: #000020;
  border: 2px solid #ff00ff;
  padding: 4px 0;
}

.wordart {
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  font-size: 72px;
  font-weight: bold;
  margin: 24px 0 0 0;
  background: linear-gradient(180deg, #ffff00 0%, #ff9900 45%, #ff0000 80%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 3px 3px 0 #400040, 6px 6px 0 #000000;
  letter-spacing: 2px;
}

.tagline {
  color: #ff00ff;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  margin-top: 4px;
}

.counterbox { margin: 12px 0; }
.counterlabel { color: #00ffff; font-size: 14px; }

.lcd {
  background: #000000;
  border: 2px inset #808080;
  color: #7dff7d;
  font-family: "Courier New", monospace;
  font-weight: bold;
  font-size: 20px;
  letter-spacing: 6px;
  padding: 2px 8px;
  text-shadow: 0 0 6px #39ff39;
}

.divider { display: block; margin: 10px auto; }

/* ---------- form ---------- */
.formtable {
  border: 2px outset #c0c0c0;
  background: #0a0a14;
}
.formcell { padding: 14px; }

.formlabel {
  color: #ffff00;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  font-size: 20px;
}

textarea {
  background: #000000;
  color: #00ff41;
  border: 2px inset #808080;
  font-family: "Courier New", monospace;
  font-size: 16px;
  width: 640px;
  max-width: 92%;
  padding: 6px;
}

.charcount {
  color: #00ffff;
  font-family: "Courier New", monospace;
  font-size: 14px;
  margin-top: 4px;
}

input[type=range] {
  width: 420px;
  max-width: 80%;
  accent-color: #ff00ff;
}

.sevlab {
  color: #00ffff;
  font-family: "Courier New", monospace;
  font-size: 12px;
}
.sev-opt { cursor: pointer; }
.sev-opt:hover { color: #ffffff; }
.sev-active {
  color: #ffff00;
  background: #2a0030;
  text-shadow: 0 0 6px #ffff00;
}
.sev-readout {
  color: #ffff00;
  font-family: "Courier New", monospace;
  font-size: 14px;
  margin-left: 10px;
}

.blink {
  animation: blinker 1s step-start infinite;
  color: #ff4040;
  font-weight: bold;
}
@keyframes blinker { 50% { opacity: 0; } }

.btn {
  background: #c0c0c0;
  border: 2px outset #ffffff;
  color: #000000;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  font-size: 18px;
  font-weight: bold;
  padding: 6px 18px;
  cursor: pointer;
  margin: 4px;
}
.btn:active { border: 2px inset #ffffff; }
.btn:disabled { color: #606060; cursor: default; }

.btn-kill { font-size: 26px; }

.smallprint {
  color: #8080a0;
  font-size: 13px;
  margin-top: 8px;
  font-style: italic;
}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ---------- terminal ---------- */
.terminal {
  background: #000000;
  border: 2px solid #00ff41;
  width: 700px;
  max-width: 94%;
  margin: 0 auto;
  padding: 8px;
}
.terminal pre {
  color: #00ff41;
  font-family: "Courier New", monospace;
  font-size: 16px;
  text-align: left;
  white-space: pre-wrap;
  margin: 0;
  min-height: 200px;
}

/* ---------- error ---------- */
.errortable { border-color: #ff0000; background: #1a0000; }
.errorcell {
  color: #ff4040;
  font-family: "Courier New", monospace;
  font-size: 18px;
  padding: 16px;
}

/* ---------- care ---------- */
.caretable { max-width: 560px; }
.carecell {
  color: #d0d0d8;
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
  padding: 18px;
}

/* ---------- certificate ---------- */
.certificate {
  position: relative;
  background: #f0e7d0;
  color: #2a2118;
  border: 8px double #6b4f2a;
  outline: 2px solid #6b4f2a;
  outline-offset: 4px;
  width: 640px;
  max-width: 92%;
  margin: 16px auto;
  padding: 34px 40px;
  text-align: center;
  box-shadow: 0 0 40px #000000;
}
.seal {
  position: absolute;
  top: -18px;
  right: -18px;
  opacity: 0.92;
}
.cert-head {
  font-family: "Times New Roman", Times, serif;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 2px;
  margin: 6px 0 0 0;
}
.cert-bureau {
  font-size: 15px;
  letter-spacing: 6px;
  color: #6b4f2a;
  margin: 2px 0 8px 0;
}
.cert-rule { border: none; border-top: 2px solid #6b4f2a; width: 70%; }

.cert-fields { margin: 0 auto; max-width: 560px; }
.cf-label {
  font-weight: bold;
  font-size: 14px;
  letter-spacing: 1px;
  text-align: right;
  white-space: nowrap;
  color: #4a3a22;
}
.cf-value {
  text-align: left;
  font-size: 18px;
  padding-left: 10px;
}

.cert-rant-head { text-align: center; margin: 18px 0 4px 0; }
.cert-rant {
  font-size: 17px;
  line-height: 1.45;
  text-align: left;
  max-width: 540px;
  margin: 0 auto 14px auto;
  min-height: 120px;
}

.cert-epitaph {
  font-style: italic;
  font-size: 20px;
  margin: 16px 0 6px 0;
}
.cert-sig {
  font-family: "Snell Roundhand", "Brush Script MT", cursive;
  font-size: 34px;
  margin: 10px 0 0 0;
  color: #1a2a6b;
}
.cert-sig-sub { font-size: 13px; color: #6b4f2a; margin: 0; }

.cert-cursor {
  display: inline-block;
  background: #2a2118;
  width: 9px;
  height: 16px;
  vertical-align: text-bottom;
  animation: blinker 0.8s step-start infinite;
}

.cert-actions { margin: 10px 0; }
.skiplink { font-family: "Courier New", monospace; font-size: 14px; }
.copyconfirm { color: #ffff00; font-family: "Courier New", monospace; margin-left: 8px; }

.stickynote {
  background: #fffba0;
  color: #333311;
  width: 300px;
  padding: 16px;
  margin: 14px auto;
  text-align: left;
  font-size: 15px;
  line-height: 1.4;
  transform: rotate(-2deg);
  box-shadow: 4px 4px 8px rgba(0,0,0,0.6);
  border-top: 12px solid #e8e08a;
}
.sticky-head {
  display: block;
  font-weight: bold;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  margin-bottom: 6px;
}

/* ---------- graveyard ---------- */
.graveyard-head {
  color: #c0c0c0;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  letter-spacing: 3px;
}
.grave-empty { color: #8080a0; font-style: italic; }
.gravecell {
  padding: 8px;
  text-align: center;
  vertical-align: top;
  width: 180px;
}
.gravestone {
  cursor: pointer;
  border: 1px solid #333344;
  background: #07070f;
  padding: 8px 4px;
}
.gravestone:hover { border-color: #00ffff; }
.gs-name {
  color: #ffff00;
  font-size: 14px;
  font-family: "Courier New", monospace;
  word-break: break-word;
}
.gs-epitaph {
  color: #9090a8;
  font-size: 12px;
  font-style: italic;
  word-break: break-word;
}

/* ---------- hall of fame ---------- */
.hof-sub {
  color: #9090a8;
  font-style: italic;
  margin-top: -10px;
}
.hof-card {
  border: 2px solid #6b5a2a;
  background: #0d0c06;
  min-height: 170px;
}
.hof-card:hover { border-color: #ffd700; }
.hof-card-rank {
  color: #ffd700;
  font-family: "Courier New", monospace;
  font-weight: bold;
  font-size: 15px;
  text-align: left;
}
.hof-card-shares {
  color: #7dff7d;
  font-family: "Courier New", monospace;
  font-size: 13px;
  font-weight: bold;
  margin-top: 4px;
  border-top: 1px dashed #44443a;
  padding-top: 4px;
}

.sharebadge {
  color: #7dff7d;
  font-family: "Courier New", monospace;
  margin-left: 8px;
}

/* ---------- furniture ---------- */
.webring { font-family: "Courier New", monospace; }
.footerbits { color: #c0c0c0; font-size: 15px; }
.btn-midi { font-size: 13px; padding: 2px 10px; }
.copyright { color: #606078; font-size: 12px; }

@media (max-width: 840px) {
  .page { width: 96%; }
  .wordart { font-size: 44px; }
  textarea { width: 96%; }
  .certificate { padding: 24px 16px; }
}