/* Copycat Watch: the case-file look (Nov 6 2026; Brady picked "A · Case file" from brand/proposals/copycat-looks-*.png).
   Loaded last on every /copycat page (scripts/wire-copycat-casefile.js), after prep/prep.css and the page's own <style>,
   so it wins in light and dark mode. Copycat is kept out of the Hall Pass skin (scripts/hallpass-skin.js NEVER).
   The family bar has its own reset and is untouched: it is the shared frame, this is Copycat's face.
   Desk = dark; the hero = a manila folder; every .card = an index card with a typed EXHIBIT A, B, C... label. */
:root{--bg:#26221E;--card:#FFFDF6;--ink:#2A2116;--muted:#5E5140;--rule:#DCCDA8;--magenta:#9A2B1F;--signal:#B3261E;
  --lamp:#E9CF97;--tint:#F4E8C9;--good:#1E6B45;--goodbg:#E6F1E6;--bad:#B3261E;--badbg:#FBE9E7;
  --desk:#26221E;--manila:#E9CF97;--type:"Courier New",Courier,ui-monospace,monospace}
html{background:var(--desk);color-scheme:light}
body{background:radial-gradient(ellipse 120% 60% at 30% 0,#3A342D,var(--desk) 70%) no-repeat,var(--desk);color:#EDE3CC}

/* header: dark strip, manila name, typed tagline */
.top{background:#1A1714;border-bottom:1px solid #3A332B;box-shadow:none}
.top .home{color:var(--manila)}
.top .home small{color:#BFAF8C;font-family:var(--type);font-weight:700;font-size:.56em;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.hero .row .btn{white-space:nowrap;padding-left:14px;padding-right:14px}
.top .site{color:#CDBE9C}

/* anything sitting on the desk reads light; paper resets it */
main.wrap{counter-reset:ex}
.hero,.card,details,.pk article,.risk article,.rpt{color:var(--ink)}

/* the folder */
.hero{position:relative;background:linear-gradient(#EED6A0,#E3C585);border-radius:3px 12px 12px 12px;padding:24px 18px 22px;
  margin:42px 0 26px;box-shadow:0 22px 40px -10px rgba(0,0,0,.6)}
.hero::before{content:"CASE FILE \00B7  COPYCAT WATCH";position:absolute;top:-25px;left:0;background:#EED6A0;padding:7px 14px 5px;
  border-radius:9px 9px 0 0;font:700 12px/1.1 var(--type);letter-spacing:.14em;color:#4A3A1E;white-space:nowrap}
.hero h1{color:#1B1712}
.hero p{color:#3B2F1C}
.hero a:not(.btn){color:#7A2117}
.hero .btn:not(.go){background:transparent;border-color:#2A2116;color:#2A2116}

/* buttons: rubber-stamp red */
.btn.go{background:var(--signal);border-color:var(--signal);color:#fff}
.btn.go:hover{background:#951E17;border-color:#951E17}
.btn{border-radius:6px}

/* index cards: red rule under a typed EXHIBIT label */
.card{background:var(--card);border:0;border-radius:3px;box-shadow:0 14px 28px -12px rgba(0,0,0,.65)}
.card>h2,.card.fold[open]>summary>h2{border-bottom:1.5px solid #E39B9B;padding-bottom:6px}
.card>h2::before,.card.fold>summary>h2::before{counter-increment:ex;content:"EXHIBIT " counter(ex,upper-alpha);display:block;margin-bottom:5px;
  font:700 .72rem/1.2 var(--type);letter-spacing:.16em;color:var(--signal)}
.card a:not(.btn){color:var(--magenta)}
/* folded index cards (tap the title to open; + / − in the corner) */
details.card.fold{display:block;padding:0;border:0;border-radius:3px}
details.card.fold>summary{display:block;list-style:none;cursor:pointer;position:relative;padding:14px 60px 14px 18px;margin:0}
details.card.fold>summary::-webkit-details-marker{display:none}
details.card.fold>summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;
  display:grid;place-items:center;border:2px solid var(--signal);border-radius:50%;font:700 20px/1 var(--display);color:var(--signal)}
details.card.fold[open]>summary::after{content:"\2212"}
details.card.fold>summary:focus-visible{outline:3px solid var(--signal);outline-offset:2px}
details.card.fold[open]{padding-bottom:16px}
details.card.fold>:not(summary){margin:12px 18px 0}
details.card.fold>:not(summary)+:not(summary){margin-top:12px}
details{background:#FFFEFA;border-color:var(--rule)}
.pk article,.risk article{background:#FFFEFA}

/* the desk around the paper */
.swipe,.boxcue{color:#BFAF8C}.card .swipe,.card .boxcue{color:var(--muted)}.stack:not(.card)>.muted{color:#BFAF8C}
footer.wrap{color:#BFAF8C}
footer.wrap a{color:var(--manila)}

/* main page only: typed subject label, the Polaroid of the copy, the FLAGGED stamp */
.cf-lab{justify-self:start;background:#FBF6E8;border:1px solid #CDB27A;padding:6px 10px;transform:rotate(-.6deg);
  font:700 12.5px/1.55 var(--type);color:#3A2E1A;letter-spacing:.04em}
.cf-pol{position:relative;justify-self:start;margin:14px 0 4px 6px;width:142px;background:#fff;padding:9px 9px 30px;
  transform:rotate(3deg);box-shadow:0 10px 22px rgba(0,0,0,.35)}
.cf-pol .ph{display:grid;place-items:center;aspect-ratio:1;background:#20302A}
.cf-pol svg{width:86%;height:auto}
.cf-pol figcaption{position:absolute;bottom:7px;left:0;right:0;text-align:center;font:700 11px/1 var(--type);letter-spacing:.06em;color:#333}
.cf-clip{position:absolute;top:-14px;left:22px;width:16px;height:44px;border:3px solid #9AA3A8;border-bottom-color:transparent;border-radius:9px}
.cf-stamp{position:absolute;right:-24px;top:-14px;z-index:2;transform:rotate(-11deg);border:4px double var(--signal);color:var(--signal);
  background:rgba(255,255,255,.35);padding:6px 10px 4px;font:700 24px/1 var(--display);letter-spacing:.14em;opacity:.9}
@media (min-width:860px){
  .hero.cf{padding-right:270px}
  .cf-pol{position:absolute;right:36px;top:44px;margin:0;width:196px}
}
@media print{body{background:#fff;color:#000}.hero,.card{box-shadow:none}.cf-pol{display:none}}
