:root{
  --bg:#08090b;
  --panel:#0d0f12;
  --ink:#c9cdd2;      /* bone / cold white */
  --dim:#5b626b;      /* muted steel */
  --faint:#20252b;    /* emblem watermark */
  --seal:#9a2b2b;     /* desaturated forensic crimson */
  --seal-bright:#c9403f;
  --line:#1a1e24;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:"SFMono-Regular",ui-monospace,"JetBrains Mono","DejaVu Sans Mono",Menlo,Consolas,monospace;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5vh 20px;
  overflow-x:hidden;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
/* faint vignette + scan texture, kept very subtle */
body::before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(120% 90% at 50% 30%, transparent 55%, rgba(0,0,0,.55) 100%);
}
body::after{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:3;
  background:repeating-linear-gradient(to bottom, rgba(255,255,255,.012) 0 1px, transparent 1px 3px);
  mix-blend-mode:overlay;
  opacity:.6;
}

.stage{position:relative;z-index:1;width:100%;max-width:860px;}

/* --- emblem watermark --- */
.emblem{
  position:absolute;
  top:-14%;left:50%;transform:translateX(-50%);
  width:clamp(144px,54vw,300px);
  height:auto;
  z-index:0;
  pointer-events:none;
  user-select:none;
  opacity:0;
  animation:emblem-in 2.6s ease .2s forwards;
}
@keyframes emblem-in{to{opacity:1;}}

/* --- wordmark --- */
.mark{
  position:relative;z-index:2;text-align:center;margin-bottom:34px;
  --wm:clamp(5px,1.7vw,11px);   /* effective wordmark "font size" — scales both marks together */
}
.mark .wm{display:block;margin:0 auto;height:auto;}
.mark .wm-null{
  width:calc(var(--wm) * 21.07);            /* 35 cols * 0.602 advance */
  filter:drop-shadow(0 0 18px rgba(201,64,63,.28));
}
.mark .wm-witness{
  width:calc(var(--wm) * 33.71);            /* 56 cols * 0.602 advance */
  margin-top:calc(var(--wm) * -0.15);       /* tighten the gap to the word above */
  filter:drop-shadow(0 0 14px rgba(201,205,210,.10));
}
.reveal{opacity:0;transform:translateY(6px);animation:reveal .7s cubic-bezier(.2,.7,.2,1) forwards;}
.d1{animation-delay:.35s;} .d2{animation-delay:.6s;} .d3{animation-delay:1.05s;}
.d4{animation-delay:1.35s;} .d5{animation-delay:1.6s;}
@keyframes reveal{to{opacity:1;transform:none;}}

/* --- dossier / witness statement --- */
.file{
  position:relative;z-index:2;
  background:linear-gradient(180deg,var(--panel),#0a0c0f);
  border:1px solid var(--line);
  border-left:2px solid var(--seal);
  padding:26px 28px 24px;
  max-width:640px;
  margin:0 auto;
  box-shadow:0 30px 70px -40px rgba(0,0,0,.9);
}
.file .head{
  display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  border-bottom:1px dashed var(--line);
  padding-bottom:12px;margin-bottom:18px;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);
}
.file .head .seal{color:var(--seal-bright);}
.stmt{font-size:14px;color:var(--ink);}
.stmt p{margin:0 0 12px;}
.stmt .lead{color:var(--dim);}
.stmt .em{color:var(--ink);}

/* redaction bars — the signature. hover/tap to lift the seal. */
.rd{
  position:relative;
  background:#000;
  color:#000;
  padding:0 .35em;
  border-radius:1px;
  cursor:help;
  transition:color .18s ease, background .18s ease;
  text-shadow:none;
  outline:1px solid #000;
}
.rd::after{
  content:"REDACTED";
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:.62em;letter-spacing:.14em;color:#3a3f45;pointer-events:none;
}
.rd:hover,.rd:focus-visible{
  background:transparent;color:var(--seal-bright);outline-color:transparent;
}
.rd:hover::after,.rd:focus-visible::after{opacity:0;}

.file .foot{
  margin-top:22px;padding-top:14px;border-top:1px dashed var(--line);
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);
}
.status{display:inline-flex;align-items:center;gap:9px;color:var(--ink);}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--seal-bright);
  box-shadow:0 0 10px var(--seal-bright);animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:.35;}50%{opacity:1;}}
.cursor{color:var(--seal-bright);animation:blink 1.1s step-end infinite;}
@keyframes blink{50%{opacity:0;}}
.file .foot a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--seal);
  padding-bottom:1px;transition:color .15s;}
.file .foot a:hover{color:var(--seal-bright);}

@media (max-width:520px){
  .file{padding:22px 18px;}
  .file .head{flex-direction:column;gap:4px;}
  .emblem{top:-9%;}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;}
  .reveal,.emblem{opacity:1!important;transform:none!important;}
}
