/* release.css - additions of the production release (2026-11): status labels, the Always-On device journey, form
   validation, loading states, translation robustness and right-to-left readiness. Loaded last; it extends the design
   cascade (neo → refinement → ecosystem → continuity) without replacing it. */

.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
html.modal-open{overflow:hidden}
:focus-visible{outline:2px solid #6ce9ff;outline-offset:3px}
button:focus-visible,a:focus-visible{outline:2px solid #6ce9ff;outline-offset:3px}

/* ---- Status: what is in operation, in development, upcoming, or an architecture target ---- */
.status-label.status-development{color:#c6b3ff}
.status-label.status-development .signal{background:#b79aff;box-shadow:0 0 0 4px #b79aff22}
[data-status="development"] small{color:#b8a8ef}
.orbit-node[data-status="development"] small{color:#b8a8ef}
.eco-vertical em.badge-development{color:#c6b3ff}
.status-chip{display:inline-flex;align-items:center;gap:7px;font:600 10px/1.4 "JetBrains Mono",monospace;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:999px;border:1px solid #4fd9a466;color:#9ff0cd;background:#0f2c2780;width:max-content;max-width:100%}
.status-chip i{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor;flex:none}
.status-chip.status-measured{border-color:#6fd8ff66;color:#a6ecff;background:#0f2a3d80}
.status-chip.status-target{border-color:#b79aff66;color:#d5c6ff;background:#221a3d80}
.layer-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 2px}
.layer-status small{font:600 10px "JetBrains Mono",monospace;letter-spacing:.12em;color:#7fa3c2}
.optimization-detail .status-chip{margin:2px 0 12px}
.optimization-tabs button[data-status="target"] span{color:#c6b3ff}

/* ---- LILI Always-On: one mission moving across devices ---- */
.always-on-today{font-size:14px!important;color:#9fc3dc;border-left:2px solid #6ce5ff66;padding-left:12px}
.presence-devices{display:contents}
.presence-device i{font-style:normal}
.presence-beam{fill:none;stroke:#8ff3ff;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:6 10;filter:drop-shadow(0 0 6px #49e1ff);animation:presence-beam-flow 1.1s linear infinite;opacity:.95}
@keyframes presence-beam-flow{to{stroke-dashoffset:-32}}
.presence-ring{position:absolute;inset:-9px;width:calc(100% + 18px);height:calc(100% + 18px);transform:rotate(-90deg);pointer-events:none;overflow:visible}
.presence-ring circle{fill:none;stroke:#3b6c95;stroke-width:2;opacity:.55}
.presence-ring .presence-ring-value{stroke:#7ff0ff;stroke-width:3;stroke-linecap:round;opacity:1;stroke-dasharray:18 100;transition:stroke-dasharray .9s ease;filter:drop-shadow(0 0 5px #5fe9ff)}
.presence-packet.p3{animation-delay:1.4s}
.presence-console[data-device="0"] .presence-packet{--tx:-158px;--ty:-83px}
.presence-console[data-device="1"] .presence-packet{--tx:158px;--ty:-83px}
.presence-console[data-device="2"] .presence-packet{--tx:-158px;--ty:83px}
.presence-console[data-device="3"] .presence-packet{--tx:158px;--ty:83px}
.presence-console .presence-packet{animation:presence-route 2.4s cubic-bezier(.45,0,.2,1) infinite}
@keyframes presence-route{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,0px))) scale(1);opacity:0}}
.presence-device-screen{display:flex;align-items:center;gap:10px;margin-top:12px;padding:9px 11px;border:1px solid #4f86b155;border-radius:9px;background:#0a1b2f;font:600 12px "JetBrains Mono",monospace;color:#cdeeff;position:relative;overflow:hidden}
.presence-device-screen i{font-style:normal;font-size:16px;color:#7ff0ff}
.presence-device-screen span{flex:1;min-width:0;overflow-wrap:anywhere}
.presence-device-screen em{position:absolute;left:0;bottom:0;height:2px;width:var(--p,0%);background:linear-gradient(90deg,#2f8fff,#7ff0ff);transition:width .9s ease}
.presence-device-screen.swap{animation:screen-swap .55s ease-out}
@keyframes screen-swap{from{opacity:0;transform:translateY(6px)}}
.presence-status{display:inline-block;margin-top:10px;font:600 10px/1.5 "JetBrains Mono",monospace;letter-spacing:.06em;padding:4px 8px;border-radius:6px;border:1px solid #6ce5ff55;color:#a6ecff}
.presence-status.status-roadmap{border-color:#b79aff66;color:#d5c6ff}
.presence-status.status-available{border-color:#4fd9a466;color:#9ff0cd}
.presence-status.status-partial,.presence-status.status-beta{border-color:#f2c66d66;color:#f4d593}
.presence-console:not(.is-playing) .presence-beam{animation-duration:2.4s}
.presence-event{min-height:198px!important}

/* ---- Access form: field-level validation and states ---- */
#access-form label>span:first-child{display:block}
.field-error{display:block;min-height:0;font-style:normal;font-size:13px;color:#ffb38a;margin-top:6px}
.field-error:empty{display:none}
.field-hint{display:block;font-size:12px;color:#7d9ab4;margin-top:6px}
#access-form [aria-invalid="true"]{border-color:#ff9d6c!important;box-shadow:0 0 0 3px #ff9d6c22}
#form-feedback.is-error{color:#ffc29d;background:#4a2a1d44;padding:14px 16px;border:1px solid #a8664577;border-radius:5px}
#form-feedback:empty{display:none}
#access-submit[aria-busy="true"]{cursor:progress;opacity:.8}
#access-submit.is-sent{background:linear-gradient(90deg,#9ee2c7,#7fd3ff)}

/* ---- Previews: loading state and the presentation note ---- */
.prototype-shell{position:relative;flex:1;min-height:0;display:flex}
.prototype-shell .prototype-loading{position:absolute;inset:0;display:grid;place-items:center;margin:0;font:600 12px "JetBrains Mono",monospace;letter-spacing:.08em;color:#8fb5d3;background:#080c17}
.prototype-shell.is-loaded .prototype-loading{display:none}
.experience-toolbar.is-presentation{gap:6px}
.experience-toolbar button[aria-pressed="true"]{border-color:#6ce9ff;color:#dffaff;background:#1c3c58}
.experience-toolbar .presentation-note{flex-basis:100%;margin-left:0!important;color:#9db7d3!important;font-size:12px}
.dossier-cta{display:flex;justify-content:flex-end;margin-top:18px}
#experience-body{display:flex;flex-direction:column;min-height:0;height:calc(100% - 60px)}

/* ---- Translation robustness: longer words and labels wrap instead of overflowing ---- */
h1,h2,h3,h4,.detail-title,.dossier-hero h2,.roadmap-card h3{overflow-wrap:break-word;hyphens:manual}
.roadmap-card p,.roadmap-card .domain,.stack-layer small,.eco-vertical small,.vertical-copy p,.detail-grid p,.dossier-features p,.layer-components span,.optimization-flow span,.layer-sequence span{overflow-wrap:anywhere}
.btn,.text-link{max-width:100%}
.topic-rail nav,.chapter-path{scrollbar-width:none}
.topic-rail nav::-webkit-scrollbar,.chapter-path::-webkit-scrollbar{display:none}

/* ---- Right-to-left readiness (Arabic or another RTL locale, once enabled) ---- */
[dir="rtl"] body{text-align:right}
[dir="rtl"] .btn>span,[dir="rtl"] .text-link>span[aria-hidden],[dir="rtl"] .roadmap-card-footer i,[dir="rtl"] .stack-layer em,[dir="rtl"] .optimization-tabs i,[dir="rtl"] .knowledge-grid i,[dir="rtl"] .eco-all-link span{display:inline-block;transform:scaleX(-1)}
[dir="rtl"] .vertical-selector button,[dir="rtl"] .eco-vertical,[dir="rtl"] .stack-layer{text-align:right}
[dir="rtl"] .presence-event{border-left:0;border-right:2px solid #6ce5ff}
[dir="rtl"] .always-on-today{border-left:0;padding-left:0;border-right:2px solid #6ce5ff66;padding-right:12px}
[dir="rtl"] .experience-toolbar small{margin-left:0;margin-right:auto}
[dir="rtl"] input[type="tel"],[dir="rtl"] input[type="email"]{text-align:left}

/* ---- Motion: the global pause and the visitor's preference stop every loop ---- */
body.paused .presence-beam,body.paused .presence-packet,body.paused .presence-halo{animation:none!important}
@media (prefers-reduced-motion:reduce){.presence-beam,.presence-packet,.presence-device-screen.swap{animation:none!important}.presence-ring .presence-ring-value,.presence-device-screen em{transition:none!important}}

/* Eyebrows rendered by script follow the uppercase style of the design in every language. */
.vertical-copy .eyebrow,.detail-eyebrow{text-transform:uppercase}
@media (max-width:760px){.always-on-today{border-left:0!important;padding-left:0!important;border-top:1px solid #6ce5ff44;padding-top:12px}}
/* Decorative orbits may extend past narrow screens: clip them (clip keeps sticky positioning, unlike hidden). */
.ecosystem-explorer,.hero-universe{overflow-x:clip}
html,body{overflow-x:clip}