/* KANATRA: the space between frames. All scene art and marks are supplied assets. */
:root{--violet:#ba8aff;--gold:#c8b4ff;--deep:#10071c;--gutter:5.5vw;--scene-scroll:0;--pointer-x:0;--pointer-y:0}
body{background:#10071c}button,a,input{touch-action:manipulation}::selection{background:#c4a0ff;color:#160727}
.site-header{position:absolute;z-index:60;border-bottom:1px solid #dfc6ff24;background:transparent;height:100px}
.brand>svg{width:50px;height:42px}.site-header nav{font-size:.82rem}.header-tools{gap:20px}
.header-motion{min-height:44px;min-width:44px}.header-motion .motion-label{font-size:0}.header-motion .motion-bars{gap:4px}.header-motion .motion-bars i{width:3px;height:16px}
.languages{font-size:.85rem}.languages a{min-height:44px;display:inline-flex;align-items:center}.menu-toggle{min-width:44px;min-height:44px}
.hero{height:max(900px,108svh);min-height:900px;max-height:1400px;padding-top:155px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 73% 50%,#482778 0,#211137 40%,#10071c 70%)}
.hero-image{inset:12% -8% -5% 33%;z-index:-2;clip-path:ellipse(43% 45% at 56% 50%);transform:translate3d(calc(var(--pointer-x)*-12px),calc(var(--pointer-y)*-8px + var(--scene-scroll)*75px),0) scale(calc(1 + var(--scene-scroll)*.12));will-change:transform}
.hero-image img{object-position:63% center;opacity:.8;animation:scene-drift 24s ease-in-out infinite alternate}
.hero-overlay{z-index:-1;background:linear-gradient(90deg,#10071c 6%,#10071c88 43%,transparent 68%),linear-gradient(0deg,#10071c 0%,transparent 18%)}
.hero-top{position:relative;z-index:3}.hero-top .eyebrow{font-size:.8rem;letter-spacing:.13em}
.hero-main{padding:80px 0 70px;display:block;position:relative;z-index:3;pointer-events:none}
.hero h1{font-size:clamp(84px,10.6vw,174px);line-height:.93;letter-spacing:-.075em;font-weight:500;max-width:1100px}
.hero-line{overflow:hidden;padding-bottom:.08em}.hero h1 .line-1{padding-left:7vw}.hero h1 .line-2{color:var(--gold);padding-left:1vw;font-weight:400}
.hero-aside{margin:30px 0 0 8vw;max-width:290px;pointer-events:auto}.hero-aside-line{display:none}.hero-aside p{font-size:1rem;max-width:270px;line-height:1.7;color:#e0d2ed}.play-link{min-height:48px;margin-top:20px;font-size:.875rem}.play-circle{background:#d4b0ff14;border-color:#d8bbff99}
.hero-bottom{position:absolute;bottom:38px;left:var(--gutter);right:var(--gutter);width:auto;z-index:3}.hero-art-label,.hero-chapter,.hero-discover{font-size:.75rem}.hero-chapter{max-width:180px;text-align:right;color:#d8c6eb}.hero-side{display:none}
.hero-aperture{position:absolute;inset:0;z-index:1;pointer-events:none}.aperture-outline{position:absolute;width:52vw;height:52vw;max-width:850px;max-height:850px;left:46%;top:12%;border:1px solid #ddbdff4a;border-radius:50%;transform:rotate(-25deg) scaleX(.82);animation:orbit-slow 28s linear infinite}.outline-two{transform:rotate(28deg) scaleX(.82);animation-direction:reverse;border-color:#e5c68b3d;animation-duration:36s}.outline-three{transform:scale(.89);border-style:dashed;border-color:#d9b9ff2e;animation:orbit-slow 52s linear infinite}.portal-mark{position:absolute;right:12%;top:40%;width:13%;color:#f8ecff;filter:drop-shadow(0 0 30px #c092ff77);transform:translate(calc(var(--pointer-x)*18px),calc(var(--pointer-y)*12px));opacity:.75}.portal-mark svg{width:100%;height:auto}.portal-frame{position:absolute;right:9%;top:72%;font-size:12px;letter-spacing:.2em;color:#ebdaf7}
.medium-strip{background:var(--gold);color:#27143a;border:0;padding:24px var(--gutter);transform:rotate(-1.5deg) scale(1.025);position:relative;z-index:4;gap:30px;box-shadow:0 12px 30px #0002;font-size:.8rem}.medium-strip i{color:#563173}
.story{padding-top:140px;padding-bottom:100px;background:radial-gradient(ellipse at 0 60%,#241334,transparent 65%)}.section-index{font-size:.78rem;letter-spacing:.07em}.story h2{font-size:clamp(44px,6vw,88px);line-height:1.07}.story-grid{grid-template-columns:1.15fr 1fr;gap:8%}.story-copy>p+p,.story-copy .lead{font-size:1.05rem;line-height:1.8}.story-meta{margin-top:65px}.story-meta .meta-value{color:var(--gold)}.story-meta span:last-child{font-size:.8rem}
.frame-study{display:grid;grid-template-columns:.8fr 1.2fr;gap:7%;align-items:center;position:relative;overflow:hidden;background:#1a0d2a;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:100px}
.study-copy .eyebrow{color:var(--gold);font-size:.75rem;margin-bottom:28px}.study-copy h2{font-size:clamp(34px,4vw,61px);line-height:1.12}.study-copy>p:last-of-type{font-size:1rem;line-height:1.8;color:var(--muted);margin-top:26px;max-width:340px}.study-phases{display:flex;flex-wrap:wrap;gap:20px;margin-top:42px}.study-phases span{display:flex;flex-direction:column;gap:10px;font-size:.82rem;color:#b4a2c6;transition:color .3s}.study-phases small{font-size:12px}.study-phases .active{color:var(--gold)}
.study-workbench{min-width:0;perspective:1100px}.cel-stage{height:440px;position:relative;isolation:isolate;border:1px solid #c8a1ff26;background:radial-gradient(ellipse,#59317488,transparent 67%),repeating-linear-gradient(0deg,transparent 0 39px,#e8d2ff05 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,#e8d2ff05 39px 40px);overflow:hidden;--frame:.5}.cel{position:absolute;inset:14% 19%;display:grid;place-items:center;border:1px solid #cfb1ec3b;transform-style:preserve-3d;background:#bf99ff05}.cel svg{width:55%;height:auto;overflow:visible}.cel-back{color:#8b49c2;transform:translate(calc((1 - var(--frame))*-70px),calc((1 - var(--frame))*-25px)) rotate(calc((1 - var(--frame))*-14deg));opacity:calc(.25 + var(--frame)*.35)}.cel-mid{color:#d1a1ed;transform:translate(calc((1 - var(--frame))*62px),calc((1 - var(--frame))*22px)) rotate(calc((1 - var(--frame))*14deg));opacity:calc(.3 + var(--frame)*.35)}.cel-front{color:#f7edff;transform:translateY(calc((1 - var(--frame))*18px)) scale(calc(.7 + var(--frame)*.3));border-color:#f5db9a77;background:#d3b2ff08;box-shadow:0 0 calc(var(--frame)*60px) #bf84ff19}.cel-caption{position:absolute;left:0;right:0;text-align:center;bottom:45px;letter-spacing:.38em;font-size:14px;opacity:var(--frame);transform:translateY(calc((1 - var(--frame))*8px))}.reg{position:absolute;color:#d6bdd466;font:18px monospace}.reg-a{top:14px;left:16px}.reg-b{top:14px;right:16px}.reg-c{bottom:14px;left:16px}.reg-d{bottom:14px;right:16px}.frame-counter{position:absolute;top:23px;left:38px;font:12px monospace;color:#dab9ee}
.study-controls{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;margin-top:25px}.study-play{min-height:46px;border:1px solid #dcc5ff55;border-radius:40px;padding:10px 20px;font-size:.85rem;color:var(--gold)}.study-play:hover{background:#cda3ff1c}.frame-range-label{font-size:.75rem;color:#d4c4e4;display:flex;flex-direction:column;gap:10px}.frame-range-label input{width:100%;accent-color:var(--gold);cursor:ew-resize;min-height:24px}.frame-output{grid-column:2;font:12px monospace;color:#cdb9dd;margin-top:-12px}.study-play:disabled{opacity:.6}
.worlds{padding-top:130px}.section-heading h2{font-size:clamp(44px,6vw,85px)}.section-heading>p{font-size:1rem}.world-toolbar-note,.art-disclosure{font-size:.8rem}.world-tabs button{min-height:56px}.world-image{aspect-ratio:1.9;overflow:hidden;clip-path:inset(0 round 2px);background:#281440;position:relative}.world-image img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.08 + var(--world-progress,0)*.08)) translateY(calc(var(--world-progress,0)*-3%));transition:transform .25s linear}.world-image:before{content:'';position:absolute;inset:14px;border:1px solid #fff4;z-index:2;pointer-events:none}.world-image:after{background:linear-gradient(0deg,#100719a8,transparent 65%)}.world-image figcaption{z-index:3}.world-panel.is-entering{animation:scene-unfold .9s var(--ease) both}.world-caption p{font-size:1rem}.world-caption h3{font-size:clamp(28px,3vw,44px)}
.direction{padding-top:90px;padding-bottom:130px}.direction-title{position:sticky;top:90px;align-self:start}.direction-title h2{font-size:clamp(62px,7.8vw,120px)}.direction-list details{transition:background .4s,padding .4s}.direction-list details[open]{padding-inline:20px;background:#cba4f40a}.direction-list details>p{font-size:1rem}.direction-list summary{min-height:94px}.direction-list h3{transition:color .3s,transform .4s}.direction-list summary:hover h3{color:var(--gold);transform:translateX(6px)}.release-note{border-left:2px solid var(--gold)}.release-note p{font-size:.9rem}
.founder{background:radial-gradient(ellipse at 24% 40%,#61388d55,transparent 60%),#190e29;position:relative}.identity-study{min-height:510px}.identity-ring{border-color:#dfb5f333}.ring-a{animation:orbit-slow 26s linear infinite}.ring-b{animation:orbit-slow 32s linear infinite reverse}.founder-copy>p{font-size:1rem}.identity-mark{width:45%;filter:drop-shadow(0 0 40px #be8af72c)}
.contact{background:#e7cfa5;color:#281434;position:relative;overflow:hidden;padding-top:110px;padding-bottom:110px}.contact:before{content:'';position:absolute;width:52vw;height:52vw;border:1px solid #45235722;border-radius:50%;right:-16%;top:-70%;pointer-events:none;box-shadow:0 0 0 70px #45235706,0 0 0 140px #45235704}.contact h2{font-size:clamp(52px,7.3vw,110px);letter-spacing:-.06em}.contact-top .eyebrow{font-size:.76rem}.contact-details>p{font-size:1rem;color:#57405c}.contact-symbol{width:76px;transform:rotate(-12deg);transition:transform .7s var(--ease)}.contact:hover .contact-symbol{transform:rotate(0deg)}.contact-email{font-size:clamp(18px,1.9vw,28px);padding-block:20px}.copy-email{min-height:44px;font-size:.85rem}.contact-location{font-size:.8rem}.site-footer{background:#0c0614}.footer-wordmark{display:flex;align-items:baseline;line-height:.95;margin-top:65px;padding-bottom:10px}.footer-wordmark>.footer-letter{font-size:inherit;color:#dcc8ed;margin:0;display:block;transition:transform .65s var(--ease),color .4s}.footer-letter:hover{transform:translateY(-12%) rotate(-4deg);color:var(--gold)}.footer-bottom{font-size:.75rem}.motion-toggle{min-height:44px;font-size:.8rem}
.intro[open]{background:radial-gradient(ellipse,#47215c,#170b28 70%)}.intro-frame{inset:10%;border:1px solid #dfc4f755;animation:iris-frame 3.8s var(--ease) both}.intro-symbol path{animation:cel-arrival 2s var(--ease) both}.intro-symbol path:nth-child(2){animation-delay:.2s}.intro-pause{position:absolute;bottom:38px;left:var(--gutter);z-index:4;min-height:44px;padding:12px;font-size:.85rem;color:var(--gold)}.intro-skip{min-height:44px;font-size:.85rem}.intro.is-paused *{animation-play-state:paused!important}.intro-identity>p{font-size:.85rem}
@keyframes orbit-slow{from{rotate:0deg}to{rotate:360deg}}@keyframes scene-unfold{from{clip-path:inset(0 18%);opacity:.5}to{clip-path:inset(0);opacity:1}}@keyframes cel-arrival{0%{opacity:0;transform:translate(-90px,30px) rotate(-12deg);filter:blur(8px)}65%{opacity:1;filter:blur(0)}100%{transform:none;opacity:1}}@keyframes iris-frame{0%{clip-path:inset(49% 0);transform:scale(.7)}40%{clip-path:inset(0);transform:scale(.85)}100%{clip-path:inset(0);transform:scale(1)}}
html[lang=ta] .hero h1{font-size:clamp(40px,5.8vw,92px);line-height:1.55;max-width:1100px}html[lang=ta] .hero h1 .line-1{padding-left:3vw}html[lang=ta] .study-copy h2{font-size:clamp(28px,2.8vw,44px);line-height:1.65}html[lang=ta] .study-phases{gap:18px}html[lang=ta] .study-controls{grid-template-columns:1fr}html[lang=ta] .frame-output{grid-column:1}html[lang=ta] .study-play{justify-self:start}html[lang=ta] .contact h2{font-size:clamp(34px,4.5vw,68px)}
@media(max-width:1050px){.site-header nav{gap:18px}.header-tools{gap:10px}.hero{min-height:930px}.hero h1{font-size:12vw}.hero-main{padding-top:100px}.hero-image{inset:18% -10% 4% 20%}.portal-mark{right:13%;top:42%;width:16%}.aperture-outline{top:25%;left:40%;width:65vw;height:65vw}.frame-study{gap:4%;grid-template-columns:1fr 1fr}.cel-stage{height:380px}.study-controls{grid-template-columns:1fr}.study-play{justify-self:start}.frame-output{grid-column:1}.site-header .brand small{font-size:7px}}
@media(max-width:800px){.site-header{height:88px}.site-header nav{top:87px;background:#1a0d2afb}.hero{min-height:930px;max-height:none}.hero-coordinate{display:none}.hero-main{padding-top:110px}.hero h1{font-size:14vw}.hero-image{inset:17% -20% 7% 5%;opacity:.7}.hero-overlay{background:linear-gradient(90deg,#10071cc9,transparent),linear-gradient(0deg,#10071c 0%,transparent 40%)}.hero-aside{max-width:290px;margin-left:4vw}.hero-chapter{display:none}.story-grid{grid-template-columns:1fr}.story-copy{margin-left:20%;margin-top:25px}.frame-study{grid-template-columns:1fr;gap:40px}.study-copy>p:last-of-type{max-width:500px}.study-phases{margin-top:25px}.cel-stage{height:450px}.study-controls,html[lang=ta] .study-controls{grid-template-columns:auto 1fr}.frame-output,html[lang=ta] .frame-output{grid-column:2}.direction-title{position:static}.identity-study{min-height:380px}.contact-grid{grid-template-columns:1fr}.contact-details{margin-left:25%}}
@media(max-width:560px){:root{--gutter:24px}.hero{height:auto;min-height:860px;padding-top:125px;max-height:none;padding-bottom:100px}.hero-main{padding:110px 0 40px}.hero h1{font-size:20vw;line-height:.96;letter-spacing:-.07em}.hero h1 .line-1{padding-left:5vw}.hero h1 .line-2{padding-left:0}.hero-aside{margin:28px 0 0}.hero-image{inset:15% -30% 0 -20%;clip-path:ellipse(50% 39% at 65% 41%);opacity:.65}.hero-image img{object-position:65% center}.aperture-outline{width:105vw;height:105vw;left:14%;top:21%}.portal-mark{right:8%;top:22%;width:20%;opacity:.7}.portal-frame{right:9%;top:65%;font-size:10px}.hero-top .eyebrow{font-size:12px}.hero-bottom{bottom:24px;padding:0;align-items:center}.hero-art-label{font-size:12px;max-width:150px}.hero-discover{font-size:12px}.hero-aside p{font-size:1rem}.hero .play-link{font-size:.85rem}.medium-strip{grid-template-columns:1fr 1fr;gap:16px;font-size:12px;padding-block:23px;transform:rotate(-1.5deg) scale(1.02)}.section-pad{padding-block:72px}.story{padding-top:90px}.story-copy{margin:0}.story h2{font-size:44px}.story-meta{gap:15px;margin-top:36px}.story-meta .meta-value{font-size:24px}.story-meta span:last-child{font-size:12px}.section-index{font-size:12px}.study-copy h2{font-size:42px}.study-copy .eyebrow{font-size:12px}.study-phases{gap:24px}.cel-stage{height:330px}.cel{inset:18% 18%}.cel-caption{bottom:35px;font-size:12px}.study-controls,html[lang=ta] .study-controls{grid-template-columns:1fr;gap:15px}.frame-output,html[lang=ta] .frame-output{grid-column:1}.study-play{font-size:.875rem}.world-image{aspect-ratio:1}.world-image figcaption>span:last-child{font-size:.8rem}.world-toolbar-note{font-size:12px}.art-disclosure{font-size:12px}.world-caption p{font-size:1rem}.section-heading h2{font-size:45px}.direction-title h2{font-size:74px}.direction-list h3{font-size:24px}.direction-list details[open]{padding-inline:12px}.direction-list details>p{padding-left:0}.release-note strong{font-size:.9rem}.founder-copy h2{font-size:39px}.identity-study{min-height:360px}.contact-details{margin:0}.contact h2{font-size:58px}.contact-email{font-size:18px}.contact-top .eyebrow{font-size:12px}.contact-symbol{width:50px}.footer-top,.footer-top>.text-link{font-size:12px}.footer-wordmark{font-size:13.8vw}.footer-bottom{font-size:12px}.footer-bottom .motion-toggle{font-size:12px}.languages{font-size:12px}.brand>svg{width:39px;height:31px}.brand>span{font-size:.85rem}.header-tools{gap:4px}.header-motion{min-width:30px}.header-motion .motion-bars{gap:3px}.intro-pause,.intro-skip{bottom:25px}.intro-identity>p{padding-inline:22px;font-size:.8rem}
html[lang=ta] .hero{min-height:900px}html[lang=ta] .hero h1{font-size:8.3vw;line-height:1.7}html[lang=ta] .hero-main{padding-top:130px}html[lang=ta] .hero-aside{margin-top:30px}html[lang=ta] .hero-aside p{font-size:1rem;max-width:none}html[lang=ta] .study-copy h2{font-size:28px;line-height:1.7}html[lang=ta] .study-copy>p:last-of-type{font-size:1rem}html[lang=ta] .study-phases{gap:16px}html[lang=ta] .study-phases span{font-size:12px}html[lang=ta] .contact h2{font-size:37px}html[lang=ta] .section-heading h2{font-size:30px}}
@media(max-width:360px){:root{--gutter:18px}.site-header{gap:6px}.brand{gap:6px}.brand>svg{width:30px;height:28px}.brand>span{font-size:.76rem}.brand small{font-size:5px}.languages{gap:5px}.header-tools{gap:0}.menu-toggle{width:34px;min-width:34px}.hero h1{font-size:20vw}.contact-email{font-size:16px}.cel-stage{height:290px}}
.motion-paused .hero-image,.motion-paused .portal-mark,.motion-paused .world-image img{transform:none!important}.motion-paused .footer-letter{transform:none!important}.motion-paused .intro-frame{clip-path:none;transform:none}.motion-paused .cel{transition:none!important}
@media(prefers-reduced-motion:reduce){.hero-image,.portal-mark,.world-image img{transform:none!important}.intro-frame{clip-path:none;transform:none}.world-panel{clip-path:none!important}.footer-letter{transform:none!important}}

/* Choreograph the first frame after the intro; sleep scenes outside the viewport. */
.hero{display:block}main{overflow-x:clip}
.intro-active .hero-line>span{animation:none;transform:translateY(115%)}
.intro-finished .hero-line>span{animation-name:title-in}
.scene-asleep .aperture-outline,.scene-asleep .hero-image img,.scene-asleep .identity-ring{animation-play-state:paused}

.cel svg{fill:currentColor}.world-image:hover img{transform:scale(calc(1.08 + var(--world-progress,0)*.08)) translateY(calc(var(--world-progress,0)*-3%))}
.scene-asleep .identity-mark,.scene-asleep .scroll-stroke:after{animation-play-state:paused}