/* JonesCTL 6.0 — codename mythos / deeper escalation layer */

.classification-readout{border-left:1px solid var(--line);padding-left:20px;color:#51636d}
.classification-readout b{color:#93a5ae;font-weight:500}
.black-channel-haze{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:0;background:radial-gradient(circle at 72% 36%,rgba(186,156,255,.09),transparent 18rem),conic-gradient(from 90deg at 72% 36%,transparent 0 86deg,rgba(186,156,255,.03) 89deg 92deg,transparent 95deg 360deg);transition:opacity 1.2s ease}
.black-channel-known .black-channel-haze,.black-channel-active .black-channel-haze,.gate-opened .black-channel-haze{opacity:.8}

.topology-node-pharos circle:first-child{stroke:#5c486f;stroke-dasharray:2 3}
.topology-node-pharos .node-core{fill:var(--violet);filter:drop-shadow(0 0 4px rgba(186,156,255,.45))}
.pharos-beam{position:absolute;left:68%;top:7%;width:1px;height:86%;pointer-events:none;opacity:0;transform:rotate(67deg);transform-origin:top center;background:linear-gradient(to bottom,rgba(209,191,255,.8),rgba(186,156,255,.12) 45%,transparent);box-shadow:0 0 12px rgba(186,156,255,.55),0 0 38px rgba(186,156,255,.18)}
.pharos-beam:after{content:"";position:absolute;top:0;left:-13px;width:26px;height:100%;background:linear-gradient(to bottom,rgba(186,156,255,.12),rgba(186,156,255,.025),transparent);clip-path:polygon(48% 0,52% 0,100% 100%,0 100%)}
.pharos-beam-live{animation:pharos-sweep 3.8s cubic-bezier(.22,.7,.2,1)}

.sideband{margin-top:18px;min-height:58px;border:1px solid #29233a;background:linear-gradient(90deg,rgba(186,156,255,.05),transparent 40%),#05080c;display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:18px;padding:0 18px;opacity:0;transform:translateY(6px);pointer-events:none;transition:.45s ease}
.sideband-visible{opacity:1;transform:none;pointer-events:auto}
.sideband-label{font-size:8px;letter-spacing:.2em;color:#716083}
.sideband b{color:#d3baff;font:600 18px var(--mono);letter-spacing:.12em}
.sideband span:last-child{color:#655974;font-size:9px}
.sideband-alert{animation:sideband-alert 1.7s ease}

.black-channel-known .topology-node-pharos circle:first-child,.gate-opened .topology-node-pharos circle:first-child{stroke:#b99cf4;filter:drop-shadow(0 0 8px rgba(186,156,255,.45))}
.black-channel-known .topology-node-pharos text,.gate-opened .topology-node-pharos text{fill:#cdb8ec}
.gate-opened .topology-node-pharos .node-core{animation:pharos-core 2.7s ease-in-out infinite}
.gate-opened .classification-readout b{color:var(--amber)}
.gate-opened .brand-mark{color:#e8d8ff;border-color:#58466d;box-shadow:inset 0 0 22px rgba(186,156,255,.1),0 0 24px rgba(186,156,255,.08)}
.gate-opened .brand-mark:after{content:" XVII";color:var(--violet);font-size:7px}

.transmission-overlay,.phase-three{position:fixed;inset:0;z-index:130;visibility:hidden;opacity:0;overflow:hidden;transition:opacity .55s ease,visibility .55s}
.transmission-overlay{display:grid;place-items:center;background:radial-gradient(circle at 54% 48%,rgba(186,156,255,.08),transparent 30%),#010204}
.transmission-visible{visibility:visible;opacity:1}
.transmission-lines{position:absolute;inset:-20%;background:repeating-linear-gradient(90deg,transparent 0 70px,rgba(186,156,255,.018) 71px 72px),repeating-linear-gradient(0deg,transparent 0 5px,rgba(255,255,255,.012) 5px 6px);transform:perspective(500px) rotateX(62deg) translateY(24%);animation:carrier-grid 8s linear infinite}
.transmission-glyph{position:absolute;right:-2vw;top:50%;transform:translateY(-50%);font:850 clamp(180px,38vw,620px)/.72 var(--display);letter-spacing:-.1em;color:rgba(186,156,255,.025)}
.transmission-content{width:min(980px,calc(100% - 44px));position:relative;z-index:2;padding:50px 0}
.transmission-content>span{display:block;color:#997eb6;font-size:9px;letter-spacing:.28em;margin-bottom:30px}
.transmission-content h2{margin:0;color:#f5f0ff;font:770 clamp(54px,10vw,128px)/.82 var(--display);letter-spacing:-.067em}
.transmission-content h2 em{color:#8b71a8;font-style:normal}
.transmission-content p{max-width:660px;color:#877a95;font-size:13px;line-height:1.8;margin:30px 0 0}
.transmission-seal{margin-top:30px;border-left:1px solid #765d94;padding:10px 14px;color:#a98cbf;background:rgba(186,156,255,.025);font-size:9px;letter-spacing:.14em}
.transmission-content button,.gate-content button{margin-top:34px;border:1px solid #3d304c;background:transparent;color:#8f78a8;padding:11px 14px;font-size:9px;letter-spacing:.12em;cursor:pointer}
.transmission-content button:hover,.gate-content button:hover{color:#dcc7f5;border-color:#71578c}

.phase-three{display:grid;place-items:center;background:#010203;z-index:140}
.gate-visible{visibility:visible;opacity:1}
.gate-rings{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.gate-rings i{position:absolute;width:min(72vw,840px);aspect-ratio:1;border:1px solid rgba(241,193,107,.12);border-radius:50%;box-shadow:0 0 60px rgba(241,193,107,.02);animation:gate-ring 7s ease-in-out infinite}
.gate-rings i:nth-child(2){width:min(59vw,690px);animation-delay:-1.2s}.gate-rings i:nth-child(3){width:min(46vw,540px);animation-delay:-2.4s}.gate-rings i:nth-child(4){width:min(33vw,390px);animation-delay:-3.6s}.gate-rings i:nth-child(5){width:min(20vw,240px);animation-delay:-4.8s}
.gate-beam{position:absolute;top:0;bottom:0;left:50%;width:2px;background:linear-gradient(to bottom,transparent,rgba(241,193,107,.7) 45%,rgba(186,156,255,.55) 55%,transparent);box-shadow:0 0 45px rgba(241,193,107,.28);animation:gate-beam 2.6s ease-in-out infinite}
.gate-content{position:relative;z-index:2;width:min(980px,calc(100% - 44px));text-align:center}
.gate-content>span{display:block;color:#b89960;font-size:9px;letter-spacing:.34em;margin-bottom:30px}
.gate-content h2{margin:0;color:#fff4df;font:790 clamp(58px,11vw,140px)/.8 var(--display);letter-spacing:-.07em;text-shadow:0 0 45px rgba(241,193,107,.08)}
.gate-content p{max-width:720px;margin:34px auto 0;color:#9b8e7a;font-size:13px;line-height:1.8}
.gate-key{width:max-content;max-width:100%;margin:32px auto 0;border:1px solid #4e4232;background:rgba(241,193,107,.025);color:#d8b978;padding:10px 14px;font-size:10px;letter-spacing:.18em}
.gate-event .noise{opacity:.055}.gate-event .grid-glow{background-image:linear-gradient(rgba(241,193,107,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(186,156,255,.018) 1px,transparent 1px)}

body.glitch-hit .console-wrap{animation:console-glitch .38s steps(2,end)}
body.glitch-hit .field-header h2{animation:text-glitch .38s steps(2,end)}

@keyframes pharos-sweep{0%{opacity:0;transform:rotate(28deg)}16%{opacity:.75}52%{opacity:.24}78%{opacity:.7}100%{opacity:0;transform:rotate(108deg)}}
@keyframes pharos-core{0%,100%{opacity:.6;filter:drop-shadow(0 0 3px rgba(186,156,255,.2))}50%{opacity:1;filter:drop-shadow(0 0 10px rgba(186,156,255,.85))}}
@keyframes sideband-alert{0%{opacity:.2;transform:translateX(-3px)}12%{opacity:1;transform:translateX(2px)}24%{opacity:.55;transform:translateX(-1px)}42%,100%{opacity:1;transform:none}}
@keyframes carrier-grid{to{transform:perspective(500px) rotateX(62deg) translateY(24%) translateX(72px)}}
@keyframes gate-ring{0%,100%{opacity:.18;transform:scale(.97)}50%{opacity:.72;transform:scale(1.025)}}
@keyframes gate-beam{0%,100%{opacity:.3;transform:scaleY(.88)}50%{opacity:1;transform:scaleY(1.03)}}
@keyframes console-glitch{0%{transform:none;filter:none}18%{transform:translateX(-2px);filter:hue-rotate(18deg)}36%{transform:translateX(3px)}54%{transform:translateX(-1px);filter:hue-rotate(-11deg)}100%{transform:none;filter:none}}
@keyframes text-glitch{0%,100%{transform:none}25%{transform:translateX(2px);opacity:.5}50%{transform:translateX(-3px);opacity:1}75%{transform:translateX(1px)}}

@media (max-width:850px){.classification-readout{display:none}.transmission-content h2{font-size:60px}.gate-content h2{font-size:64px}}
@media (max-width:560px){.sideband{grid-template-columns:1fr auto;gap:4px 12px;padding:10px 12px}.sideband span:last-child{grid-column:1/-1}.transmission-content h2{font-size:44px}.gate-content h2{font-size:48px}.gate-content p,.transmission-content p{font-size:11px}.gate-rings i:first-child{width:96vw}}
@media (prefers-reduced-motion:reduce){.pharos-beam,.gate-rings i,.gate-beam,.transmission-lines{animation:none!important}}
