/* Campaign theme layer — evolves the existing archive look (CRT, intel HUD, evidence board). */
:root{--bo-red:#e3262f;--bo-red-dim:#8e1a20;--bo-amber:#ff8a3d;--bo-mono:Consolas,'Courier New',monospace}

/* ---------- global texture ---------- */
.bo-crt{position:fixed;inset:0;z-index:60;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 2px,#0000001f 2px 3px),radial-gradient(ellipse at 50% 50%,transparent 60%,#0006 100%);mix-blend-mode:multiply}
.bo-crt:after{content:'';position:absolute;inset:-50%;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:bo-grain .6s steps(4) infinite;mix-blend-mode:screen}
@keyframes bo-grain{0%{transform:translate(0,0)}25%{transform:translate(-5%,3%)}50%{transform:translate(4%,-4%)}75%{transform:translate(-2%,-5%)}100%{transform:translate(3%,4%)}}

/* header: moving signal line, bracketed active tab */
.bo-theme .command-bar{position:relative;overflow:visible}
.bo-header-scan{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--bo-red) 45%,#ffd2b0 50%,var(--bo-red) 55%,transparent) no-repeat;background-size:30% 100%;animation:bo-header-run 6s linear infinite;pointer-events:none}
@keyframes bo-header-run{from{background-position:-40% 0}to{background-position:140% 0}}
.bo-theme .command-bar nav a{position:relative}
.bo-theme .command-bar nav a.active:before,.bo-theme .command-bar nav a.active:after{content:'';position:absolute;top:8px;bottom:8px;width:6px;border:1px solid var(--bo-red);pointer-events:none}
.bo-theme .command-bar nav a.active:before{left:2px;border-right:0}.bo-theme .command-bar nav a.active:after{right:2px;border-left:0}
.bo-theme .command-bar nav a:hover{animation:bo-jitter .25s steps(2) 1}
@keyframes bo-jitter{0%{transform:translate(1px,0);text-shadow:-2px 0 var(--bo-red),2px 0 #39e7ff}50%{transform:translate(-1px,0)}100%{transform:none;text-shadow:none}}

/* angled controls */
.bo-theme .action,.bo-theme .button{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}

/* ---------- section transition ---------- */
.bo-wipe{position:fixed;inset:0;z-index:80;pointer-events:none;display:none}
.bo-wipe.is-on{display:block}
.bo-wipe i{position:absolute;left:0;right:0;height:calc(100% / 9);top:calc(var(--k) * 100% / 9);background:#050605;animation:bo-slice .52s cubic-bezier(.7,0,.3,1) both;animation-delay:calc(var(--k) * 18ms)}
.bo-wipe i:nth-child(3n){background:#0b0d0c;box-shadow:inset 0 1px #e3262f66}
.bo-wipe i:nth-child(4){background:linear-gradient(90deg,#e3262f33,#050605 40%)}
@keyframes bo-slice{0%{transform:translateX(0)}55%{transform:translateX(calc((var(--k) - 4) * 3%))}100%{transform:translateX(calc(var(--k,1) * 0% + 110%));opacity:0}}
html[dir=rtl] .bo-wipe i{animation-name:bo-slice-rtl}
@keyframes bo-slice-rtl{0%{transform:translateX(0)}55%{transform:translateX(calc((4 - var(--k)) * 3%))}100%{transform:translateX(-110%);opacity:0}}
.bo-wipe-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:600 clamp(18px,2.6vw,34px) var(--bo-mono);letter-spacing:6px;color:#f2efe4;white-space:nowrap;animation:bo-label .52s steps(1) both;text-shadow:-3px 0 var(--bo-red),3px 0 #39e7ff}
@keyframes bo-label{0%{opacity:1}30%{opacity:.2}38%{opacity:1}70%{opacity:1;clip-path:inset(0)}100%{opacity:0;clip-path:inset(50% 0 50% 0)}}

/* glitch heading on arrival (works on multi-line headings, no duplicated text) */
.bo-glitch-in{animation:bo-glitch .9s steps(1) both}
@keyframes bo-glitch{0%{opacity:0;clip-path:inset(40% 0 45% 0)}8%{opacity:1;text-shadow:-6px 0 var(--bo-red),6px 0 #39e7ff;transform:translateX(-6px) skewX(-6deg);clip-path:inset(0 0 60% 0)}16%{clip-path:inset(55% 0 0 0);transform:translateX(8px)}24%{clip-path:inset(20% 0 30% 0);transform:translateX(-3px);text-shadow:4px 0 var(--bo-red),-4px 0 #39e7ff}32%{clip-path:inset(-40%);transform:none;opacity:.6}40%{opacity:1;text-shadow:-2px 0 var(--bo-red),2px 0 #39e7ff}60%{text-shadow:none}100%{opacity:1;text-shadow:none;transform:none;clip-path:none}}
.bo-type-in{animation:bo-type .7s steps(14) both}
@keyframes bo-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
html[dir=rtl] .bo-type-in{animation-name:bo-type-rtl}
@keyframes bo-type-rtl{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
.bo-theme .screen-heading .kicker:before,.bo-theme .archive-topline .kicker:before{content:'';display:inline-block;width:8px;height:8px;background:var(--bo-red);margin-inline-end:10px;vertical-align:middle;animation:bo-blink 1.4s steps(2) infinite}
@keyframes bo-blink{50%{opacity:.2}}

/* ---------- PEOPLE: subject dossier ---------- */
.bo-theme .person-portrait{position:relative;isolation:isolate}
.bo-theme .person-portrait>img{transition:filter .6s}
.bo-subject{position:absolute;z-index:3;top:16px;left:16px;right:16px;display:flex;flex-direction:column;gap:3px;font:11px var(--bo-mono);letter-spacing:2px;color:#f2efe4;text-shadow:0 1px 6px #000;pointer-events:none}
.bo-subject span{color:var(--bo-red)}
.bo-subject b{font-weight:400;font-size:12px}
.bo-brackets{position:absolute;inset:6px;z-index:3;pointer-events:none}
.bo-brackets i{position:absolute;width:20px;height:20px;border:2px solid #f2efe4cc}
.bo-brackets i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}.bo-brackets i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}.bo-brackets i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0}.bo-brackets i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0}
.bo-scanbar{position:absolute;left:6px;right:6px;top:6px;height:3px;z-index:3;background:linear-gradient(90deg,transparent,#ff8a3d,transparent);box-shadow:0 0 18px #ff792c;opacity:0;pointer-events:none}
.bo-person-in .person-portrait>img{animation:bo-develop 1.1s cubic-bezier(.2,.8,.2,1) both}
.bo-person-in .bo-scanbar{animation:bo-scan 1.3s .1s ease-in-out both}
.bo-person-in .bo-brackets i{animation:bo-bracket .7s cubic-bezier(.2,.8,.2,1) both}
.bo-person-in .bo-subject{animation:bo-type .8s .35s steps(18) both}
html[dir=rtl] .bo-person-in .bo-subject{animation-name:bo-type}
.bo-person-in .person-content h2{animation:bo-glitch .9s .1s steps(1) both}
.bo-person-in .person-english{animation:bo-type .6s steps(16) both}
.bo-person-in .person-facts>div{animation:bo-rise .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--n,0) * 90ms + .3s)}
.bo-person-in .person-facts>div:nth-child(1){--n:1}.bo-person-in .person-facts>div:nth-child(2){--n:2}.bo-person-in .person-facts>div:nth-child(3){--n:3}.bo-person-in .person-facts>div:nth-child(4){--n:4}.bo-person-in .person-facts>div:nth-child(5){--n:5}
.bo-redact{position:relative}
.bo-person-in .bo-redact:after{content:'';position:absolute;inset:2px -4px;background:#050605;box-shadow:0 0 0 1px #e3262f55;transform-origin:left;animation:bo-unredact .55s cubic-bezier(.7,0,.3,1) both;animation-delay:calc(var(--d) * 110ms + .55s);pointer-events:none}
html[dir=rtl] .bo-person-in .bo-redact:after{transform-origin:right}
@keyframes bo-unredact{0%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes bo-develop{0%{filter:brightness(3.2) contrast(.4) blur(6px);clip-path:inset(0 0 100% 0)}35%{clip-path:inset(0)}100%{filter:none;clip-path:inset(0)}}
@keyframes bo-scan{0%{top:6px;opacity:1}90%{opacity:1}100%{top:calc(100% - 8px);opacity:0}}
@keyframes bo-bracket{0%{transform:scale(2.2);opacity:0}100%{transform:none;opacity:1}}
@keyframes bo-rise{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}
/* selector: red marker, scan on active */
.bo-theme .person-selector [role=tab]{position:relative;overflow:hidden;transition:background .3s,transform .3s}
.bo-theme .person-selector [role=tab]:hover{transform:translateX(calc(var(--bo-dir,1) * -4px))}
html[dir=rtl] .bo-theme .person-selector [role=tab]{--bo-dir:-1}
.bo-theme .person-selector [role=tab][aria-selected=true]:after{content:'';position:absolute;inset-block:0;inset-inline-end:0;width:3px;background:var(--bo-red);box-shadow:0 0 14px var(--bo-red)}
.bo-theme .person-selector [role=tab][aria-selected=true]:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#ff8a3d22,transparent);animation:bo-sweep 2.4s ease-in-out infinite;pointer-events:none}
@keyframes bo-sweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

/* ---------- FILES: evidence board ---------- */
.bo-pin{position:absolute;top:-7px;left:50%;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff8f8f,#b3131b 60%,#5a0a0d);box-shadow:0 3px 5px #000a;z-index:5;transform:translateX(-50%)}
.bo-string{position:absolute;inset:0;pointer-events:none;z-index:4;background:linear-gradient(var(--bo-red),var(--bo-red)) no-repeat;background-size:2px 34%;background-position:46% 30%;transform:rotate(38deg);opacity:.0}
.bo-file-in h2{animation:bo-glitch .9s steps(1) both}
.bo-file-in .file-year{animation:bo-flicker .6s steps(2) both}
.bo-file-in .summary,.bo-file-in .location{animation:bo-rise .6s cubic-bezier(.2,.8,.2,1) both}
.bo-file-in .summary{animation-delay:.12s}.bo-file-in .dossier-actions{animation:bo-rise .6s .22s cubic-bezier(.2,.8,.2,1) both}
@keyframes bo-flicker{0%{opacity:.1}30%{opacity:1}45%{opacity:.4}60%{opacity:1}}
.bo-theme .file-tile{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.bo-theme .file-tile:hover{transform:translateY(-6px);box-shadow:0 14px 30px #000a,inset 0 -2px var(--bo-red)}
.bo-theme .file-tile[aria-selected=true]{box-shadow:inset 0 0 0 1px var(--bo-red),0 0 30px #e3262f33}
.bo-theme .file-tile[aria-selected=true] .tile-year{opacity:.55!important;color:var(--bo-amber)!important}
@keyframes bo-tile-scan{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}
.bo-theme .case-register span{position:relative}
.bo-theme .case-register span b{transition:color .3s}

/* ---------- TIMELINE: tape transport ---------- */
.bo-osd{position:absolute;z-index:6;top:18px;left:22px;display:flex;gap:18px;font:600 15px var(--bo-mono);letter-spacing:3px;color:#f2efe4;text-shadow:0 0 8px #000,-1px 0 var(--bo-red);pointer-events:none}
.bo-osd-mode{font-weight:600}
.bo-osd.is-seek .bo-osd-mode{color:var(--bo-amber);animation:bo-blink .35s steps(2) 3}
.bo-tracking{position:absolute;z-index:5;left:0;right:0;top:0;height:16%;pointer-events:none;opacity:0;background:repeating-linear-gradient(0deg,#fff1 0 1px,#0000 1px 3px),linear-gradient(#0000,#ffffff26 45%,#ffffff40 50%,#ffffff26 55%,#0000);mix-blend-mode:screen}
.bo-tracking.is-on{animation:bo-track .6s linear both}
@keyframes bo-track{0%{top:-16%;opacity:1}100%{top:100%;opacity:1}}
.bo-tape-cut .time-photo{animation:bo-tape .55s steps(1) both}
.bo-tape-cut h2{animation:bo-glitch .8s steps(1) both}
@keyframes bo-tape{0%{filter:saturate(3) hue-rotate(-30deg) contrast(2);transform:translateX(-10px) skewX(-8deg)}20%{filter:none;transform:translateX(12px)}40%{transform:translateX(-4px);clip-path:inset(30% 0 40% 0)}60%{clip-path:inset(0);transform:none}100%{filter:none;transform:none}}
.bo-theme .history-station{transition:background .3s,color .3s}
.bo-theme .history-station:hover{background:#ffffff08}
.bo-theme .history-station[aria-pressed=true]{background:linear-gradient(0deg,#e3262f1f,transparent);color:#fff}
.bo-theme .history-station[aria-pressed=true]:before{background:var(--bo-red)!important;width:9px!important;height:9px!important;top:-5px!important;box-shadow:0 0 0 4px #e3262f33,0 0 16px var(--bo-red);animation:bo-blink 1.2s steps(2) infinite}
.bo-theme .history-station[aria-pressed=true] b{color:var(--bo-amber)}
.bo-theme #time-scrubber{accent-color:var(--bo-red)}

/* ---------- VISUAL ARCHIVE ---------- */
.bo-vhs{position:absolute;inset:0;z-index:4;pointer-events:none;font:600 15px var(--bo-mono);letter-spacing:2px;color:#f2efe4;text-shadow:0 0 6px #000,-1px 0 #e3262faa}
.bo-vhs b{position:absolute;top:16px;left:18px;font-weight:600}
.bo-vhs span{position:absolute;bottom:16px;right:18px}
.bo-vhs i{position:absolute;top:16px;right:18px;font-style:normal}
.bo-vhs em{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0000 0 2px,#0003 2px 3px)}
.bo-static .film-view video,.bo-static video{animation:bo-static .6s steps(1) both}
@keyframes bo-static{0%{filter:contrast(3) brightness(2) grayscale(1) blur(2px)}25%{filter:contrast(2) brightness(.4);transform:translateX(8px)}50%{filter:saturate(2.5) hue-rotate(40deg);transform:translateX(-6px)}100%{filter:none;transform:none}}
.bo-theme #photo-gallery>*{opacity:0;transform:translateY(24px) rotate(calc((var(--k,1) - 1) * 1.2deg));transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--k,0) * 90ms)}
.bo-theme #photo-gallery>*.bo-in{opacity:1;transform:none}
.bo-theme .photo-tile button{position:relative;overflow:hidden}
.bo-theme .photo-tile button:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,transparent,#ff8a3d2a 50%,transparent);transform:translateY(-110%);pointer-events:none}
.bo-theme .photo-tile button:hover:after{animation:bo-tile-scan .9s ease-out 1 forwards}
.bo-theme .photo-tile button:hover img{animation:bo-hover-glitch .35s steps(1) 1}
@keyframes bo-hover-glitch{0%{transform:translateX(3px);filter:hue-rotate(-20deg) saturate(2)}50%{transform:translateX(-2px)}100%{transform:none;filter:none}}
.bo-tape{display:inline-block;align-self:flex-start;font:600 11px var(--bo-mono);letter-spacing:3px;color:#0a0a0a;background:repeating-linear-gradient(90deg,#d9d4c3 0 14px,#cfc9b6 14px 15px);padding:4px 12px;margin-bottom:10px;border-left:6px solid var(--bo-red)}
.bo-theme .war-film-grid article{position:relative;transition:transform .35s,box-shadow .35s}
.bo-theme .war-film-grid article:hover{transform:translateY(-4px);box-shadow:0 16px 40px #000a,inset 0 2px var(--bo-red)}

/* incident pages share the texture */
.bo-theme.detail-page .detail-cover h1{text-shadow:0 0 40px #0008}

/* calm modes */
@media(prefers-reduced-motion:reduce){.bo-crt:after,.bo-header-scan,.bo-wipe{animation:none!important;display:none!important}.bo-theme *{animation-duration:0s!important;animation-delay:0s!important;transition-duration:0s!important}.bo-theme #photo-gallery>*{opacity:1;transform:none}}
.motion-paused .bo-crt:after,.motion-paused .bo-header-scan{animation:none}
.motion-paused .bo-wipe{display:none!important}
.motion-paused #photo-gallery>*{opacity:1!important;transform:none!important}

/* FILES v2: the photo is dealt onto the table, then the lens pulls focus (no slicing, no jitter) */
.bo-theme .photo-mount{animation:none!important}
.bo-theme .field-note{animation:none!important}
.bo-board-in .photo-mount{animation:bo-deal .85s cubic-bezier(.16,.84,.24,1) both!important}
.bo-board-in .field-note{animation:bo-deal-note .8s .18s cubic-bezier(.16,.84,.24,1) both!important}
.bo-board-in .photo-mount img{animation:bo-focus 1.1s .1s cubic-bezier(.2,.8,.2,1) both}
.bo-board-in .photo-mount:after{content:'';position:absolute;inset:9px 9px 35px;pointer-events:none;background:linear-gradient(105deg,transparent 35%,#fff3 50%,transparent 65%) no-repeat;background-size:250% 100%;animation:bo-sheen 1.2s .5s ease-out both}
@keyframes bo-deal{0%{opacity:0;transform:translate3d(60px,40px,80px) rotate(14deg) scale(1.06)}60%{opacity:1}100%{opacity:1;transform:rotate(4deg) translateZ(30px)}}
@keyframes bo-deal-note{0%{opacity:0;transform:translate3d(-50px,30px,90px) rotate(-14deg)}100%{opacity:1;transform:rotate(-5deg) translateZ(55px)}}
@keyframes bo-focus{0%{filter:blur(10px) brightness(1.5) grayscale(1);transform:scale(1.1)}100%{filter:none;transform:none}}
@keyframes bo-sheen{0%{background-position:150% 0}100%{background-position:-60% 0}}
.bo-theme .file-tile img{transition:filter .5s,transform 1.2s cubic-bezier(.2,.8,.2,1)!important}
.bo-theme .file-tile[aria-selected=true]{box-shadow:inset 0 0 0 1px var(--bo-red),0 0 34px #e3262f2e}
.bo-theme .file-tile[aria-selected=true]:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--bo-red);box-shadow:0 0 14px var(--bo-red);transform-origin:left;animation:bo-bar .6s cubic-bezier(.2,.8,.2,1) both;z-index:2}
@keyframes bo-bar{from{transform:scaleX(0)}to{transform:none}}

/* TIMELINE v2: a still, framed monitor; the new photo cuts in once and then holds */
.bo-theme .time-photo{animation:none!important;transform:none!important}
.bo-theme .timeline-camera .time-image-button{clip-path:none!important;position:relative;padding:10px;background:#0b0f0d;border:1px solid #ffffff1f;box-shadow:0 24px 60px #000b}
.bo-theme .timeline-camera .time-image-button:before,.bo-theme .timeline-camera .time-image-button:after{content:'';position:absolute;width:22px;height:22px;border:2px solid var(--bo-red);z-index:2;pointer-events:none}
.bo-theme .timeline-camera .time-image-button:before{top:-2px;left:-2px;border-right:0;border-bottom:0}
.bo-theme .timeline-camera .time-image-button:after{bottom:-2px;right:-2px;border-left:0;border-top:0}
.bo-theme .timeline-camera .time-photo{display:block;filter:grayscale(.55) contrast(1.08)}
.bo-tape-cut .time-photo{animation:bo-cut-in .7s cubic-bezier(.2,.8,.2,1) both!important}
@keyframes bo-cut-in{0%{opacity:0;clip-path:inset(0 0 0 100%);filter:grayscale(1) brightness(1.6)}55%{opacity:1;clip-path:inset(0);filter:grayscale(1) brightness(1.2)}100%{clip-path:inset(0);filter:grayscale(.55) contrast(1.08)}}
html[dir=rtl] .bo-tape-cut .time-photo{animation-name:bo-cut-in-rtl!important}
@keyframes bo-cut-in-rtl{0%{opacity:0;clip-path:inset(0 100% 0 0);filter:grayscale(1) brightness(1.6)}55%{opacity:1;clip-path:inset(0);filter:grayscale(1) brightness(1.2)}100%{clip-path:inset(0);filter:grayscale(.55) contrast(1.08)}}
