/* Notae portal: every existing-page override is limited to the active reveal. */
#notae-status[hidden] { display: none !important; }
.notae-atmosphere {
 position: fixed;
 inset: 0;
 z-index: 64;
 pointer-events: none;
 opacity: 0;
 visibility: hidden;
 overflow: hidden;
 background:
  radial-gradient(ellipse at 76% 48%, #153e4a66, transparent 48%),
  linear-gradient(110deg, #03111980 0%, #03111999 42%, #020c17e8 100%);
 transition: opacity 900ms ease, visibility 900ms ease;
}
body.revealed {
 --notae-stage-width: min(660px, 51vw);
 --notae-stage-height: min(820px, calc(100dvh - 112px));
 --notae-side: clamp(20px, 2vw, 48px);
 --notae-floor: 68px;
}
.revealed .notae-atmosphere { opacity: 1; visibility: visible; }
.notae-orbit {
 position: absolute;
 right: calc(var(--notae-side) + var(--notae-stage-width) * .04);
 bottom: calc(var(--notae-floor) + var(--notae-stage-height) * .17);
 width: calc(var(--notae-stage-width) * .92);
 height: calc(var(--notae-stage-height) * .58);
 border: 1px solid #91f4dd66;
 border-radius: 50%;
 transform: rotate(-18deg);
 transform-origin: center;
 box-shadow: 0 0 26px #42ccbb12, inset 0 0 25px #42ccbb0a;
}
.notae-orbit::after {
 content: '';
 position: absolute;
 top: 12%;
 left: 14%;
 width: 5px;
 height: 5px;
 border-radius: 50%;
 background: #c8fff0;
 box-shadow: 0 0 9px #91f4dd66;
}
.notae-orbit.orbit-b {
 right: calc(var(--notae-side) + var(--notae-stage-width) * .09);
 bottom: calc(var(--notae-floor) + var(--notae-stage-height) * .14);
 width: calc(var(--notae-stage-width) * .82);
 height: calc(var(--notae-stage-height) * .64);
 border-color: #989fd55e;
 border-style: dashed;
 transform: rotate(46deg);
 box-shadow: none;
}
.notae-orbit.orbit-b::after { background: #b6bbe7; box-shadow: none; }
.revealed .notae-orbit.orbit-a { animation: notae-orbit-a 38s linear infinite; }
.revealed .notae-orbit.orbit-b { animation: notae-orbit-b 52s linear infinite; }
.notae-rail {
 position: absolute;
 left: clamp(22px, 4vw, 64px);
 top: 126px;
 color: #b5d8d0;
 font: 9px/1.6 'Courier New', monospace;
 font-weight: 600;
 letter-spacing: .22em;
 writing-mode: vertical-rl;
 padding: 18px 10px;
 border-left: 1px solid #92cdbb66;
}

/* Manuscript images carry the original folio detail in their alpha channels. */
body.revealed .notae-layer { z-index: 6 !important; }
body.revealed .notae-layer img {
 opacity: .72 !important;
 filter: brightness(1.1) contrast(1.12)
  drop-shadow(0 0 1px #c8fff0)
  drop-shadow(0 0 9px #63e9d080) !important;
 animation: notae-folio-suspend 10s ease-in-out infinite alternate;
 transition: opacity 1100ms ease;
}
body.revealed .dark .notae-layer img { opacity: .62 !important; }
body.revealed .contact .notae-layer img { opacity: .54 !important; }
body.revealed .notae-layer img:nth-child(2) { animation-delay: -4s; }
body.revealed .notae-layer img:nth-child(3) { animation-delay: -7s; }
body.revealed #notae-ae { opacity: .19; }

.revealed .secret-stage {
 width: var(--notae-stage-width);
 height: var(--notae-stage-height);
 right: var(--notae-side);
 bottom: var(--notae-floor);
 z-index: 80;
 filter: drop-shadow(0 12px 24px #00101899);
}
.revealed .code-window {
 top: 28%;
 left: 20%;
 width: 60%;
 height: 49%;
 border: 1px solid transparent;
 border-radius: 2px;
 transform: none;
 background:
  linear-gradient(145deg, #08252ef5, #02111af8) padding-box,
  linear-gradient(135deg, #c8fff0, #54cbbd 32%, #747fad 65%, #b1f9e5) border-box;
 box-shadow: 0 0 0 4px #03192360, 0 0 34px #4cdfc52b,
  inset 0 0 26px #0c4b552b;
 animation: notae-window-in 850ms cubic-bezier(.2,.7,.15,1) both;
 transition: box-shadow 1000ms ease;
}
.revealed .code-header {
 min-height: 34px;
 align-items: center;
 color: #baf3e2;
 background: #102f39e6;
 border-bottom: 1px solid #77aaad66;
 font-size: 8px;
 line-height: 1.4;
 letter-spacing: .14em;
 padding: 10px 13px;
}
.revealed .code-window pre {
 color: #9ad8c9;
 font-size: clamp(8px, .75vw, 11px);
 line-height: 1.85;
 padding: 15px 14px;
 text-shadow: none;
}
.revealed .code-scan { opacity: .24; animation-duration: 8s; }
.revealed .secret-stage canvas { filter: drop-shadow(0 14px 17px #000a14b3); }
.revealed .secret-caption {
 right: 8%;
 bottom: 11px;
 max-width: 84%;
 border-color: #83b7ab80;
 color: #b8e3d8;
 background: #041921e6;
 padding: 8px 10px;
 font-size: 8px;
 letter-spacing: .12em;
 line-height: 1.5;
}
body.revealed[data-notae-stage='emerging'] .code-window {
 box-shadow: 0 0 0 4px #03192360, 0 0 44px #4cdfc53d,
  inset 0 0 26px #0c4b552b;
}
body.revealed[data-notae-stage='connected'] .code-window {
 box-shadow: 0 0 0 4px #03192360, 0 0 34px #9de4d338,
  inset 0 0 26px #0c4b552b;
}

.revealed .notae-status {
 left: clamp(18px, 3vw, 48px);
 bottom: 20px;
 right: auto;
 z-index: 110;
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 11px;
 width: max-content;
 max-width: calc(100% - 36px);
 min-height: 44px;
 padding: 12px 16px;
 color: #a9d8ca;
 background: #051c25f5;
 border: 1px solid #76a99ba3;
 border-radius: 2px;
 box-shadow: 0 8px 26px #000d184d;
 pointer-events: auto;
 font-size: 9px;
 line-height: 1.6;
 letter-spacing: .08em;
}
.revealed .notae-status .live-dot { background: #a5f4d7; margin-right: 0; flex: 0 0 5px; }
.revealed .notae-stage-label { color: #d5f7eb; letter-spacing: .14em; }
.revealed .notae-status > span:last-child { margin-left: 0; }
.revealed #notae-close {
 position: fixed;
 top: 98px;
 right: clamp(18px, 3vw, 48px);
 z-index: 111;
 min-height: 44px;
 min-width: 84px;
 padding: 11px 16px;
 color: #d5f7eb;
 background: #051c25f5;
 border: 1px solid #9bcebea3;
 border-radius: 2px;
 box-shadow: 0 8px 26px #000d184d;
 font: 600 10px/1.4 'Courier New', monospace;
 letter-spacing: .12em;
 text-transform: uppercase;
 pointer-events: auto;
 transition: background 200ms ease, border-color 200ms ease;
}
.revealed #notae-close:hover { background: #123b42; border-color: #d5f7eb; }
.revealed #notae-close:focus-visible { outline: 3px solid #baf3e2; outline-offset: 4px; }

@keyframes notae-orbit-a { from { transform: rotate(-18deg); } to { transform: rotate(342deg); } }
@keyframes notae-orbit-b { from { transform: rotate(46deg); } to { transform: rotate(-314deg); } }
@keyframes notae-folio-suspend { from { translate: 0 0; } to { translate: 0 -9px; } }
@keyframes notae-window-in {
 from { opacity: 0; transform: translateY(12px); }
 to { opacity: 1; transform: none; }
}

@media (max-width: 760px) {
 body.revealed {
  --notae-stage-width: min(420px, calc(100vw - 24px));
  --notae-stage-height: min(650px, calc(100dvh - 145px));
  --notae-side: 12px;
  --notae-floor: 90px;
 }
 .notae-atmosphere {
  background: radial-gradient(ellipse at 50% 46%, #123c4866, transparent 60%),
   linear-gradient(180deg, #031119b3, #020c17eb);
 }
 .notae-rail { left: 18px; top: 94px; writing-mode: horizontal-tb; padding: 9px 0 9px 10px; font-size: 8px; letter-spacing: .14em; }
 .revealed .code-header { font-size: 7px; letter-spacing: .06em; min-height: 29px; padding: 8px 10px; }
 .revealed .code-window pre { font-size: 8px; line-height: 1.75; padding: 11px 10px; }
 .revealed .secret-caption { font-size: 7px; padding: 7px 8px; letter-spacing: .08em; }
 .revealed .notae-status { left: 12px; right: 12px; bottom: 12px; width: auto; max-width: none; gap: 8px; padding: 12px 13px; font-size: 8px; letter-spacing: .05em; }
 .revealed .notae-stage-label { letter-spacing: .1em; }
 .revealed #notae-close { right: 12px; top: 88px; min-width: 78px; padding-inline: 12px; font-size: 9px; }
 body.revealed .notae-layer img { opacity: .62 !important; }
 body.revealed .dark .notae-layer img { opacity: .54 !important; }
 body.revealed #notae-ae { opacity: .14; }
}

/* The archive remains fully visible when motion is paused or reduced. */
.paused .notae-atmosphere, .paused .secret-stage, .paused .code-window,
.paused .notae-layer img { transition: none !important; }
.paused.revealed .code-window { animation: none !important; opacity: 1; transform: none; }
.paused .notae-orbit, .paused .notae-layer img, .paused .code-scan { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
 html:not(.motion-opt-in) .notae-atmosphere,
 html:not(.motion-opt-in) .revealed .secret-stage,
 html:not(.motion-opt-in) .revealed .code-window,
 html:not(.motion-opt-in) .revealed .notae-layer img { transition: none !important; }
 html:not(.motion-opt-in) .revealed .notae-orbit,
 html:not(.motion-opt-in) .revealed .notae-layer img,
 html:not(.motion-opt-in) .revealed .code-window,
 html:not(.motion-opt-in) .revealed .code-scan { animation: none !important; }
 html:not(.motion-opt-in) .revealed .code-window { opacity: 1; transform: none; }
}
