.evidence-stage {
  position: relative; min-height: 100vh; padding: 76px 0.75rem 40px;
  background:
    radial-gradient(ellipse at 50% 12%, rgba(207, 168, 91, 0.12), transparent 50%),
    linear-gradient(180deg, #18110b 0%, #0a0705 100%);
}
@media (min-width: 768px) { .evidence-stage { padding: 80px 1.5rem 50px; } }

.investigation-room-frame {
  max-width: 1380px; margin: 0 auto; border: 8px solid #22150d;
  border-bottom: 16px solid #160c07; box-shadow: inset 0 0 80px rgba(0,0,0,0.92), 0 20px 60px rgba(0,0,0,0.9);
  background: var(--cork-base); position: relative;
}
@media (min-width: 768px) { .investigation-room-frame { border-width: 12px; border-bottom-width: 22px; } }

.cork-surface {
  position: relative; min-height: 720px; padding: 20px 1rem 50px;
  background-color: #583b24;
  background-image:
    radial-gradient(circle at 30% 20%, rgba(255,240,210,0.08), transparent 25%),
    radial-gradient(circle at 75% 65%, rgba(0,0,0,0.2), transparent 45%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)' opacity='.18'/%3E%3C/svg%3E");
  box-shadow: inset 0 0 100px rgba(0,0,0,0.75); overflow: hidden;
}

#threadCanvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; }

.master-evidence-sheet {
  max-width: 720px; margin: 0 auto 1.25rem; background: var(--paper-cream);
  color: var(--ink-black); padding: 1.25rem; text-align: center;
  position: relative; box-shadow: 0 14px 30px rgba(0,0,0,0.8); transform: rotate(-0.3deg); z-index: 20;
}
.master-evidence-sheet h1 { font-family: var(--font-display); font-size: clamp(1.4rem, 4vw, 2.7rem); font-weight: 900; letter-spacing: 0.12em; line-height: 1.1; margin-bottom: 0.3rem; }
.master-evidence-sheet p { font-family: var(--font-typewriter); font-size: 0.65rem; color: #574b39; letter-spacing: 0.16em; text-transform: uppercase; border-top: 1px dashed rgba(0,0,0,0.22); padding-top: 6px; }

/* Pins, Badges, Cards */
.pin {
  position: absolute; width: 14px; height: 14px; border-radius: 50%; z-index: 30;
  box-shadow: 0 3px 6px rgba(0,0,0,0.85), inset 0 1px 2px rgba(255,255,255,0.7);
}
.pin.brass { background: radial-gradient(circle at 35% 35%, #ffd166, #7a5200); }
.pin.red { background: radial-gradient(circle at 35% 35%, #e63946, #670d10); }
.pin.center-top { top: 6px; left: 50%; transform: translateX(-50%); }

.tape {
  position: absolute; width: 50px; height: 16px; background: rgba(240, 235, 210, 0.45);
  box-shadow: 0 1px 3px rgba(0,0,0,0.25); z-index: 25;
}
.tape.tl { top: -6px; left: -12px; transform: rotate(-30deg); }
.tape.tr { top: -6px; right: -12px; transform: rotate(30deg); }

.epistemic-badge {
  display: inline-block; padding: 2px 6px; font-family: var(--font-mono); font-size: 0.58rem;
  font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; border-radius: 2px; border: 1px solid currentColor;
}
.badge-primary { color: #8eb6e6; border-color: #3f6087; background: rgba(30, 58, 95, 0.35); }
.badge-disputed { color: #e88b8b; border-color: #8c2b2b; background: rgba(140, 43, 43, 0.35); }
.badge-official { color: #9be3b5; border-color: #2a6140; background: rgba(42, 72, 54, 0.35); }
.badge-stayed { color: #d4a9f2; border-color: #553569; background: rgba(85, 53, 105, 0.35); }
.badge-superseded { color: #b5b1ab; border-color: #54514c; background: rgba(74, 70, 66, 0.35); }

/* Timeline Scrubber */
.timeline-scrubber-bar {
  max-width: 820px; margin: 0 auto 2rem; background: rgba(14, 10, 7, 0.92);
  border: 1px solid rgba(207, 168, 91, 0.35); padding: 8px 16px; border-radius: 3px;
  display: flex; flex-direction: column; gap: 4px; z-index: 20; position: relative;
}
.scrubber-label-row { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 0.62rem; color: var(--gold-bright); text-transform: uppercase; }
.scrubber-slider { width: 100%; -webkit-appearance: none; appearance: none; height: 4px; background: rgba(207, 168, 91, 0.25); outline: none; cursor: pointer; }
.scrubber-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 14px; height: 14px; background: var(--gold-bright); border-radius: 50%; border: 2px solid #1a120b; }

/* Grid of Artifacts */
.cork-entities-field { display: grid; grid-template-columns: 1fr; gap: 1.25rem; position: relative; z-index: 15; }
@media (min-width: 768px) { .cork-entities-field { grid-template-columns: repeat(12, 1fr); gap: 1.5rem 1rem; } }

.node-artifact {
  position: relative; background: var(--paper-cream); color: var(--ink-black); padding: 1.15rem;
  box-shadow: 0 12px 26px rgba(0,0,0,0.75); cursor: pointer; transition: transform 0.2s ease, opacity 0.2s;
}
.node-artifact.dimmed { opacity: 0.2; filter: grayscale(80%); }
.node-artifact.highlighted { transform: scale(1.03) translateY(-3px) !important; box-shadow: 0 22px 45px rgba(0,0,0,0.95), 0 0 20px var(--gold-glow) !important; z-index: 35 !important; }

.node-person { grid-column: span 12; transform: rotate(-1.2deg); background: #fbf7ed; }
.node-company { grid-column: span 12; transform: rotate(1deg); background: var(--paper-legal); }
.node-project { grid-column: span 12; transform: rotate(-0.8deg); background: #f6f1e3; border-top: 4px solid var(--gold-brass); }
.node-audit { grid-column: span 12; transform: rotate(1.2deg); background: var(--paper-cream); border-left: 4px solid var(--thread-red); }
.node-court_case { grid-column: span 12; transform: rotate(-1deg); background: #fdfaf2; }
.node-payment { grid-column: span 12; transform: rotate(1.5deg); background: var(--paper-ledger); }

@media (min-width: 768px) {
  .node-person, .node-audit { grid-column: 1 / span 4; }
  .node-company, .node-court_case { grid-column: 5 / span 4; }
  .node-project, .node-payment { grid-column: 9 / span 4; }
}