.lab-hero {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 50px;
  align-items: center;
  padding: 72px 0 42px;
}
.lab-hero h1, .investigation-hero h1 {
  margin: 0;
  font-size: clamp(3rem, 7.5vw, 7rem);
  line-height: .88;
  letter-spacing: -.07em;
  text-transform: uppercase;
}
.lab-hero p, .investigation-hero > p { max-width: 760px; color: #bac3cb; }
.xp-window {
  overflow: hidden;
  color: #101216;
  border: 3px solid #b9c4cf;
  border-radius: 8px 8px 2px 2px;
  background: #e7e9e8;
  box-shadow: 12px 12px 0 rgba(77,231,255,.08);
}
.xp-titlebar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 36px;
  padding: 6px 8px 6px 12px;
  color: #fff;
  background: linear-gradient(180deg, #287be0, #074ba6);
  font-size: .82rem;
  font-weight: 800;
}
.xp-controls { display: flex; gap: 4px; }
.xp-controls i {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 3px;
  background: #2574d2;
  font-style: normal;
  line-height: 1;
}
.xp-controls i:last-child { background: #d84b38; }
.xp-body { padding: 18px; }
.lab-hero .xp-body p { color: #1b2025; }
.lab-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; margin: 30px 0 80px; }
.lab-widget { grid-column: span 6; min-width: 0; }
.lab-widget.wide { grid-column: span 12; }
.lab-label { margin: 0 0 16px; color: #4b5660; font-size: .85rem; }

.msn-app { min-height: 410px; }
.msn-contact {
  display: grid;
  grid-template-columns: 45px 1fr auto;
  gap: 11px;
  align-items: center;
  padding-bottom: 13px;
  border-bottom: 1px solid #b8c1c8;
}
.msn-avatar { display: grid; place-items: center; width: 45px; height: 45px; color: white; border-radius: 5px; background: linear-gradient(135deg,#63baf7,#75c93e); font-weight: 900; }
.msn-contact strong, .msn-contact small { display: block; }
.msn-contact small { color: #5b6976; }
.online-dot { color: #2c9a32; font-size: .75rem; }
.msn-log {
  height: 205px;
  margin: 14px 0;
  padding: 12px;
  overflow: auto;
  border: 1px solid #aebbc7;
  background: #fff;
  font: .85rem/1.55 Tahoma, Arial, sans-serif;
}
.msn-log p { margin: 0 0 9px; }
.msn-log b { color: #075fc0; }
.msn-compose { display: flex; gap: 6px; }
.msn-compose input { flex: 1; min-width: 0; padding: 9px; border: 1px solid #8498aa; }
.msn-compose button, .xp-button {
  padding: 8px 11px;
  color: #111;
  border: 1px solid #7d8b98;
  border-radius: 3px;
  background: linear-gradient(#fff,#d9e0e5);
  cursor: pointer;
  font-weight: 700;
}
.msn-toolbar { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.nudge-active { animation: nudge .12s linear 5; }
@keyframes nudge { 25%{transform:translateX(-8px)}75%{transform:translateX(8px)} }

.winamp {
  padding: 13px;
  color: #76ff72;
  border: 4px ridge #9a9a9a;
  background: #202124;
  font-family: ui-monospace, Consolas, monospace;
}
.winamp-display { min-height: 95px; padding: 12px; border: 3px inset #707070; background: #050805; }
.winamp-display strong { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.winamp-time { margin-top: 12px; color: #e7ff45; font-size: 1.8rem; }
.winamp-controls { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.winamp-controls button, .skin-row button { min-width: 42px; padding: 7px; border: 2px outset #aaa; background: #777; cursor: pointer; }
.skin-row { display: flex; gap: 6px; align-items: center; color: #ccc; font-size: .75rem; }
.winamp.skin-amber { color: #ffbc45; background: #25170c; }
.winamp.skin-ice { color: #86e9ff; background: #102331; }
.local-file { display: block; margin-top: 12px; color: #eee; font-size: .75rem; }

.dialup-panel { text-align: center; }
.modem {
  position: relative;
  width: min(280px, 90%);
  height: 112px;
  margin: 16px auto 24px;
  border: 5px outset #d4d1c5;
  background: #cbc7b8;
}
.modem::before { content: "56K FAX MODEM"; position: absolute; left: 20px; top: 22px; color: #4d4c45; font: 800 .75rem Arial; }
.modem-lights { position: absolute; right: 18px; bottom: 20px; display: flex; gap: 9px; }
.modem-lights i { width: 9px; height: 9px; border-radius: 50%; background: #52724e; box-shadow: inset 0 0 3px #000; }
.modem.is-dialing .modem-lights i { animation: blink .35s steps(1) infinite alternate; }
.modem.is-dialing .modem-lights i:nth-child(2) { animation-delay: .12s; }
.modem.is-dialing .modem-lights i:nth-child(3) { animation-delay: .25s; }
@keyframes blink { to { background:#6dff67; box-shadow:0 0 10px #6dff67; } }
.speed-result { min-height: 70px; padding: 12px; color: #8cff8a; background: #050805; font-family: ui-monospace, Consolas, monospace; text-align: left; }

.time-compare { position: relative; min-height: 380px; overflow: hidden; border: 1px solid #8796a3; background: #fff; }
.old-web, .late-web { position: absolute; inset: 0; padding: 18px; }
.old-web { color: #000080; background: #ffffd6; font-family: "Times New Roman", serif; }
.old-web header { padding: 18px; color: yellow; background: navy; text-align: center; font-size: 2rem; font-weight: bold; }
.old-columns { display: grid; grid-template-columns: 150px 1fr; gap: 15px; margin-top: 14px; }
.old-menu { padding: 10px; background: #c0c0c0; border: 3px outset #ddd; }
.old-menu a { display: block; margin: 8px 0; color: blue; text-decoration: underline; }
.late-web { color: #26303a; background: #f3f5f7; font-family: Arial, sans-serif; clip-path: inset(0 0 0 var(--reveal, 50%)); }
.late-web header { display: flex; justify-content: space-between; padding: 15px; color: white; background: #195e9d; }
.late-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 20px; }
.late-cards div { min-height: 130px; padding: 12px; border: 1px solid #d2d9df; border-radius: 5px; background: white; }
.compare-handle { position: absolute; z-index: 3; top: 0; bottom: 0; left: var(--handle,50%); width: 3px; background: #ff4f64; pointer-events: none; }
.compare-control { width: 100%; margin-top: 14px; accent-color: #d8ff3e; }

.investigation-hero { padding: 70px 0 35px; }
.osint-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 15px; margin: 25px 0 70px; }
.osint-card { grid-column: span 6; padding: 23px; border: 1px solid var(--line); background: var(--panel); }
.osint-card.full { grid-column: span 12; }
.osint-card h2, .osint-card h3 { margin-top: 0; }
.osint-card p, .osint-card li { color: #c4ccd2; }
.confidence { display: inline-flex; padding: 4px 7px; border: 1px solid var(--acid); color: var(--acid); font: 750 .68rem ui-monospace, Consolas, monospace; text-transform: uppercase; }
.confidence.warn { color: #ffb34d; border-color: #ffb34d; }
.domain-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.domain-table th, .domain-table td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.domain-table th { color: var(--acid); font-family: ui-monospace, Consolas, monospace; }
.domain-status { white-space: nowrap; }
.status-light { display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--acid); }
.status-light.redirect { background: #ffb34d; }
.status-light.dead { background: var(--red); }
.memorial-counter { display: flex; align-items: baseline; gap: 12px; margin: 18px 0; }
.memorial-counter strong { color: var(--acid); font-size: clamp(2.5rem,7vw,6rem); line-height: 1; }
.memorial-counter span { color: var(--muted); }
.warning-box {
  padding: 20px;
  color: #ffe3ab;
  border: 1px solid #a36c16;
  border-left: 5px solid #ffb13d;
  background: rgba(255,177,61,.08);
}

.flash-drop { padding: 30px; border: 2px dashed #65737e; background: #07090b; text-align: center; }
.flash-drop input { max-width: 100%; }
#ruffle-stage { min-height: 480px; display: grid; place-items: center; margin-top: 20px; border: 1px solid var(--line); background: #050607; }
#ruffle-stage ruffle-player { width: 100%; min-height: 480px; }
.swf-state { color: var(--muted); }

.forum-wall { columns: 2 340px; column-gap: 16px; margin: 30px 0 70px; }
.forum-post { break-inside: avoid; margin: 0 0 16px; padding: 18px; color: #111; border: 2px outset #ddd; background: #eee; font: .88rem/1.55 Arial, sans-serif; }
.forum-post header { display: flex; justify-content: space-between; gap: 12px; margin: -18px -18px 13px; padding: 8px 12px; color: white; background: #315b8a; }
.forum-post p { margin-bottom: 0; }

.contest-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin: 28px 0 70px; }
.contest-card { padding: 18px; border: 1px solid var(--line); background: var(--panel); }
.contest-preview { min-height: 170px; padding: 14px; color: blue; border: 5px ridge #aaa; background: linear-gradient(45deg,#ff9 25%,#9ff 25% 50%,#f9f 50% 75%,#ff9 75%); font-family: "Comic Sans MS", cursive; text-align: center; }
.contest-card button { margin-top: 12px; }

@media(max-width:900px){
  .lab-hero{grid-template-columns:1fr}
  .lab-widget{grid-column:span 12}
  .osint-card{grid-column:span 12}
  .contest-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .lab-hero,.investigation-hero{padding-top:45px}
  .lab-hero h1,.investigation-hero h1{font-size:clamp(2.8rem,14vw,4.4rem)}
  .lab-grid{margin-left:-7px;margin-right:-7px}
  .xp-body{padding:13px}
  .msn-contact{grid-template-columns:40px 1fr}
  .online-dot{grid-column:2}
  .late-cards{grid-template-columns:1fr}
  .late-cards div:nth-child(n+2){display:none}
  .old-columns{grid-template-columns:100px 1fr}
  .domain-table{display:block;overflow-x:auto}
  .forum-wall{columns:1}
}