/* Archives shine: TAIL runs around the page the whole time, a glint across the title, drifting motes of light,
   records that power on when opened, a live vault lamp, and the lost fragment passing through now and then.
   Soft and dim, dimmer at night (US Central). Loaded after archives-palette.css.
   Decoration only: nothing here takes the pointer or changes any record. */

/* --- TAIL, running around the page (js/archives-shine.js moves it) --- */
.tail-runner{position:fixed;left:0;top:0;z-index:7;width:96px;height:64px;pointer-events:none;will-change:transform;transition:transform 3s cubic-bezier(.45,.05,.55,.95);opacity:.94;mix-blend-mode:screen}
.tail-runner .tail-body{position:absolute;inset:0;transition:transform .25s ease}
.tail-runner img{display:block;width:100%;height:100%;object-fit:contain;
  -webkit-mask-image:radial-gradient(ellipse 52% 52% at 50% 52%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 52% 52% at 50% 52%,#000 62%,transparent 100%);
  filter:drop-shadow(0 0 6px rgba(198,160,255,.7))}
.tail-runner.faces-left .tail-body{transform:scaleX(-1)}
.tail-runner.running img{animation:tail-hop .3s ease-in-out infinite}
.tail-runner.dashing img{animation:tail-hop .2s ease-in-out infinite}
.tail-runner.idle img{animation:tail-breathe 3.2s ease-in-out infinite}
.tail-runner.sniffing img{animation:tail-sniff .9s ease-in-out infinite}
@keyframes tail-hop{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(-3deg)}}
@keyframes tail-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.04,.97)}}
@keyframes tail-sniff{0%,100%{transform:translate(0,0) rotate(0)}30%{transform:translate(3px,2px) rotate(4deg)}60%{transform:translate(-2px,3px) rotate(-3deg)}}
.tail-print{position:fixed;z-index:6;width:5px;height:5px;margin:-2px 0 0 -2px;border-radius:50%;pointer-events:none;background:#efe3ff;box-shadow:0 0 6px #c6a0ff,0 0 12px rgba(198,160,255,.6);animation:print-fade 1.6s ease-out forwards}
@keyframes print-fade{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(.4)}}

/* --- title glint --- */
.archives-hero h1 .title-glint{position:absolute;inset:0;font-style:normal;color:transparent;-webkit-text-stroke:0;text-shadow:none;pointer-events:none;
  background:linear-gradient(100deg,transparent 42%,rgba(255,255,255,.55) 50%,transparent 58%) 130% 0/260% 100% no-repeat;
  -webkit-background-clip:text;background-clip:text;animation:arch-glint 9s ease-in-out infinite}
@keyframes arch-glint{0%,62%{background-position:130% 0}92%,100%{background-position:-30% 0}}

/* --- motes of light drifting up through the library --- */
.archive-motes{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.archive-motes i{position:absolute;bottom:-12px;width:3px;height:3px;border-radius:50%;background:#e9dcff;box-shadow:0 0 6px #c6a0ff,0 0 11px rgba(198,160,255,.5);opacity:0;animation:mote-rise 22s linear infinite}
.archive-motes i:nth-child(3n){background:#ffd9b0;box-shadow:0 0 6px #ff7a18}
.archive-motes i:nth-child(5n){width:2px;height:2px}
.archive-motes i:nth-child(1){left:6%;animation-delay:-2s}
.archive-motes i:nth-child(2){left:15%;animation-delay:-9s;animation-duration:26s}
.archive-motes i:nth-child(3){left:24%;animation-delay:-15s}
.archive-motes i:nth-child(4){left:33%;animation-delay:-5s;animation-duration:19s}
.archive-motes i:nth-child(5){left:42%;animation-delay:-12s}
.archive-motes i:nth-child(6){left:51%;animation-delay:-18s;animation-duration:24s}
.archive-motes i:nth-child(7){left:60%;animation-delay:-7s}
.archive-motes i:nth-child(8){left:68%;animation-delay:-20s;animation-duration:21s}
.archive-motes i:nth-child(9){left:76%;animation-delay:-3s}
.archive-motes i:nth-child(10){left:84%;animation-delay:-13s;animation-duration:27s}
.archive-motes i:nth-child(11){left:91%;animation-delay:-10s}
.archive-motes i:nth-child(12){left:97%;animation-delay:-16s;animation-duration:23s}
@keyframes mote-rise{0%{transform:translate(0,0);opacity:0}8%{opacity:.7}60%{opacity:.4}100%{transform:translate(26px,-105vh);opacity:0}}

/* --- records catch the light and power on --- */
.record-card{position:relative;overflow:hidden}
.record-card::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:26%;transform:skewX(-20deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);opacity:0}
.record-card:hover::after,.record-card:focus-visible::after{opacity:1;animation:card-glint .9s ease-out}
@keyframes card-glint{from{left:-40%}to{left:130%}}
.record-detail.powering #detailContent>*,.record-detail.powering #libraryDetailContent>*{animation:arch-power .6s ease-out both}
.record-detail.powering #detailContent>*:nth-child(2),.record-detail.powering #libraryDetailContent>*:nth-child(2){animation-delay:.08s}
.record-detail.powering #detailContent>*:nth-child(3),.record-detail.powering #libraryDetailContent>*:nth-child(3){animation-delay:.16s}
.record-detail.powering #detailContent>*:nth-child(4),.record-detail.powering #libraryDetailContent>*:nth-child(4){animation-delay:.24s}
.record-detail.powering #detailContent>*:nth-child(5),.record-detail.powering #libraryDetailContent>*:nth-child(5){animation-delay:.32s}
.record-detail.powering #detailContent>*:nth-child(6),.record-detail.powering #libraryDetailContent>*:nth-child(6){animation-delay:.4s}
.record-detail.powering #detailContent>*:nth-child(n+7),.record-detail.powering #libraryDetailContent>*:nth-child(n+7){animation-delay:.48s}
@keyframes arch-power{0%{opacity:0;transform:translateY(8px);filter:brightness(1.8)}60%{opacity:1}100%{opacity:1;transform:none;filter:none}}
.record-detail{position:relative;overflow:hidden}
.record-detail .detail-scan{position:absolute;left:0;right:0;top:0;height:2px;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),rgba(198,160,255,.7),transparent);box-shadow:0 0 12px rgba(198,160,255,.6)}
.record-detail.powering .detail-scan{animation:detail-scan 1.3s ease-out}
@keyframes detail-scan{0%{top:0;opacity:.9}100%{top:100%;opacity:0}}

/* --- search and tabs --- */
.search-control input{transition:box-shadow .25s ease,border-color .25s ease}
.search-control input:focus{box-shadow:0 0 16px rgba(255,122,24,.35),inset 0 0 14px rgba(198,160,255,.08)}
.archive-tab.active{box-shadow:0 2px 0 var(--orange),0 6px 16px -8px rgba(255,122,24,.7)}

/* --- vault lamp --- */
.archive-index .status-lamp{display:inline-block;width:8px;height:8px;margin-left:9px;border-radius:50%;background:#8fa9b6;box-shadow:0 0 6px #8fa9b6;vertical-align:middle;animation:arch-lamp 3s ease-in-out infinite}
.archive-index .status-lamp[data-state="ok"]{background:#4dff9a;box-shadow:0 0 6px #4dff9a,0 0 12px rgba(77,255,154,.55)}
.archive-index .status-lamp[data-state="bad"]{background:#ff3b42;box-shadow:0 0 6px #ff3b42,0 0 12px rgba(255,59,66,.65);animation-duration:1s}
.archive-index .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@keyframes arch-lamp{0%,100%{opacity:1}50%{opacity:.55}}

/* --- the lost fragment passes behind the page now and then --- */
.archive-frag{position:fixed;z-index:1;left:-8%;top:40%;width:70px;opacity:0;pointer-events:none;animation:arch-frag-pass 90s linear infinite;animation-delay:-70s}
.archive-frag svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 0 3px #65faff) drop-shadow(0 0 9px rgba(101,250,255,.6));animation:arch-bob 5.5s ease-in-out infinite}
.archive-frag .thread{fill:none;stroke:#eaffff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.archive-frag .scorch{fill:none;stroke:#ff7a18;stroke-width:1.8;stroke-linecap:round}
@keyframes arch-frag-pass{0%{left:-8%;top:58%;opacity:0}3%{opacity:.5}12%{left:26%;top:28%}22%{left:54%;top:66%}30%{left:82%;top:30%}35%{left:108%;top:46%;opacity:.4}36%,100%{left:108%;opacity:0}}
@keyframes arch-bob{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-4px) rotate(7deg)}}

/* --- dimmer at dusk and at night (data-time is set by js/archives-shine.js) --- */
html[data-time="dusk"] .archive-motes,html[data-time="dusk"] .tail-runner,html[data-time="dusk"] .archive-frag{opacity:.8}
html[data-time="night"] .archive-motes{opacity:.6}
html[data-time="night"] .tail-runner{opacity:.8}

@media(max-width:700px){.tail-runner{width:70px;height:47px}}
@media(prefers-reduced-motion:reduce){
  .title-glint,.archive-motes i,.archive-frag,.archive-frag svg,.tail-runner img,.record-card::after,.record-detail.powering #detailContent>*,.record-detail.powering #libraryDetailContent>*,.record-detail.powering .detail-scan,.status-lamp{animation:none}
  .archive-motes,.archive-frag,.title-glint,.tail-print{display:none}
  .tail-runner{transition:none}
}

/* --- DOT's house: lavender glow throughout (orange stays the lead accent, lavender joins it) --- */
.dot-haze{position:fixed;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(ellipse 55% 40% at 8% 6%,rgba(198,160,255,.16),transparent 70%),radial-gradient(ellipse 50% 40% at 96% 38%,rgba(198,160,255,.12),transparent 70%),radial-gradient(ellipse 60% 36% at 40% 100%,rgba(198,160,255,.14),transparent 70%);
  animation:dot-haze 11s ease-in-out infinite}
@keyframes dot-haze{0%,100%{opacity:.55}50%{opacity:1}}
.archives-hero,.records-shell{border-color:rgba(198,160,255,.5);box-shadow:0 0 38px rgba(198,160,255,.18),0 0 18px rgba(255,122,24,.1),inset 0 0 46px rgba(198,160,255,.05);animation:dot-panel 9s ease-in-out infinite}
@keyframes dot-panel{0%,100%{box-shadow:0 0 28px rgba(198,160,255,.14),0 0 14px rgba(255,122,24,.08),inset 0 0 40px rgba(198,160,255,.04)}50%{box-shadow:0 0 46px rgba(198,160,255,.26),0 0 20px rgba(255,122,24,.12),inset 0 0 54px rgba(198,160,255,.08)}}
.archives-hero{border-bottom-color:rgba(255,122,24,.6)}
.archive-index{border-top-color:rgba(198,160,255,.4);border-left-color:rgba(198,160,255,.4)}
.archive-index div{border-right-color:rgba(198,160,255,.36);border-bottom-color:rgba(198,160,255,.36)}
.archive-index dd{text-shadow:0 0 10px rgba(198,160,255,.55)}
.archive-index dt{color:#b9a3dd}
.eyebrow{color:var(--orange);text-shadow:0 0 10px rgba(198,160,255,.4)}
.archive-tab{border-color:rgba(198,160,255,.4)}
.archive-tab:hover{box-shadow:0 0 14px rgba(198,160,255,.3)}
.records-toolbar h2{text-shadow:0 0 12px rgba(198,160,255,.6),0 0 6px rgba(255,122,24,.3)}
.search-control span{color:#cbb6ee}
.search-control input{border-color:rgba(198,160,255,.5)}
.search-control input:focus{border-color:#c6a0ff;box-shadow:0 0 18px rgba(198,160,255,.4),inset 0 0 14px rgba(198,160,255,.1)}
.record-list-panel,.record-detail{border-color:rgba(198,160,255,.42);box-shadow:inset 0 0 30px rgba(198,160,255,.05),0 0 16px rgba(198,160,255,.1)}
.list-heading{border-bottom-color:rgba(198,160,255,.35);color:#cbb6ee}
.record-card{border-color:rgba(198,160,255,.3);transition:box-shadow .25s ease,border-color .25s ease}
.record-card:hover,.record-card:focus-visible{box-shadow:0 0 16px rgba(198,160,255,.35),inset 0 0 14px rgba(198,160,255,.08)}
.detail-topline span{color:#d9c8ff;text-shadow:0 0 10px rgba(198,160,255,.6)}
.record-detail h2,.detail-role{text-shadow:0 0 14px rgba(198,160,255,.55),0 0 8px rgba(255,122,24,.3)}
.record-detail h3{color:#d9c8ff;text-shadow:0 0 9px rgba(198,160,255,.5)}
.record-columns section,.detail-history,.detail-profile,.detail-appearance{border-color:rgba(198,160,255,.3)}
.record-meta{border-top-color:rgba(198,160,255,.35)}
.record-meta dt{color:#b9a3dd}
.return-map{border-color:rgba(198,160,255,.55);box-shadow:0 0 14px rgba(198,160,255,.18)}
.return-map:hover,.return-map:focus-visible{border-color:#fff;box-shadow:0 0 20px rgba(198,160,255,.45)}
.detail-empty span{color:#c6a0ff;text-shadow:0 0 18px rgba(198,160,255,.8);animation:dot-diamond 4s ease-in-out infinite}
@keyframes dot-diamond{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}
.record-list,.record-detail{scrollbar-color:#c6a0ff rgba(5,7,14,.9)}
html[data-time="night"] .dot-haze{opacity:.7}
@media(prefers-reduced-motion:reduce){.dot-haze,.archives-hero,.records-shell,.detail-empty span{animation:none}}