@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--accent:#64dded;--bg:#080d14;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#edf1f6;font-family:'DM Sans',sans-serif}a{text-decoration:none;color:inherit}button{font:inherit;color:inherit;cursor:pointer}header{display:flex;justify-content:space-between;align-items:center;padding:28px 5vw;border-bottom:1px solid #ffffff12}.brand{font:800 23px 'Manrope',sans-serif;letter-spacing:2px}.brand span{display:block;font:400 10px 'DM Sans',sans-serif;color:#8e9ba9;letter-spacing:.5px;margin-top:6px}.contact{font-size:12px;padding:12px 22px;border:1px solid #ffffff28;border-radius:40px}main{max-width:1700px;margin:auto}.experience{height:min(660px,70vw);min-height:500px;position:relative;overflow:hidden}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 50%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 65%);transition:background 1s}.visual{position:absolute;right:5%;top:0;width:57%;height:100%;perspective:1000px}.visual:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg),transparent 27%),linear-gradient(0deg,var(--bg),transparent 18%)}iframe,canvas{position:absolute;border:0;inset:0;width:100%;height:100%;transition:opacity .65s,transform 1s}#portrait{mask-image:linear-gradient(90deg,transparent,#000 20%),linear-gradient(0deg,transparent,#000 16%);mask-composite:intersect;pointer-events:none}#brain{opacity:0;pointer-events:none;transform:scale(.92)}body[data-scene=research] #brain{opacity:1;transform:scale(1)}body[data-scene] #portrait{opacity:0;transform:scale(1.06)}.story{position:relative;z-index:3;width:48%;padding:72px 0 40px 5vw;pointer-events:none}.story a{pointer-events:auto}.eyebrow{color:var(--accent);font-size:10px;letter-spacing:2px;font-weight:600;transition:color .5s}h1{font:600 clamp(50px,5.6vw,86px)/1.06 'Manrope',sans-serif;letter-spacing:-4px;margin:28px 0}h1 em{color:var(--accent);font-style:normal}.description{font-size:15px;line-height:1.8;color:#a4b1bf;max-width:375px;min-height:80px}.enter{display:inline-flex;align-items:center;gap:28px;border-bottom:1px solid var(--accent);padding:15px 0;color:var(--accent);font-size:13px;margin-top:14px}.enter span{font-size:22px}.visual-caption{position:absolute;bottom:32px;right:25px;left:80px;z-index:2;display:flex;align-items:center;justify-content:space-between;font:9px monospace;letter-spacing:1.3px;color:#8fabb7}.visual-caption button{background:#0d1921;border:1px solid #ffffff25;border-radius:50%;width:34px;height:34px;font-size:20px}.vertical-note{position:absolute;right:18px;top:40%;writing-mode:vertical-rl;font:9px monospace;letter-spacing:3px;color:#657c8e}.universes{display:grid;grid-template-columns:repeat(6,1fr);margin:0 5vw;border-top:1px solid #ffffff22;border-bottom:1px solid #ffffff22}.universe{position:relative;text-align:left;min-height:108px;padding:20px 14px;background:transparent;border:0;border-right:1px solid #ffffff16;transition:background .4s,color .4s}.universe:last-child{border-right:0}.universe .index{display:block;font:10px monospace;color:#657582;margin-bottom:17px}.universe>span:nth-child(2){font-size:13px;white-space:nowrap}.hint{position:absolute;right:12px;top:18px;opacity:.35}.universe[aria-pressed=true],.universe:hover{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent)}.universe[aria-pressed=true]:after{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--accent);box-shadow:0 0 18px var(--accent)}.bottom{display:flex;justify-content:space-between;align-items:center;margin:22px 5vw 36px;color:#6f8494;font-size:11px}.bottom button{border:0;background:transparent;font-size:11px;color:#9cabb7}.bottom button span{margin-left:12px;color:var(--accent)}footer{border-top:1px solid #ffffff10;padding:22px 5vw;display:flex;justify-content:space-between;color:#657482;font-size:10px}.software{position:absolute;inset:17% 0 15% 12%;opacity:0;transform:rotateY(-20deg) rotateX(8deg) translateY(30px);transition:opacity .7s,transform 1s;display:flex;flex-direction:column;justify-content:center}.software img{width:100%;border:1px solid #87e8b844;border-radius:10px;box-shadow:0 30px 100px #0008}.software span{font:10px monospace;letter-spacing:3px;color:var(--accent);padding:20px}body[data-scene=soft] .software{opacity:1;transform:rotateY(-12deg) rotateX(5deg) translateY(0)}body[data-scene=soft] canvas,body[data-scene=research] canvas{opacity:.15}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.story.switching{animation:arrive .5s both}@keyframes arrive{from{opacity:.2;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.story{padding-left:80px}}@media(max-width:1000px){.universes{grid-template-columns:repeat(3,1fr)}.universe{min-height:88px}.experience{height:560px}.story{width:54%;padding-top:60px}h1{font-size:62px;letter-spacing:-3px}.visual{right:0;width:62%}.universe:nth-child(3){border-right:0}.universe:nth-child(-n+3){border-bottom:1px solid #ffffff16}}@media(max-width:600px){header{padding:22px 6vw}.brand{font-size:19px}.contact{font-size:11px;padding:10px 15px}.experience{height:740px;min-height:0}.story{width:100%;padding:32px 6vw 0}.eyebrow{font-size:9px}h1{font-size:52px;letter-spacing:-2.7px;margin:21px 0}.description{font-size:13px;line-height:1.65;min-height:60px;max-width:300px}.enter{margin-top:0;padding:9px 0}.visual{top:360px;right:0;width:100%;height:380px}.visual:after{background:linear-gradient(0deg,var(--bg),transparent 20%),linear-gradient(180deg,var(--bg),transparent 15%)}.visual-caption{bottom:15px;left:25px;font-size:8px}.vertical-note{display:none}.universes{margin:0 6vw;grid-template-columns:repeat(2,1fr)}.universe{padding:15px;min-height:90px}.universe:nth-child(3){border-right:1px solid #ffffff16}.universe:nth-child(even){border-right:0}.universe:nth-child(4){border-bottom:1px solid #ffffff16}.bottom{margin:20px 6vw;gap:20px}.bottom p{max-width:180px;line-height:1.5}footer{font-size:9px;gap:20px}.software{inset:15% 5% 15% 5%}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.brain-credit{display:none;position:absolute;bottom:76px;right:20px;z-index:4;font-size:8px;color:#a6b6c5}body[data-scene=research] .brain-credit{display:block}#brain,.software{visibility:hidden;transition:opacity .65s,transform 1s,visibility .65s}body[data-scene=research] #brain,body[data-scene=soft] .software{visibility:visible}body[data-scene] #portrait{visibility:hidden;transition:opacity .65s,transform 1s,visibility .65s}

.universe>span:nth-child(2){white-space:normal;display:block;max-width:160px;line-height:1.4}.universe{min-height:116px}
.universes{padding:20px;gap:12px;background:linear-gradient(160deg,#222a32,#10161d);border:1px solid #39444f;border-radius:18px;box-shadow:inset 0 1px #ffffff15,0 18px 45px #0005;position:relative}.universe{display:flex;flex-direction:column;min-height:205px;padding:13px 12px;border:1px solid #36424e!important;border-radius:10px;background:linear-gradient(150deg,#1b242d,#0b1118);box-shadow:0 5px 0 #070b10,0 8px 12px #0008,inset 0 1px #ffffff12;transition:box-shadow .25s,border-color .25s,transform .25s;color:#a8b5c2;--accent:var(--pad)}.pad-top{display:flex;align-items:center;justify-content:space-between}.universe .index{margin:0;font-size:9px}.led{width:7px;height:7px;border-radius:50%;background:color-mix(in srgb,var(--pad) 25%,#141c23);box-shadow:inset 0 1px 2px #000}.universe .mini{display:block;max-width:none;height:78px;margin:10px 0;color:var(--pad)}.mini svg{height:100%;width:100%;fill:none;stroke:currentColor;stroke-width:1.7}.mini .edges{opacity:.35}.mini .network circle{animation:mini-pulse 3s infinite}.mini .orbit{transform-origin:200px 140px;animation:mini-turn 20s linear infinite}.mini .balance{transform-origin:200px 90px;animation:mini-balance 5s infinite ease-in-out}.mini .bars rect{fill:currentColor;animation:mini-bars 4s infinite ease-in-out}.mini .stage>path{stroke-dasharray:400;animation:mini-trace 6s infinite}.mini .camera>path:first-of-type{transform-origin:200px 140px;animation:mini-turn 30s infinite linear}.pad-name{font-size:12px;font-weight:500;line-height:1.4;min-height:50px}.pad-bottom{display:flex;justify-content:space-between;gap:5px;margin-top:auto;padding-top:12px;border-top:1px solid #ffffff0d;font:7px monospace;letter-spacing:.4px;color:#697d8e}.universe.active,.universe:hover,.universe:focus-visible{border-color:var(--pad)!important;background:linear-gradient(150deg,color-mix(in srgb,var(--pad) 18%,#14202c),#0b1118);box-shadow:0 5px 0 #070b10,0 0 24px color-mix(in srgb,var(--pad) 20%,transparent),inset 0 0 25px color-mix(in srgb,var(--pad) 8%,transparent);transform:translateY(-2px);color:#fff}.universe.active .led,.universe:hover .led{background:var(--pad);box-shadow:0 0 12px var(--pad)}.universe.active:after{display:none}.universe.active .mini{filter:drop-shadow(0 0 5px var(--pad))}.experience{height:560px;min-height:500px}.story{padding-top:48px}.bottom>span{font-size:10px;text-align:right}@keyframes mini-pulse{50%{fill:currentColor;filter:drop-shadow(0 0 4px currentColor)}}@keyframes mini-turn{to{transform:rotate(360deg)}}@keyframes mini-balance{50%{transform:rotate(8deg)}}@keyframes mini-bars{50%{transform:translateX(20px)}}@keyframes mini-trace{50%{stroke-dashoffset:120}}@media(max-width:1000px){.universes{grid-template-columns:repeat(3,1fr)}.universe{min-height:188px}.pad-name{min-height:34px}}@media(max-width:600px){.universes{grid-template-columns:repeat(2,1fr);padding:12px;gap:12px}.experience{height:720px;min-height:0}.story{padding-top:32px}.universe{min-height:188px}.pad-name{font-size:12px}.pad-bottom{font-size:7px}.bottom{align-items:start}}

/* Interactive Y replaces the former portrait. */
#portrait{pointer-events:auto;mask-image:none;mask-composite:add;border-radius:18px}body[data-scene] #portrait{pointer-events:none}.y-open{font:12px sans-serif;color:#64dded;pointer-events:auto;padding:10px}.visual-caption{gap:12px}.visual-caption>span{flex:1}

/* Keep the site caption outside Y's interactive viewport. */
#portrait{height:calc(100% - 72px)}
.visual-caption{bottom:12px;height:48px;pointer-events:none}
.visual-caption a,.visual-caption button{pointer-events:auto}
.vertical-note{pointer-events:none}
@media(max-width:600px){.experience{height:812px}.visual{height:452px}.visual-caption{left:25px;bottom:12px}}

#portrait{background:transparent}

/* Match Y’s opaque black canvas. */
:root{--bg:#000}html,body,.experience,.visual,#portrait{background:#000}.ambient{background:#000!important}.visual:after{background:none}