/* EYEKON local concept: one continuous roster, using the original brand palette and type. */
/* The DOM keeps its original typesetting. A glyph canvas takes over only in motion. */
.signal-heading{position:relative;isolation:isolate}.signal-source{display:block}.signal-scan{position:absolute;top:-160px;left:0;pointer-events:none;max-width:none;z-index:1}html.js-anim .sx .head.signal-heading{opacity:1;transform:none;transition:none}
/* Original EYEKON service diagrams. */
.service-experience{display:grid;grid-template-columns:.9fr 1.25fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.service-menu{padding:22px 38px 22px 0}.service-tab{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:23px 0}.service-tab:last-child{border-bottom:0}.service-tab-title{display:flex;align-items:center;gap:15px}.service-tab .service-number{font:11px var(--font-mono);color:var(--fog);min-width:23px}.service-tab strong{font:900 clamp(20px,2vw,30px)/1.05 var(--font-display);text-transform:uppercase;letter-spacing:-.02em;color:var(--fog);transition:color .35s}.service-tab[aria-selected="true"] strong,.service-tab:hover strong{color:var(--paper)}.service-tab .service-description{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .65s cubic-bezier(.2,.8,.2,1),opacity .4s;max-width:36ch;margin-left:38px}.service-tab .service-description span{overflow:hidden;color:var(--fog);font-size:14px;line-height:1.6}.service-tab[aria-selected="true"] .service-description{grid-template-rows:1fr;opacity:1}.service-tab[aria-selected="true"] .service-description span{padding-top:16px}
.service-screen{border-left:1px solid var(--line);position:relative;min-height:490px;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.service-screen::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,#f1f0ec06,transparent 68%);pointer-events:none}.service-screen-label{position:absolute;left:28px;top:25px;font:10px var(--font-mono);color:var(--fog);letter-spacing:.12em;text-transform:uppercase}.service-screen-count{position:absolute;right:28px;bottom:24px;font:10px var(--font-mono);color:var(--fog);letter-spacing:.1em}.service-film{width:100%;height:100%;position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:translateY(15px);filter:blur(7px);transition:opacity .7s,transform .9s cubic-bezier(.16,1,.3,1),filter .8s;pointer-events:none;visibility:hidden}.service-film.active{opacity:1;transform:none;filter:none;visibility:visible;pointer-events:auto}.service-film svg{width:100%;height:auto;max-height:480px;overflow:visible}.service-film text{font-family:var(--font-mono);font-size:10px;letter-spacing:1.4px;fill:var(--fog)}
.service-film .film-float{animation:film-float 12s ease-in-out infinite}.service-film .film-float.second{animation-delay:-4s}.service-film .film-float.third{animation-delay:-8s}@keyframes film-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}.service-film .film-trace{stroke-dasharray:20 380;animation:film-trace 12s linear infinite}@keyframes film-trace{to{stroke-dashoffset:-800}}.service-film .film-turn{transform-origin:300px 225px;animation:film-turn 70s linear infinite}@keyframes film-turn{to{transform:rotate(360deg)}}.service-film .film-pulse{animation:film-pulse 8s ease-in-out infinite}@keyframes film-pulse{0%,100%{opacity:.3}50%{opacity:1}}.service-film .film-scan{animation:film-scan 10s ease-in-out infinite}@keyframes film-scan{0%,100%{transform:translateY(-36px);opacity:0}20%,80%{opacity:.8}50%{transform:translateY(70px);opacity:1}}
.service-experience:not(.in-view) .service-film *,.service-experience.motion-paused .service-film *,.service-film:not(.active) *{animation-play-state:paused!important}

html{scroll-padding-top:92px;scrollbar-gutter:stable}
/* The sticky interval is followed by the same grid in normal document scrolling. */
.creators{overflow:visible;padding-bottom:0}
.network-experience{width:100%;margin-top:36px;--roster-gutter:40px;--roster-columns:6;--roster-gap:22px;--roster-row-gap:30px;--roster-identity:72px;--roster-pin:84px;--roster-stage:690px;--field-opacity:1;--roster-progress:0}
.network-experience [hidden],.service-experience [hidden]{display:none!important}
.network-experience button,.service-experience button{font:inherit;color:inherit;cursor:pointer}
.network-sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.roster-runway{position:relative;overflow:visible;overflow-anchor:none}
.roster-sticky{position:sticky;top:var(--roster-pin)}
.roster-toolbar{height:76px;padding:0 var(--roster-gutter);display:flex;align-items:center;justify-content:flex-end;gap:24px;position:relative;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--ink);z-index:120}
.roster-toolbar::after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:1px;background:var(--paper);transform-origin:left;transform:scaleX(var(--roster-progress));opacity:.7}
.roster-explore{display:flex;align-items:center;gap:26px;min-height:44px;padding:9px 0 9px 12px;background:none;border:0;font:12px var(--font-mono)!important}
.roster-explore span{font:22px var(--font-body);transition:transform .3s}
.roster-explore:hover span{transform:translate(3px,3px)}
.roster-explore:hover{text-decoration:underline;text-underline-offset:5px}
.roster-search{display:flex;align-items:center;gap:10px;width:260px;min-height:44px;color:var(--fog);border-bottom:1px solid var(--line)}
.roster-search:focus-within{border-color:var(--paper)}
.roster-search svg{width:15px;height:15px;flex:none}
.roster-search input{background:none;border:0;color:var(--paper);font:12px var(--font-mono);padding:10px 0;outline:0;min-width:0;width:100%;border-radius:0}
.roster-search input::placeholder{color:var(--fog);opacity:1}
.roster-search input::-webkit-search-cancel-button{display:none}
.roster-search:has(input:focus-visible){outline:1px solid var(--paper);outline-offset:4px}
.roster-clear{background:none;border:0;min-width:44px;min-height:44px;font:22px var(--font-body)!important}
.roster-stage{position:relative;padding:24px 0 clamp(32px,4vw,64px);isolation:isolate}
.roster-field{position:absolute;inset:24px 0 auto;height:var(--roster-stage);pointer-events:none;opacity:var(--field-opacity);overflow:hidden}
.field-coordinate,.field-hint{position:absolute;font:9px/1.5 var(--font-mono);color:var(--fog);letter-spacing:.1em;text-transform:uppercase}
.field-coordinate{right:var(--roster-gutter);bottom:22px;font-size:8px;opacity:.7}
.field-hint{left:var(--roster-gutter);bottom:18px;white-space:nowrap;display:flex;align-items:center;gap:16px}
.field-hint span{font-size:18px;color:var(--paper)}
.roster-grid{position:relative;display:grid;margin:0 var(--roster-gutter);grid-template-columns:repeat(var(--roster-columns),minmax(0,1fr));gap:var(--roster-row-gap) var(--roster-gap);outline-offset:8px}
.roster-cell{position:relative;min-width:0;--identity-opacity:0}
/* The explicit pixel origin is written from the same measured column geometry as the motion. */
.roster-cell{transform-origin:50% var(--roster-card-center,80px)}
.network-experience[data-ready="false"] .roster-cell{will-change:transform;pointer-events:none}
.roster-person{display:block;min-width:0;outline-offset:6px}
.roster-portrait{display:block;position:relative;aspect-ratio:1;overflow:hidden;background:#101010;border:1px solid #f1f0ec24}
.roster-portrait::after{content:"";position:absolute;inset:0;border:1px solid var(--paper);opacity:0;transition:opacity .4s;pointer-events:none}
.roster-portrait img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06);transition:filter .6s,transform .8s cubic-bezier(.16,1,.3,1)}
.roster-person:hover img,.roster-person:focus-visible img{filter:none;transform:scale(1.04)}
.roster-person:hover .roster-portrait::after,.roster-person:focus-visible .roster-portrait::after{opacity:.7}
.roster-identity{display:block;height:var(--roster-identity);padding-top:12px;opacity:var(--identity-opacity)}
.roster-identity strong{display:block;font:900 clamp(16px,1.7vw,22px)/1.05 var(--font-display);text-transform:uppercase;letter-spacing:-.02em;overflow-wrap:anywhere}
.roster-identity small{display:block;font:10px/1.4 var(--font-mono);color:var(--fog);margin-top:6px;overflow-wrap:anywhere}
.you-person .roster-portrait{border:1px dashed #f1f0ec77;background:transparent;display:grid;place-items:center}
.you-type{font:900 clamp(29px,4vw,60px)/1 var(--font-display);letter-spacing:-.055em;text-transform:uppercase}
.you-cross{position:absolute;right:10px;top:6px;color:var(--fog);font:20px var(--font-mono)}
.roster-empty{font:13px/1.7 var(--font-body);color:var(--fog);margin:0 var(--roster-gutter) 28px;max-width:35ch}
.reduced-roster .roster-sticky{position:relative;top:auto}
.reduced-roster .roster-field{display:none}

@media(max-width:1050px){.service-menu{padding-right:25px}.service-screen{min-height:450px}}
@media(max-width:760px){
  .network-experience{margin-top:24px}
  .roster-toolbar{gap:12px}
  .roster-explore{font-size:10px!important;gap:14px;max-width:190px;text-align:left;line-height:1.5!important}
  .roster-search{width:48%;gap:8px}.roster-search input{font-size:11px}.roster-search svg{width:13px}
  .roster-identity small{font-size:9px;line-height:1.4}
  .field-coordinate{display:none}.field-hint{font-size:8px;letter-spacing:.04em}
  .service-experience{grid-template-columns:1fr}.service-menu{padding:0;display:flex;overflow-x:auto;scrollbar-width:thin;border-bottom:1px solid var(--line)}.service-tab{flex:0 0 175px;width:175px;padding:22px 18px;border-bottom:0;border-right:1px solid var(--line)}.service-tab-title{align-items:flex-start;gap:8px}.service-tab strong{font-size:19px}.service-tab .service-number{font-size:9px;min-width:17px}.service-tab .service-description{display:none}.service-screen{border-left:0;min-height:420px}.service-mobile-description{position:absolute;bottom:22px;left:24px;right:24px;font-size:13px;color:var(--fog);line-height:1.6;max-width:46ch}.service-screen-count{display:none}.service-film svg{transform:translateY(-15px);max-height:360px}
}
@media(min-width:761px){.service-mobile-description{display:none}}
@media(max-width:440px){.service-screen{min-height:375px}.roster-explore{max-width:150px;gap:10px}.roster-toolbar{height:70px}.you-cross{font-size:16px;right:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.signal-source{opacity:1!important}.signal-scan{display:none}.service-film *{animation:none!important}.service-film,.service-description,.roster-person img,.roster-explore span{transition:none!important}.roster-cell{will-change:auto!important}}

/* Whole-surface client branding. The original artwork returns to colour on interaction. */
.orbit-directory{scroll-margin-top:110px}
.orbit-directory summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:48px;font:12px var(--font-mono);list-style:none}
.orbit-directory summary::-webkit-details-marker{display:none}
.orbit-directory summary::after{content:'+';font:25px var(--font-mono);color:var(--fog)}
.orbit-directory[open] summary::after{content:'−'}
#orbitDirectory{gap:20px;margin-top:20px}
#orbitDirectory .connection-slice{position:relative;display:block;height:clamp(190px,18vw,265px);padding:0;border:1px solid #f1f0ec24;overflow:hidden;isolation:isolate;background:#101010;outline-offset:5px}
.connection-visual{position:absolute;inset:0;filter:grayscale(1);transition:filter .8s cubic-bezier(.2,.65,.2,1),transform 1.1s cubic-bezier(.16,1,.3,1);transform:scale(1);pointer-events:none}
.connection-bleed{position:absolute;width:100%;height:100%;object-fit:cover;filter:blur(28px);transform:scale(1.3);opacity:.1}
.connection-logo{position:absolute;right:0;top:-4%;height:108%;width:88%;object-fit:contain;object-position:right center;padding:10px 24px 10px 0;mask-image:linear-gradient(90deg,transparent,black 14%,black 91%,transparent)}
.connection-caption{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:24px 22px;background:linear-gradient(0deg,#000e 0%,#0009 24%,#0001 62%,transparent);color:#f1f0ec;pointer-events:none}
#orbitDirectory .connection-caption strong{font:900 clamp(22px,2.1vw,31px)/1.05 var(--font-display);text-transform:uppercase;letter-spacing:-.02em;text-wrap:balance}
#orbitDirectory .connection-caption span{font:10px/1.6 var(--font-mono);color:#d3d1ca;margin-top:8px;max-width:90%}
#orbitDirectory .connection-slice:hover .connection-visual,#orbitDirectory .connection-slice:focus-visible .connection-visual{filter:grayscale(0);transform:scale(1.035)}
#orbitDirectory .connection-slice:hover,#orbitDirectory .connection-slice:focus-visible{border-color:#f1f0ec88}
@media(max-width:800px){#orbitDirectory{gap:16px}#orbitDirectory .connection-slice{height:215px}}
@media(max-width:540px){#orbitDirectory{gap:14px}#orbitDirectory .connection-slice{height:220px}.connection-caption{padding:22px}.connection-logo{right:5%;width:85%}}
@media(hover:none){#orbitDirectory .connection-slice:active .connection-visual{filter:grayscale(0)}}
@media(prefers-reduced-motion:reduce){.connection-visual{transition:none}}

/* Actual creator films, framed in the same monochrome language as the roster. */
.ugc-showcase{width:100%;padding:68px 28px 50px}
.ugc-reels{display:grid;grid-template-columns:repeat(3,minmax(200px,1fr));align-items:start;gap:13px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;padding-bottom:8px}
.ugc-reel{scroll-snap-align:start;display:block;background:none;border:0;padding:0;text-align:left;min-width:0;outline-offset:6px}
.ugc-reel:nth-child(2){margin-top:27px}
.ugc-image{display:block;position:relative;aspect-ratio:9/16;overflow:hidden;border:1px solid #f1f0ec35;background:#171717}
.ugc-image>img,.ugc-image>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .7s,opacity .5s}
.ugc-image>video,.ugc-embed-slot{opacity:0}
.ugc-embed-slot,.ugc-embed-slot iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.ugc-reel.is-previewing.has-video .ugc-embed-slot{opacity:1}
.ugc-reel.is-previewing.has-video video{opacity:1;filter:grayscale(0)}
.ugc-reel:hover img,.ugc-reel:focus-visible img{filter:grayscale(0)}
.ugc-image::after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}
.ugc-play{position:absolute;left:10px;bottom:12px;z-index:1;display:flex;align-items:center;gap:6px;color:#fff;font:10px var(--font-mono)}
.service-film .ugc-play svg{width:20px;height:20px;max-height:none;transform:none;fill:none;stroke:currentColor;stroke-width:1.2}
.ugc-duration{position:absolute;right:10px;bottom:15px;color:#fff;font:9px var(--font-mono);z-index:1}
.ugc-name{display:block;font:900 clamp(17px,1.6vw,23px)/1.05 var(--font-display);text-transform:uppercase;letter-spacing:-.02em;margin-top:13px}
.ugc-subject{display:block;font:9px/1.5 var(--font-mono);color:var(--fog);margin-top:7px}
.ugc-caption{font:9px/1.5 var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--fog);margin:24px 0 0;display:flex;align-items:center;justify-content:center;gap:8px 18px;flex-wrap:wrap}
.ugc-preview-toggle{color:var(--paper);background:none;border:0;border-bottom:1px solid var(--line);padding:8px 0;min-height:44px;font:inherit;text-transform:uppercase;letter-spacing:inherit;cursor:pointer}
.ugc-preview-toggle:hover{border-color:var(--paper)}
.showing-ugc .service-screen{min-height:clamp(520px,44vw,640px)}
.showing-ugc .service-film.active{position:relative;height:auto}
.showing-ugc .service-mobile-description{display:none}
.ugc-viewer{position:fixed;inset:0;width:min(660px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:22px;background:#0a0a0a;color:#f1f0ec;border:1px solid #f1f0ec44;overflow:auto}
.ugc-viewer::backdrop{background:#050505e8;backdrop-filter:blur(12px)}
.ugc-viewer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.ugc-viewer-top>div>span{font:9px var(--font-mono);color:var(--fog);letter-spacing:.1em}
.ugc-viewer h2{font:900 clamp(20px,3vw,28px)/1.1 var(--font-display);text-transform:uppercase;margin:9px 0 0;letter-spacing:-.02em}
.ugc-close{flex:none;background:none;color:inherit;border:1px solid #f1f0ec55;width:44px;height:44px;font:26px var(--font-body);cursor:pointer}
.ugc-viewer [hidden]{display:none!important}
.ugc-external-video{height:min(65dvh,700px);aspect-ratio:9/16;max-width:100%;margin:auto}
.ugc-external-video iframe{width:100%;height:100%;border:0;display:block}
.ugc-full-video{display:block;margin:0 auto;max-width:100%;width:auto;height:min(65dvh,700px);background:#000}
.ugc-viewer-bottom{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-top:18px;font:12px/1.6 var(--font-body)}
.ugc-viewer-bottom p{margin:0;max-width:37ch;color:var(--fog)}
.ugc-original{font:10px/1.7 var(--font-mono);text-decoration:underline;text-underline-offset:4px;flex:none;min-height:44px;display:flex;align-items:center}
.ugc-error{font:12px/1.5 var(--font-body);border-top:1px solid var(--line);padding-top:14px}
@media(max-width:1050px) and (min-width:761px){.ugc-showcase{padding-inline:18px}.ugc-reels{gap:9px}.ugc-play{left:7px}.ugc-duration{right:7px}.ugc-play>span{display:none}}
@media(max-width:760px){.ugc-showcase{padding:62px 22px 28px}.showing-ugc .service-screen{min-height:clamp(430px,88vw,620px)}.ugc-name{font-size:clamp(17px,3.1vw,23px)}.ugc-caption{margin-top:22px}.ugc-reels{gap:10px}}
@media(max-width:440px){.ugc-showcase{padding-inline:16px}.ugc-reels{gap:8px}.ugc-play>span{display:none}.ugc-subject{font-size:8px}.ugc-duration{right:7px;font-size:8px}.ugc-play{left:7px}.ugc-name{font-size:17px}.ugc-viewer{padding:16px}.ugc-viewer-bottom{display:block}.ugc-original{margin-top:12px}.ugc-full-video,.ugc-external-video{height:58dvh}}
@media(prefers-reduced-motion:reduce){.ugc-image>img,.ugc-image>video{transition:none}}

/* Sections enter as complete compositions. Keep their scroll-reference boxes stationary. */
.chapter-surface{opacity:var(--chapter-opacity,1);transform:translate3d(0,var(--chapter-y,0px),0);clip-path:inset(0 var(--chapter-inset,0%));}
.chapter-spatial{transform:none;clip-path:none}
.chapter-settled{transform:none;clip-path:none}
.chapter-surface:focus-within{opacity:1;transform:none;clip-path:none}
.roster-grid{opacity:var(--roster-departure-opacity,1)}
.network-experience:focus-within .roster-grid{opacity:1}

/* The last roster row leads straight into the collective image, with a short hold. */
.collective-scene{position:relative;height:164svh;--collective-pin:84px;background:var(--ink)}
.army.collective-frame{position:sticky;top:var(--collective-pin);height:calc(100svh - var(--collective-pin));width:100%;border:0;isolation:isolate;clip-path:inset(var(--collective-inset-y,0%) var(--collective-inset-x,0%));background:var(--ink)}
.army.collective-frame>img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center 42%;filter:brightness(.92);opacity:var(--collective-image-opacity,1);transform:scale(var(--collective-image-scale,1));transform-origin:50% 42%}
.army.collective-frame .veil{background:linear-gradient(180deg,#05050522 0%,#05050518 28%,#05050599 64%,#050505eb 100%);opacity:var(--collective-image-opacity,1)}
.army.collective-frame h3{left:var(--pad);right:var(--pad);bottom:clamp(116px,16vh,172px);padding:0;max-width:17ch;font-size:clamp(2.5rem,8vw,7.3rem);line-height:.9;letter-spacing:-.025em;text-wrap:balance;opacity:var(--collective-title-opacity,1);transform:translate3d(0,var(--collective-title-y,0px),0)}
.army.collective-frame .cap{opacity:var(--collective-caption-opacity,1);transform:translate3d(0,var(--collective-caption-y,0px),0)}
.army.collective-frame .cap.tl{top:32px;left:var(--pad);font-size:10px}
.army.collective-frame .cap.br{display:block;left:var(--pad);right:var(--pad);bottom:clamp(36px,6vh,64px);text-align:left;max-width:39ch;font:14px/1.6 var(--font-body);text-transform:none;letter-spacing:0;color:#d5d3cd}
.collective-scene+.team{border-top:0}
@media(max-width:760px){.collective-scene{height:148svh}.army.collective-frame h3{font-size:clamp(2rem,9.85vw,4.5rem);bottom:148px;max-width:15ch}.army.collective-frame .cap.tl{top:24px;font-size:8px}.army.collective-frame .cap.br{font-size:13px;max-width:32ch;bottom:44px}}
@media(max-height:500px){.collective-scene{height:148svh;--collective-pin:72px}.army.collective-frame h3{font-size:clamp(2rem,5vw,3rem);bottom:80px;max-width:24ch}.army.collective-frame .cap.tl{top:16px;font-size:8px}.army.collective-frame .cap.br{font-size:11px;bottom:18px;max-width:50ch}}
.reduced-chapters .chapter-surface{opacity:1;transform:none;clip-path:none}
.reduced-chapters .collective-scene{height:auto}
.reduced-chapters .army.collective-frame{position:relative;top:auto;clip-path:none}
@media(prefers-reduced-motion:reduce){.chapter-surface{opacity:1!important;transform:none!important;clip-path:none!important}.collective-scene{height:auto}.army.collective-frame{position:relative;top:auto;clip-path:none}.army.collective-frame>img,.army.collective-frame .veil,.army.collective-frame h3,.army.collective-frame .cap{opacity:1!important;transform:none!important}.roster-grid{opacity:1}}