/* DevDay-inspired visual rhythm. Content remains visible without JavaScript. */
:root{--ink:#151515;--muted:#68686c;--deep:#6330a0;--line:#e5e5e7;--ease-out:cubic-bezier(.22,1,.36,1)}
.wrap{width:min(1240px,90%)}
h1,h2,h3{text-wrap:balance}
.community-nav{min-height:80px;background:#fcfcfce8;border-color:#1515150d;backdrop-filter:blur(22px)}
.community-nav nav a{position:relative;padding-block:6px}
.community-nav nav a:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-out)}
.community-nav nav a:hover{text-decoration:none}
.community-nav nav a:hover:after{transform:scaleX(1)}
.codex-mark{border:0;background:#171717;color:white;border-radius:11px}
.button{padding:15px 24px;transition:background .25s,transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.button:hover{transform:translateY(-3px);box-shadow:0 8px 20px #18181812;background:#333}
.button>span{transition:transform .45s var(--ease-out)}
.button:hover>span{transform:translate(2px,-2px)}
.community-hero{grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);gap:64px;min-height:0;padding-block:80px 76px}
.community-hero h1{font-size:clamp(54px,6.4vw,86px);line-height:1.02;letter-spacing:-.065em;margin-bottom:24px}
.hero-intro .lede{font-size:19px;line-height:1.55;max-width:430px}
.hero-intro .actions{gap:21px;margin-top:29px}
.hero-intro .quiet-link{font-size:13px}
.hero-stage{width:100%;max-width:440px;height:350px;justify-self:end;position:relative;isolation:isolate;overflow:hidden;border-radius:24px;background:#151516;perspective:1000px}
.hero-stage:before{content:'';position:absolute;inset:0;opacity:.23;background-image:radial-gradient(#a699bf 1px,transparent 1px);background-size:19px 19px;mask-image:linear-gradient(140deg,#000,transparent 75%)}
.hero-stage:after{content:'';position:absolute;width:290px;height:290px;right:-150px;top:-140px;border:1px solid #ffffff12;border-radius:50%;box-shadow:0 0 0 30px #ffffff04,0 0 0 60px #ffffff03;pointer-events:none}
.hello-ticket{position:absolute;left:10%;top:17%;width:78%;height:228px;padding:23px 27px;background:#ba9aff;color:#17121f;border-radius:9px;transform:rotate(-7deg);box-shadow:0 20px 35px #0004;will-change:transform}
.hello-ticket:before,.hello-ticket:after{content:'';position:absolute;width:22px;height:22px;background:#151516;border-radius:50%;top:151px}
.hello-ticket:before{left:-11px}.hello-ticket:after{right:-11px}
.ticket-top{display:flex;justify-content:space-between;align-items:center;font-size:26px;line-height:1;height:28px}
.ticket-glyph{font-size:29px;letter-spacing:-.1em;font-weight:600}
.ticket-star{font-size:32px}
.ticket-title{font-size:clamp(31px,3.5vw,46px);line-height:1.04;letter-spacing:-.065em;font-weight:600;display:block;margin-top:15px}
.ticket-perforation{position:absolute;left:17px;right:17px;bottom:64px;border-top:1px dashed #17121f55}
.ticket-bottom{position:absolute;bottom:21px;left:27px;font-size:15px;letter-spacing:-.02em}
.hero-dot{position:absolute;width:158px;height:158px;object-fit:contain;right:0;bottom:1px;filter:drop-shadow(0 16px 14px #0003);transform:rotate(9deg);pointer-events:none}
.hero-replay{position:absolute;z-index:3;left:22px;bottom:19px;display:flex;align-items:center;gap:9px;color:#e6dfef;background:#27262b;border:1px solid #ffffff16;border-radius:24px;padding:8px 13px;font-size:12px;transition:background .25s}
.hero-replay:hover{background:#3b3347}.hero-replay:focus-visible{outline-color:#c8adff}
.hero-replay svg{width:15px;height:15px}.hero-replay[hidden]{display:none}
.section{padding-block:86px}
#whats-on{border-top:1px solid var(--line);padding-top:48px}
.section-top{margin-bottom:34px}
.section-top h2{font-size:clamp(36px,4vw,54px);letter-spacing:-.055em}
.events-grid{gap:28px}
.event-card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out)}
.event-art{height:280px;border-radius:0;isolation:isolate}
.event-art:before,.event-art:after{content:'';position:absolute;bottom:-11px;width:22px;height:22px;background:#fff;border-radius:50%;z-index:4}
.event-art:before{left:-11px}.event-art:after{right:-11px}
.event-first .event-art>strong{top:43px;left:30px;font-size:54px;letter-spacing:-.065em}
.event-art .art-bottom{bottom:23px}
.event-dot-art{background:#171719}
.event-dot-art .art-bottom{color:#e7dafa}
.event-dot-art>img{top:33px;left:20%;width:170px;height:170px;animation:none;filter:drop-shadow(0 14px 17px #0003);transition:transform .7s var(--ease-out)}
.event-dot-art>img:nth-of-type(2){top:60px;left:53%;width:143px;height:143px}
.event-details{padding:27px 29px 26px}
.event-meta{font-size:13px;margin-bottom:20px;gap:8px}
.status-pill{font-size:11px;background:#efe5ff;color:#59358a;padding:6px 11px}
.muted-pill{background:#f1eef5;color:#67616f}
.event-details h3{font-size:31px;letter-spacing:-.045em}
.event-details>p{font-size:15px}
.event-time{margin-block:19px 24px}
.text-link{font-size:14px}
.text-link span{transition:transform .4s var(--ease-out)}
.text-link:hover span{transform:translate(3px,-3px)}
.new-section{background:#141416;color:#f6f5f8;margin-block:12px 0}
.feature-lead{gap:75px;grid-template-columns:1fr 1.1fr}
.feature-lead h2{font-size:clamp(38px,4.5vw,60px);letter-spacing:-.055em}
.feature-lead p{color:#bcb9c2;font-size:17px}
.new-section .button{color:#16121d;background:#c8afff;border-color:#c8afff}
.new-section .button:hover{background:#dbcaff}
.feature-image{border-radius:20px;box-shadow:none;background:#f0edf7;transition:transform .7s var(--ease-out)}
.feature-image>img{aspect-ratio:1.8;padding:30px;transition:transform .8s var(--ease-out)}
.feature-image>span{padding:21px 26px;border-color:#ddd7e8}
.feature-links{gap:35px;margin-top:64px}
.feature-links a{color:#f4f2f7;border-color:#ffffff30;padding-top:25px;gap:13px}
.feature-links span{color:#aaa5b4;font-size:13px}
.feature-links strong{font-size:24px;font-weight:400}
.feature-links a>span:first-child{color:#c9a8ff}
.conversation-grid{gap:26px}.thumbnail{border-radius:17px;aspect-ratio:16/10}
.thumbnail>img{transition:transform .7s var(--ease-out),filter .7s var(--ease-out);filter:saturate(.6)}
.conversation-card:hover .thumbnail>img{transform:scale(1.04);filter:saturate(1)}
.play-mark{width:43px;height:43px;background:#fcfcfc;color:#171717}
.conversation-card h3{font-size:26px;font-weight:400;letter-spacing:-.035em}
.community-close{background:#c8afff;border-radius:24px;padding:53px 60px;margin-bottom:80px;overflow:hidden;position:relative;isolation:isolate}
.community-close:after{content:'';position:absolute;right:4%;top:-85%;width:560px;aspect-ratio:1;border:1px solid #17171716;border-radius:50%;z-index:-1;box-shadow:0 0 0 45px #17171704,0 0 0 90px #17171703}
.community-close h2{font-size:clamp(36px,4.5vw,60px)}
.community-close>img{width:205px;height:205px;transform:rotate(6deg);transition:transform .7s var(--ease-out)}
.community-footer{background:#f5f5f5;padding-block:47px;font-size:13px}
.community-footer p{font-size:13px}.community-footer small{font-size:11px}
.breadcrumb{font-size:12px}
.workshop-hero{gap:64px;padding-block:32px 63px;grid-template-columns:1.15fr 1fr}
.workshop-title h1{font-size:clamp(52px,5.8vw,80px)}
.workshop-poster{min-height:400px;max-width:470px;width:100%;justify-self:end;border-radius:20px;padding:32px;transform:rotate(2deg);box-shadow:0 16px 42px #43216910}
.workshop-poster>span:first-child{font-size:55px}.workshop-poster>div{margin-top:45px}.poster-bottom{font-size:12px}
.registration-panel,.kit-card,.product-visual,.privacy-note{border-radius:20px}
.kit-section{background:#f3f1f7}
.kit-card{transition:transform .6s var(--ease-out)}
.kit-downloads a{transition:background .25s,padding-left .4s var(--ease-out)}
.kit-downloads a:hover{background:#eae5f2;padding-left:32px}
.teaser-hero{gap:50px;padding-block:32px 65px;grid-template-columns:1.13fr 1fr}
.teaser-hero h1{font-size:clamp(50px,5.5vw,76px)}
.dot-stage{height:380px;border-radius:24px;background:#171719;isolation:isolate}
.dot-stage:before{content:'';position:absolute;width:76%;aspect-ratio:1;background:radial-gradient(#9862cb40,transparent 68%);border-radius:50%}
.dot-stage picture{width:90%;max-width:360px;margin-top:-28px}
.dot-ring{border-color:#b995e826;width:83%}.ring-two{width:70%}
.dot-caption{bottom:53px;font-size:12px;color:#c7b9d7}
.motion-control{bottom:15px;background:#ffffff0c;color:#dfc5ff;border-color:#c3a2e533;font-size:12px}
.teaser-band{background:#e9defb}.teaser-band h2{max-width:690px}
.product-feature{padding-block:80px}.product-visual{background:#eeebf4;padding:30px;overflow:hidden}
.product-visual img{transition:transform .9s var(--ease-out)}
.challenge-intro{padding-bottom:50px}.challenge-intro>img{width:190px;transform:rotate(5deg)}
.challenge-board{background:#151517;border-radius:24px;padding:10px 38px 0;margin-bottom:78px;color:#f4f2f6}
.challenge-options{display:block;counter-reset:quest}
.challenge-options article,.challenge-options article:first-child{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 48px;padding:36px 0 38px 63px;border:0;border-bottom:1px solid #ffffff26;background:none;border-radius:0;counter-increment:quest}
.challenge-options article:last-child{border-bottom:0}
.challenge-options article:before{content:'0' counter(quest);position:absolute;top:37px;left:0;color:#bbaaCA;font-size:19px}
.challenge-options .workshop-date{grid-column:1;font-size:13px;color:#c4b3d8;margin:0 0 10px}
.challenge-options h2{grid-column:1;font-size:clamp(29px,3.5vw,42px);font-weight:400;letter-spacing:-.035em;margin:0 0 13px}
.challenge-options article>p:not(.workshop-date):not(.challenge-deadline){grid-column:1;color:#bdb9c4;font-size:15px;max-width:530px;margin:0}
.challenge-options .challenge-deadline{grid-column:2;grid-row:1 / span 3;margin:0!important;align-self:start;font-size:25px!important;text-align:right;padding-top:8px}
.challenge-deadline span{font-size:13px;color:#bcb1c8;margin-top:3px}
.challenge-options .button{grid-column:2;grid-row:4;align-self:center;margin-top:27px;background:#c8afff;color:#17121d;border-color:#c8afff;font-size:13px}
.challenge-options .button:hover{background:#ddcbff}
.challenge-options .quiet-link{grid-column:1;grid-row:4;color:#d2c4e5;font-size:13px;align-self:end;margin:24px 0 9px}
.theatre{background:#151517;border-radius:20px;grid-template-columns:minmax(0,1.85fr) minmax(300px,1fr)}
.moments-panel{background:#211f25;padding:29px}.moments-panel h3{font-weight:400;font-size:27px}
.moments-panel li{padding-top:20px}.moment{gap:12px}.moment strong{font-size:14px;font-weight:400}
.moment time{font-size:12px;color:#cfb0ff}.moments-panel li>p{font-size:12px;line-height:1.65}
.moments-hint{font-size:12px}.episode-info h2{font-weight:400}.episode-selector{gap:22px;margin-bottom:32px}
.episode-button{transition:opacity .3s,border-color .3s}.episode-button>img{border-radius:12px}
.episode-button strong{font-weight:400}.episode-number,.episode-button small{font-size:11px}
.reveal-ready{opacity:0;transform:translateY(25px);transition:opacity .8s var(--ease-out),transform .9s var(--ease-out);transition-delay:var(--reveal-delay,0ms)}
.reveal-ready.is-revealed{opacity:1;transform:translateY(0)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.event-card:hover{transform:translateY(-5px);box-shadow:0 18px 42px #17171709}.event-card:hover .event-dot-art>img{transform:translateY(-7px) rotate(-5deg)}.event-card:hover .event-dot-art>img:nth-of-type(2){transform:translateY(-12px) rotate(7deg)}.feature-image:hover>img,.product-visual:hover img{transform:scale(1.035)}.community-close:hover>img{transform:translateY(-8px) rotate(-4deg)}.kit-card:hover{transform:translateY(-4px)}}
@media(min-width:1500px){.community-hero{padding-block:90px;min-height:0}.community-hero h1{font-size:88px}}
@media(max-width:1050px){.community-hero{gap:35px;padding-block:62px}.community-hero h1{font-size:clamp(47px,6.4vw,69px)}.hero-stage{height:320px}.hello-ticket{height:212px;padding:22px}.ticket-title{font-size:clamp(29px,3.5vw,37px)}.ticket-perforation{bottom:54px}.hello-ticket:before,.hello-ticket:after{top:147px}.ticket-bottom{bottom:16px;left:22px;font-size:13px}.hero-dot{width:139px;height:139px}.hero-intro .lede{font-size:18px}.hero-intro .actions{gap:16px}.event-art{height:260px}.event-first .event-art>strong{font-size:48px}.event-meta{display:block}.event-meta .status-pill{margin-top:10px}.feature-lead{gap:40px}.workshop-hero{gap:38px}.workshop-poster{min-height:380px}.workshop-poster>span:first-child{font-size:47px}.dot-stage{height:350px}.challenge-options article{gap:0 28px}.theatre{grid-template-columns:minmax(0,1.5fr) minmax(285px,1fr)}.moments-panel{padding:24px}}
@media(max-width:760px){.community-nav{padding-block:15px;gap:13px}.community-nav nav{font-size:12px}.community-hero{grid-template-columns:1fr;gap:33px;padding-block:47px 46px;min-height:0}.community-hero h1{font-size:clamp(48px,10vw,72px);max-width:600px}.hero-intro .lede{max-width:480px}.hero-intro .actions{margin-top:25px;gap:18px}.hero-stage{height:290px;max-width:500px;justify-self:start}.hello-ticket{left:13%;top:14%;width:73%;max-width:345px;height:212px}.ticket-title{font-size:39px}.hero-dot{width:145px;height:145px;right:7%;bottom:2px}.hero-replay{left:17px;bottom:15px}.section{padding-block:55px}#whats-on{padding-top:38px}.events-grid{grid-template-columns:1fr;gap:27px}.event-art{height:280px}.event-meta{display:flex}.event-meta .status-pill{margin-top:0}.event-details{padding:24px}.event-details h3{font-size:29px}.event-first .event-art>strong{font-size:52px}.event-dot-art>img{top:32px;left:22%;width:177px;height:177px}.event-dot-art>img:nth-of-type(2){top:74px;left:55%;width:140px;height:140px}.feature-lead{grid-template-columns:1fr;gap:32px}.feature-lead h2{font-size:45px}.feature-links{margin-top:37px;grid-template-columns:1fr;gap:22px}.feature-links a{grid-template-columns:90px 1fr;gap:10px 17px}.feature-links strong{font-size:22px}.feature-links span{font-size:12px}.feature-image>span{font-size:12px;padding:18px 20px}.conversation-grid{gap:30px}.conversation-card h3{font-size:23px}.community-close{padding:33px 25px;margin-bottom:55px;gap:0}.community-close h2{font-size:35px}.community-close>img{width:113px;height:113px}.community-close p{font-size:14px}.community-footer{padding-block:35px}.workshop-hero{grid-template-columns:1fr;gap:33px;padding-block:21px 38px}.workshop-title h1{font-size:clamp(49px,9.5vw,65px)}.workshop-poster{min-height:345px;max-width:500px;justify-self:center;transform:rotate(1deg);padding:28px}.workshop-poster>span:first-child{font-size:49px}.teaser-hero{grid-template-columns:1fr;padding-block:22px 36px;gap:28px}.teaser-hero h1{font-size:clamp(49px,9.5vw,65px)}.dot-stage{height:340px;max-width:500px;width:100%;justify-self:center}.dot-stage picture{max-width:320px}.product-feature{padding-block:48px}.challenge-board{padding:0 25px;margin-bottom:50px;border-radius:20px}.challenge-options article,.challenge-options article:first-child{display:block;padding:30px 0 30px 40px}.challenge-options article:before{font-size:15px;top:30px}.challenge-options h2{font-size:32px}.challenge-options .challenge-deadline{text-align:left;margin-top:22px!important;font-size:24px!important}.challenge-options .button{margin-top:20px;font-size:12px;padding:13px 17px}.challenge-options .quiet-link{margin:20px 0 0}.theatre{grid-template-columns:1fr}.moments-panel{padding:26px}.episode-selector{gap:15px}.episode-button{min-width:170px}.episode-button strong{font-size:13px}}
@media(max-width:380px){.community-hero h1{font-size:46px}.hero-stage{height:265px}.hello-ticket{left:10%;width:77%;top:13%;height:193px}.ticket-title{font-size:33px;margin-top:12px}.ticket-top{height:23px}.ticket-perforation{bottom:45px}.hello-ticket:before,.hello-ticket:after{top:137px}.ticket-bottom{bottom:12px;font-size:12px}.hero-dot{width:127px;height:127px;right:2%}.event-meta{display:block}.event-meta .status-pill{margin-top:10px}.event-details{padding:22px}.event-first .event-art>strong{font-size:46px}.community-close>img{width:78px;height:78px}.community-close h2{font-size:31px}.challenge-board{padding-inline:20px}.challenge-options article,.challenge-options article:first-child{padding-left:30px}.challenge-options h2{font-size:29px}.dot-caption{font-size:11px}.feature-links a{grid-template-columns:75px 1fr}}
@media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none;transition:none}.hero-replay{display:none}.hello-ticket,.hero-dot{will-change:auto}.button:hover,.event-card:hover{transform:none}html{scroll-behavior:auto!important}}
