/* History Detective Files: case-file skin.
   Loaded last. It only changes colors and fonts; layout, frames and motion come from the original page. */
:root{
  --paper:#EFE6D2;--white:#FBF7EE;--ink:#1C1F24;--ink-soft:#3E434A;--muted:#6B6A63;
  --coral:#B3261E;--coral-dark:#8E1C16;--yellow:#E8B92E;--purple:#A9842C;--purple-deep:#1F2A33;
  --teal-deep:#1F2A33;--blue:#B3261E;--green:#2F6B3A;--orange:#B5652A;--pink:#9C4A44;
  --cream:#EFE6D2;--cream-soft:#D6CFBF;
  --title:"Roboto Slab",Georgia,serif;
  --body:"Archivo",system-ui,sans-serif;
  --hand:"Special Elite","Courier New",monospace;
}

/* Typewriter accents have no italic, so keep them upright */
.note,.tag,.tcard .date,.avatar .yrs,.final .badges span{font-style:normal}
.plan .pname{font-family:var(--title)}
h1,h2,h3{letter-spacing:-.02em}

/* Highlight marks under the hero keywords */
.hl.p{background:linear-gradient(180deg,transparent 62%,#F2DB94 62%)}
.hl.c{background:linear-gradient(180deg,transparent 62%,#EBC4BE 62%)}
.hl.b{background:linear-gradient(180deg,transparent 62%,#D2DACB 62%)}
.hl.e{background:linear-gradient(180deg,transparent 62%,#DCD3BC 62%)}

/* Offer bar */
.topbar{background:#8E1C16}
.topbar .timer{background:#5E120E}

/* Hero doodles: plain glyphs, no ornament swap */
.hero .d3{font-size:26px}
.hero .d3:after{content:none}

/* Warm kraft borders on cards and arrows */
.atlas-arrow{border-color:#BFA978}
.atlas-page-button,.atlas-dialog{border-color:#CDBB93}
.atlas-reviews .tcard{border-color:#D3C3A2}
.more-classics{border-top-color:#A9842C66}
.more-classics li{border-color:#A9842C80}

/* Stamps and evidence-tape yellow */
.stars{color:var(--yellow)}
.review-stars{color:#B88A1C}
.tape{background:rgba(232,185,46,.7)}

/* Complete plan button */
.plan.best .btn{background:var(--green)}
.plan.best .btn:hover{background:#245530}
@keyframes completePlanPulse{0%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(47,107,58,.45)}70%{box-shadow:4px 4px 0 var(--ink),0 0 0 15px rgba(47,107,58,0)}100%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(47,107,58,0)}}
@keyframes pulse{0%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(179,38,30,.55)}70%{box-shadow:4px 4px 0 var(--ink),0 0 0 15px rgba(179,38,30,0)}100%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(179,38,30,0)}}
@keyframes pulseY{0%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(232,185,46,.7)}70%{box-shadow:4px 4px 0 var(--ink),0 0 0 15px rgba(232,185,46,0)}100%{box-shadow:4px 4px 0 var(--ink),0 0 0 0 rgba(232,185,46,0)}}

/* Placeholder slots that still need real content (remove the class when filled) */
.todo{outline:2px dashed #B3261E;outline-offset:3px}