/* Signal interruption: the real page splits into displaced RGB bands. */
.screen-signal{position:fixed;inset:0;overflow:hidden;z-index:50000;pointer-events:all;background:#0c092723;isolation:isolate;animation:signal-envelope 1.35s linear both}
.rocket-transition>button[data-action="transition-retry"]{right:103px}.rocket-transition>button[hidden]{display:none}
/* Opening a portfolio window must not freeze the archive's living foreground. */
body:not(.reduced) .planet-cloud-drift{animation:planet-cloud-flow 28s linear -8s infinite!important;animation-play-state:running!important}
body:not(.reduced) .cloud-wisp{animation:cloud-wisp-flow 24s linear -7s infinite!important;animation-play-state:running!important}
body:not(.reduced) .planet-foreground{animation:planet-breathe 16s ease-in-out -4s infinite alternate;transform-origin:50% 100%;animation-play-state:running!important}
body:not(.reduced) .archive-twinkles path{animation-play-state:running!important}
@keyframes planet-breathe{from{transform:translateY(3px) scale(1)}to{transform:translateY(-9px) scale(1.018)}}
.signal-ghost{position:absolute;inset:0;overflow:hidden;pointer-events:none;mix-blend-mode:screen;opacity:.75}
.signal-copy{position:absolute;inset:0;width:100vw;height:100vh;pointer-events:none}
.signal-copy *{animation:none!important;transition:none!important;caret-color:transparent!important}
.ghost-0{filter:sepia(.5) saturate(2.7) hue-rotate(135deg);clip-path:polygon(0 8%,100% 8%,100% 23%,0 23%,0 39%,100% 39%,100% 52%,0 52%,0 76%,100% 76%,100% 91%,0 91%);animation:signal-left 1.35s steps(1,end) both}
.ghost-1{filter:sepia(.7) saturate(2.8) hue-rotate(270deg);clip-path:polygon(0 0,100% 0,100% 8%,0 8%,0 23%,100% 23%,100% 39%,0 39%,0 52%,100% 52%,100% 76%,0 76%,0 91%,100% 91%,100% 100%,0 100%);animation:signal-right 1.35s steps(1,end) both}
.signal-raster{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 5px,#03101bb0 6px 8px);opacity:.6}
.signal-dropout{position:absolute;left:0;right:0;top:30%;height:18%;background:linear-gradient(#161d29e6,#71859b70 20%,#0a1224d9 25% 85%,#b4c3ca70);border-top:2px solid #ddd9dd80;animation:signal-roll 1.35s steps(2,end) both;mix-blend-mode:hard-light}
#app.screen-displaced{animation:screen-offset 1.35s steps(1,end) both}
@keyframes signal-envelope{0%{opacity:0}8%,82%{opacity:1}100%{opacity:0}}
@keyframes signal-left{0%{transform:translateX(-12px)}16%{transform:translate(65px,7px)}35%{transform:translate(-36px,-5px)}62%{transform:translate(25px,0)}83%{transform:translate(-14px,2px)}100%{transform:none}}
@keyframes signal-right{0%{transform:translateX(18px)}22%{transform:translate(-51px,-4px)}48%{transform:translate(39px,6px)}71%{transform:translate(-22px,0)}92%{transform:translateX(9px)}100%{transform:none}}
@keyframes screen-offset{0%,100%{transform:none;filter:none}12%{transform:translateX(-8px);filter:contrast(1.2) saturate(.65)}37%{transform:translate(7px,3px);filter:hue-rotate(15deg)}67%{transform:translateX(-3px);filter:contrast(1.12)}88%{transform:none;filter:none}}
@keyframes signal-roll{from{top:-20%}to{top:105%}}
.sea-shadow{z-index:9000;top:var(--shadow-y,8vh);height:70vh;filter:blur(3px)}
.sea-shadow.shadow-1{height:68vh;filter:blur(3px)}
.sea-shadow.shadow-2{height:83vh;filter:blur(6px)}
.sea-subtitle{position:fixed;bottom:57px;left:12px;right:12px;margin:0;z-index:9100;text-align:center;pointer-events:none;color:#f5f0e6;font:18px/1.7 SimSun,serif;letter-spacing:.08em;text-shadow:0 2px 3px #000,0 0 12px #000;background:linear-gradient(90deg,transparent,#0b112899 25% 75%,transparent);padding:12px 20px;animation:subtitle-arrive .65s ease both}
.sea-subtitle[hidden]{display:none}
@keyframes subtitle-arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
/* A silver/pink holographic log with moving foil and film-strip details. */
.log-home{background:#e9e5ec;filter:contrast(1.06) saturate(.86)}
.log-tabs{background:linear-gradient(#f1eff5,#adb4b7 48%,#d7dfdf 52%,#e5e0ea);padding-top:9px}
.log-mast{margin:14px 16px 0;padding:21px 22px 16px;border:1px solid #9fa7b1;border-top:5px double #77858e;box-shadow:inset 0 0 0 4px #ece6eb,4px 5px #b3aeba70;background:radial-gradient(circle,#7796a766 1.2px,transparent 1.8px) 0 0/6px 6px,linear-gradient(115deg,#ece1ed,#e8f0eb 42%,#cadce1 58%,#e5c4db 76%,#c5ccdd);overflow:hidden}
.log-mast:before{content:"";position:absolute;inset:-40%;pointer-events:none;background:linear-gradient(115deg,transparent 43%,#fff9 49%,#dabfeb66 52%,transparent 58%);transform:translateX(-65%);animation:foil-sweep 9s ease-in-out infinite}
.log-mast>div:first-child{position:relative;background:#f2edf0c9;border-left:2px solid #a07599;padding:10px 15px}
.log-mast h1{font-size:clamp(27px,3.5vw,46px);color:#344c58;text-shadow:2px 1px #e3b1d2,-1px -1px #fff;letter-spacing:.06em}
.log-mast h1 span{color:#876884;letter-spacing:.22em}
.log-mast>p{position:relative;background:linear-gradient(100deg,#283b45,#506770,#53435d);border:1px inset #dde5e0;box-shadow:1px 1px #fff8;color:#faf4ee}
.log-barcode{position:relative;border-block:1px solid #5d6975;opacity:.75}
.log-barcode:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,#eecff280,transparent);height:20%;animation:barcode-pass 5s linear infinite}
.log-board{background:radial-gradient(circle,#b49cbb55 1px,transparent 1.5px) 1px 1px/5px 5px,linear-gradient(140deg,#e9e6eb,#e4e9e8 60%,#d1d6e1)}
.mini-window h2{background:linear-gradient(#f7f3fc,#c3c8d0 45%,#93a4ac 49%,#c6ccce 60%,#e0dadf);color:#334656}
.mini-window{box-shadow:inset 1px 1px #fff,4px 5px #77869755}
.pinned-still{transition:transform .4s ease,filter .4s ease}.pinned-still:hover{transform:rotate(0) translateY(-3px);filter:drop-shadow(0 5px 5px #49334e33)}
.log-entry{border-style:solid;border-color:#a49bab;border-left:5px double #7e8f9f}.log-entry header small{letter-spacing:.2em}
.player-track i{animation:player-tracking 7s ease-in-out infinite alternate}
.digital-portrait{height:270px;background:linear-gradient(135deg,#bec6d5,#e8d1df 48%,#718490);box-shadow:inset 0 0 30px #28304955}
.portrait-signal .profile-character{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;object-position:center 12%;filter:contrast(1.08) saturate(.55)}
.portrait-signal:after{content:"";position:absolute;left:0;right:0;top:12%;height:6%;background:linear-gradient(90deg,#9fdae035,transparent,#dcb0d944);mix-blend-mode:screen;animation:portrait-tracking 8s steps(1,end) infinite;pointer-events:none}
.tracking-cross{display:none}
.galgame.narrative-dialog .gal-figure{width:340px;height:min(580px,67vh);left:12px;bottom:115px;overflow:visible;mask-image:linear-gradient(#000 82%,transparent)}
.galgame.narrative-dialog .gal-figure img{filter:blur(.6px) brightness(.85) contrast(1.14) drop-shadow(-3px 0 #a4d9df55) drop-shadow(3px 0 #d2a6d95c);opacity:.92;animation:xin-signal 8s steps(1,end) infinite}
.galgame.narrative-dialog .gal-figure .xin-afterimage{position:absolute;inset:0;opacity:.23;transform:translate(9px,-2px);filter:blur(2px) saturate(.4);clip-path:polygon(0 12%,100% 12%,100% 23%,0 23%,0 39%,100% 39%,100% 46%,0 46%,0 65%,100% 65%,100% 70%,0 70%);animation:xin-echo 6s steps(1,end) infinite}
@keyframes xin-echo{0%,100%{transform:translate(9px,-2px);opacity:.16}47%{transform:translate(-7px,2px);opacity:.3}51%{transform:translate(12px,0);opacity:.22}}
.galgame.narrative-dialog .gal-figure:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#a9b7d01c 4px 5px);mask-image:linear-gradient(transparent,#000 30% 85%,transparent);pointer-events:none}
.galgame.narrative-dialog .gal-body{border:1px solid #aab4c2;border-top:4px double #c0c2d5;background:linear-gradient(115deg,#161d2cfc,#242137fc);box-shadow:5px 7px #06091699,inset 0 0 0 4px #181d2d,inset 0 0 0 5px #69728060}
@keyframes foil-sweep{0%,20%{transform:translateX(-65%)}70%,100%{transform:translateX(65%)}}
@keyframes barcode-pass{from{top:0}to{top:100%}}
@keyframes player-tracking{from{margin-left:12%}to{margin-left:88%}}
@keyframes portrait-tracking{0%,85%,100%{transform:translateY(0);opacity:.25}87%{transform:translateY(110px);opacity:.8}90%{transform:translate(5px,60px);opacity:.6}93%{transform:translateY(160px);opacity:.4}}
@keyframes xin-signal{0%,82%,100%{transform:translate(var(--xin-x,0px),var(--xin-y,0px));opacity:.9}83%{transform:translateX(-5px);opacity:.7}85%{transform:translateX(3px);opacity:.85}87%{transform:translate(var(--xin-x,0px),var(--xin-y,0px));opacity:.92}}
.reduced .sea-shadow{display:block;transform:translateX(8vw) rotate(-8deg);opacity:0}
.reduced .sea-shadow.passing{opacity:.3}
@media(max-width:680px){.galgame.narrative-dialog .gal-figure{width:200px;height:350px;left:4px;bottom:150px}.sea-subtitle{font-size:15px;bottom:48px;padding:10px 12px}.log-mast{margin:10px;padding:14px}.log-mast h1{font-size:28px}.digital-portrait{height:240px}}
