/* Shared Perilous passage. Photographs stay still; only the material surround moves. */
html[data-collective-arrival="perilous"]::after{content:"";position:fixed;inset:0;z-index:2147482998;background:#171a1b var(--cp-stone-image,url('/collective-portal/graphite.webp')) 0 0/760px 760px;pointer-events:none}
.collective-passage{position:fixed;inset:0;z-index:2147483000;isolation:isolate;pointer-events:none;overflow:hidden;background:#171a1b;--cp-copper:#b77b52;opacity:1}
.collective-passage *{box-sizing:border-box}
.cp-material-world{position:absolute;left:50%;top:50%;width:max(100vw,250.063vh);height:max(100vh,39.99vw);transform:translate(-50%,-50%)}
.cp-material{position:absolute;inset:-1px;background:#171a1b var(--cp-stone-image,url('/collective-portal/graphite.webp')) 0 0/760px 760px;will-change:transform;filter:drop-shadow(0 9px 12px #0009)}
.cp-material::before{content:"";position:absolute;inset:0;background:url('/collective-portal/surround.webp') center/100% 100% no-repeat}
.cp-fractures{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.cp-fractures path{fill:none;stroke:url(#cp-copper);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:bevel;stroke-linecap:round}
.cp-signature{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:min(420px,64vw);display:flex;flex-direction:column;align-items:center;gap:22px;color:#e8dfd0;text-align:center}
.cp-signature-logo{display:flex;align-items:center;justify-content:center;gap:20px;width:100%}
.cp-signature-logo>svg:first-child{width:76px;height:80px;flex-shrink:0}
.cp-signature-logo>svg:last-child{width:240px;height:61px}
.cp-signature small{font:10px/1.5 ui-monospace,monospace;letter-spacing:.18em;text-transform:uppercase;color:#ded2c3;text-shadow:0 1px 4px #000,0 0 12px #171a1b}
.cp-skip{position:absolute;right:24px;bottom:max(24px,env(safe-area-inset-bottom));pointer-events:auto;min-height:44px;border:1px solid #ffffff35;border-radius:30px;padding:10px 18px;background:#171a1bcc;color:#e8dfd0;font:12px/1.4 ui-monospace,monospace;cursor:pointer}
.cp-skip:focus-visible,.collective-return:focus-visible{outline:2px solid #f0d2b5;outline-offset:4px}
.collective-return{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:24px;z-index:900;display:flex;align-items:center;gap:12px;padding:13px 18px;min-height:48px;border:1px solid #b77b5266;border-radius:40px;color:#ece4d7;background:#171a1bf2;box-shadow:0 6px 30px #0005;text-decoration:none;font:12px/1.3 ui-monospace,monospace;letter-spacing:0;transition:background .18s,border-color .18s}
.collective-return:hover{border-color:#ce9970;background:#252626}
.collective-return svg{width:17px;height:17px;flex-shrink:0}
.collective-return>span{display:flex;flex-direction:column;gap:3px}
.collective-return small{font-size:8px;letter-spacing:.12em;color:#ba9d85;text-transform:uppercase}
.collective-enter-link{position:relative}
@media(max-width:760px){.cp-material-world{width:max(100vw,66.667vh);height:max(100vh,150vw)}.cp-material::before{background-image:url('/collective-portal/surround-phone.webp')}.cp-signature{width:74vw;gap:18px}.cp-signature-logo{gap:13px}.cp-signature-logo>svg:first-child{width:54px;height:57px}.cp-signature-logo>svg:last-child{width:190px;height:48px}.cp-signature small{font-size:8px;letter-spacing:.12em}.cp-skip{right:16px;bottom:max(16px,env(safe-area-inset-bottom));font-size:10px}.collective-return{left:16px;bottom:max(16px,env(safe-area-inset-bottom));padding:12px 16px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.collective-return{transition:none}.cp-material{will-change:auto}}

/* Shared mechanics; each passage below owns its own surface and typography. */
@font-face{font-family:CPCode;src:url('/collective-portal/codejack-type.woff2') format('woff2');font-display:swap;font-weight:300 700}
@font-face{font-family:CPMog;src:url('/collective-portal/mog-type.ttf') format('truetype');font-display:swap;font-weight:600}
html[data-collective-arrival="codejack"]::after,html[data-collective-arrival="moglocker"]::after{content:"";position:fixed;inset:0;z-index:2147482998;pointer-events:none}
html[data-collective-arrival="codejack"]::after{background:var(--cp-code-surface,#264ce1)}
html[data-collective-arrival="moglocker"]::after{background:var(--cp-mog-closed,#0c1512)}
.collective-passage{pointer-events:auto}
.cp-theme-codejack{background:#264ce1}
.cp-theme-codejack .cp-skip{color:#f1f4ee;background:#142568d9;border-color:#b1d6ff66}
.cp-code-label{position:absolute;inset:0;overflow:hidden;background:var(--cp-code-surface,#264ce1);will-change:clip-path}
.cp-code-cut{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
.cp-code-cut path{fill:none;stroke:#a8edf4;stroke-width:1.25}
.cp-code-registration{position:absolute;top:7%;left:7vw;right:7vw;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e1edff66;padding-top:18px;color:#d8e8ff;font:11px/1.5 ui-monospace,monospace;letter-spacing:.06em}
.cp-code-identity{position:absolute;left:5vw;right:5vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:32px;opacity:0;filter:drop-shadow(0 2px 3px #090e19) drop-shadow(0 0 18px #090e19aa)}
.cp-code-wordmark{color:#f1f4ee;display:flex;align-items:baseline;white-space:nowrap;font:700 clamp(64px,11vw,140px)/.9 CPCode,Arial,sans-serif;letter-spacing:-.075em}
.cp-code-wordmark>span{color:#7de8f2}.cp-code-wordmark>i{font-style:normal;font-size:.65em;letter-spacing:-.11em;margin-left:.22em;color:#dae7f9}
.cp-code-caption{color:#dae7f9;font:11px/1.6 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}
.cp-code-modes{position:absolute;left:7vw;right:7vw;bottom:10%;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e1edff66;padding-top:22px;color:#eff3ff;font:500 clamp(14px,1.6vw,24px)/1 CPCode,Arial,sans-serif;letter-spacing:.025em}
.cp-code-modes>span:nth-child(2){color:#ffd5b0}.cp-code-modes>span:nth-child(3){color:#c5eacb}.cp-code-modes>span:nth-child(4){color:#e1c9fa}.cp-code-modes>span:nth-child(5){color:#e2e7ec}
.cp-code-rule{position:absolute;left:7vw;right:7vw;bottom:9%;height:1px;background:#7de8f2;transform-origin:left}
.cp-code-registration,.cp-code-modes,.cp-code-rule{opacity:0}
.cp-return-codejack{border-color:#7de8f266;background:#090e19f5;color:#f1f4ee}.cp-return-codejack small{color:#7de8f2}.cp-return-codejack:hover{background:#142568;border-color:#7de8f2}
.cp-theme-moglocker{background:#0c1512}
.cp-shutter{position:absolute;top:-2px;bottom:-2px;width:calc(50% + 3px);background:var(--cp-mog-left,linear-gradient(110deg,#192921,#101b16 28%,#0b100e 90%));will-change:transform;box-shadow:inset 0 0 0 1px #49655755,0 0 28px #0005}
.cp-shutter::before{content:"";position:absolute;inset:0;background:var(--cp-mog-grain,url('/collective-portal/mog-surface.svg')) repeat}
.cp-shutter::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:#00ff8799;box-shadow:0 0 20px #00ff8777,0 0 90px #00ff8744}
.cp-shutter-left{left:-2px;border-right:1px solid #49655755}.cp-shutter-left::after{right:0}
.cp-shutter-right{right:-2px;background:var(--cp-mog-right,linear-gradient(250deg,#192921,#101b16 28%,#0b100e 90%));border-left:1px solid #49655755}.cp-shutter-right::after{left:0}
.cp-mog-identity{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:18px;color:#f4faf6;white-space:nowrap;padding:30px 28px;background:radial-gradient(ellipse,#0c1512b3 25%,#0c151200 74%);width:min(700px,90vw);opacity:0;filter:drop-shadow(0 1px 4px #060c09)}
.cp-mog-identity img{display:block;width:48px;height:48px;max-width:none;object-fit:contain;margin:0}
.cp-mog-identity strong{font:600 clamp(48px,7.7vw,104px)/.95 CPMog,Arial,sans-serif;letter-spacing:-.02em;color:#f4faf6}
.cp-mog-identity strong span{color:#00ff87}
.cp-mog-identity small{font:10px/1.6 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#a5b7ac}
.cp-mog-routes{position:absolute;left:0;right:0;top:69%;height:24px;opacity:0;--cp-signal:5%}
.cp-mog-routes>i{display:block;position:absolute;height:1px;left:0;right:0;background:linear-gradient(90deg,transparent,#00ff8777 20%,#00ff87 50%,#00ff8777 80%,transparent)}
.cp-mog-routes>i>b{position:absolute;left:0;width:5px;height:5px;background:#b8ffdb;border-radius:50%;top:-2px;box-shadow:0 0 20px #00ff87;will-change:transform}
.cp-mog-routes>i+ i{top:20px;background:linear-gradient(90deg,transparent,#00d4ff55 20%,#00d4ff99 50%,#00d4ff55 80%,transparent)}
.cp-mog-routes>i+ i>b{background:#a0eaff;box-shadow:0 0 15px #00d4ff}
.cp-theme-moglocker .cp-skip{color:#dff8eb;background:#0b1611e6;border-color:#00ff8755}
.cp-return-moglocker{background:#0b1611f5;border-color:#00ff8755;color:#e8f5ef}.cp-return-moglocker small{color:#00ff87}.cp-return-moglocker:hover{background:#172b21;border-color:#00ff87}
@media(max-width:760px){.cp-code-registration{left:7vw;right:7vw;top:7%;font-size:9px;display:block}.cp-code-registration>span{display:block;margin-bottom:8px}.cp-code-identity{gap:25px}.cp-code-wordmark{font-size:14vw}.cp-code-wordmark>i{display:none}.cp-code-caption{font-size:9px;letter-spacing:.04em}.cp-code-modes{font-size:13px;gap:10px;bottom:16%;padding-top:16px}.cp-code-rule{bottom:15%}.cp-mog-identity{top:44%;gap:18px;padding-inline:0}.cp-mog-identity strong{font-size:13vw}.cp-mog-identity small{font-size:9px;letter-spacing:.04em}.cp-mog-routes{top:63%}}
@media(prefers-reduced-motion:reduce){html[data-collective-arrival]::after{display:none}.cp-code-label,.cp-shutter{will-change:auto}.collective-return{transition:none}}

/* Refined Perilous passage: stationary stone, one growing fractured aperture. */
.cp-stone-field{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.cp-theme-perilous .cp-signature{top:50%}
.cp-theme-perilous .cp-signature-logo{filter:drop-shadow(0 1px 2px #080a0b) drop-shadow(0 0 16px #080a0b)}

/* Arrival assets warm behind this cover; the mark is never visible before its beat. */
.cp-signature{opacity:0}
/* Arrival focus announces the heading; only interactive controls need a ring. */
h1[data-collective-focus]:focus{outline:none}

/* The producer studio: one continuous spectrum between two quiet surfaces. */
@font-face{font-family:CPVeed;src:url('/collective-portal/veedeeoh-type.woff2') format('woff2');font-weight:700 800;font-display:swap}
html[data-collective-arrival="liminal"]::after,html[data-collective-arrival="veedeeoh"]::after,html[data-collective-arrival="tap"]::after{content:"";position:fixed;inset:0;z-index:2147482998;pointer-events:none}
html[data-collective-arrival="liminal"]::after{background:#0a0b0d}html[data-collective-arrival="veedeeoh"]::after{background:#06070a}html[data-collective-arrival="tap"]::after{background:#0a0b0f}
.cp-theme-liminal{background:#0a0b0d}.cp-theme-veedeeoh{background:#06070a}.cp-theme-tap{background:#0a0b0f}
.cp-new-identity{position:absolute;left:6vw;right:6vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:25px;opacity:0;color:#eceef1;text-align:center;filter:drop-shadow(0 2px 4px #050608) drop-shadow(0 0 22px #050608)}
.cp-new-identity small{font:10px/1.5 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#d2d5dc}
.cp-liminal-identity{top:42%}.cp-liminal-identity img{width:min(500px,76vw);height:auto;max-height:150px;object-fit:contain;display:block;margin:0}
.cp-audio-surface{position:absolute;left:-1px;right:-1px;height:calc(50% + 2px);background:#0a0b0d;will-change:transform}
.cp-audio-top{top:-1px;border-bottom:1px solid #eceef11a}.cp-audio-bottom{bottom:-1px;border-top:1px solid #eceef11a}
.cp-audio-wave{position:absolute;left:0;top:59%;width:100%;height:72px;overflow:visible;opacity:0;transform-origin:center}
.cp-audio-wave path{fill:none;stroke:url(#cp-spectrum);stroke-width:1.2;vector-effect:non-scaling-stroke}
.cp-return-liminal{background:#0a0b0df5;border-color:#fb718566;color:#eceef1}.cp-return-liminal small{color:#fb7185}.cp-return-liminal:hover{background:#141821;border-color:#34d9e0}
/* One expanding screen. The two playheads join while the aperture opens. */
.cp-screen-field{position:absolute;inset:0;width:100%;height:100%}
.cp-veed-identity strong{font:800 clamp(52px,9vw,120px)/1 CPVeed,Arial,sans-serif;letter-spacing:-.065em;color:#fff;white-space:nowrap}.cp-veed-identity strong span{color:#c5f04e}
.cp-watch-sync{position:relative;width:150px;height:1px;background:#c5f04e44;margin:4px 0 6px}.cp-watch-sync i{position:absolute;left:calc(50% - 2px);top:-7px;width:3px;height:15px;border-radius:3px;background:#c5f04e}.cp-watch-sync i+i{background:#f6f8ef;height:9px;top:-4px}
.cp-return-veedeeoh{background:#06070af5;border-color:#c5f04e66;color:#f6f8ef}.cp-return-veedeeoh small{color:#c5f04e}.cp-return-veedeeoh:hover{background:#161d0d;border-color:#c5f04e}
/* Memory formation: warm scattered activity settles into a cool topology. */
.cp-temperature-field{position:absolute;inset:0;background:#0a0b0f;overflow:hidden}
.cp-temperature-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#f0682e1a,transparent 60%)}
.cp-temperature-field i{position:absolute;left:var(--nx);top:var(--ny);width:4px;height:4px;margin:-2px;border-radius:50%;background:#f0682e;box-shadow:0 0 12px currentColor;color:#76b8c033}
.cp-temperature-field svg{position:absolute;inset:0;width:100%;height:100%}.cp-temperature-field path{stroke:#76b8c01a;stroke-width:.5;vector-effect:non-scaling-stroke;fill:none}
.cp-tepid-identity strong{font:400 clamp(68px,10vw,138px)/1.1 Georgia,'Times New Roman',serif;letter-spacing:-.045em;color:#ece7dd}.cp-tepid-identity strong span{font-style:italic;color:#b7c9d4}
.cp-return-tap{background:#0a0b0ff5;border-color:#6f8bb066;color:#ece7dd}.cp-return-tap small{color:#76b8c0}.cp-return-tap:hover{background:#151b23;border-color:#76b8c0}
@media(max-width:760px){.cp-new-identity{gap:22px}.cp-new-identity small{font-size:9px;letter-spacing:.03em}.cp-audio-wave{height:50px}.cp-veed-identity strong{font-size:14vw}}
@media(prefers-reduced-motion:reduce){html[data-collective-arrival]::after{display:none}.cp-audio-surface{will-change:auto}}
