@import url('./styles.css');
@import url('./party.css');
/* Load the shared theme first so the guide layout stays last in both builds. */
/* Phone/browser guide: independent layout, shared party theme and interactions. */
.guide-page{padding-bottom:env(safe-area-inset-bottom)}
.guide-wrap,.guide-footer{width:min(100% - 64px,1216px);margin-inline:auto}.guide-page h1,.guide-page h2,.guide-page h3{font-family:var(--heading);font-weight:800}.guide-page p{font-size:16px;line-height:1.75}.guide-page h2{font-size:clamp(34px,3.6vw,49px);letter-spacing:-1.5px;line-height:1.05;margin:0}.guide-page h2>span{color:#ff7aaa}.guide-page .button{border-radius:12px;border:1px solid #fff19e;border-bottom:4px solid #ad741e;box-shadow:0 5px 0 #030813;font-size:16px;min-height:57px;background:linear-gradient(#ffe880,#ffca38);color:#201b2c}.guide-page .button:hover{box-shadow:0 7px 0 #030813;transform:translateY(-2px)}.guide-page .button:active{transform:translateY(2px);box-shadow:0 2px 0 #030813}
.guide-header{max-width:none;width:100%;padding:21px max(32px,calc((100% - 1216px)/2));gap:28px;position:sticky;top:0;background:#090f1af2;border-bottom:1px solid #38415c;backdrop-filter:blur(15px)}.guide-header .desktop-nav{margin-left:auto;gap:25px}.guide-header .desktop-nav a{font-size:14px;color:#becbe0}.guide-header .desktop-nav a:hover{color:#ffe27a}.guide-header .header-cta{min-height:46px;font-size:14px;padding:10px 16px;gap:16px;box-shadow:0 3px 0 #030813}.guide-header .wordmark{font-size:27px;flex-shrink:0}.guide-header .mobile-nav{background:#17243a;border-color:#566181;box-shadow:0 9px 25px #030710b0;z-index:30}.guide-header .mobile-nav a{font-size:16px;min-height:44px}
.guide-hero{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);gap:45px;align-items:center;padding:62px 0 43px}.guide-kicker{font-size:12px!important;font-weight:800;letter-spacing:1.3px;line-height:1.5!important;color:#7eddff;margin:0 0 17px}.guide-kicker>span{display:inline-block;width:7px;height:7px;background:#83eac9;border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px #83eac912}.guide-hero h1{font-size:clamp(49px,5.25vw,72px);letter-spacing:-2.8px;line-height:1.01;color:#ffe27b;text-shadow:0 4px 0 #141126;margin:0 0 23px}.guide-hero h1 span{color:#ff70a8}.guide-hero-copy>p:not(.guide-kicker){color:#c0cde0;font-size:18px;max-width:460px;margin:0 0 25px;line-height:1.65}.guide-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.guide-text-link{font-size:14px;font-weight:700;min-height:44px;display:inline-flex;align-items:center;gap:12px;color:#dceaf7}.guide-text-link:hover{color:#ffdf6b}.guide-platforms{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.guide-platforms>span{font-size:12px;color:#b4c7dd;padding:5px 10px;border:1px solid #3d506b;background:#142134;border-radius:99px}.guide-hero-art{margin:0;position:relative;min-width:0;transform:rotate(2deg);border:2px solid #845a78;border-radius:24px;box-shadow:0 9px 0 #040814;overflow:hidden}.guide-hero-art img{width:100%;height:auto;aspect-ratio:1.25;object-fit:cover;object-position:50% 43%;display:block}.guide-hero-art:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#141022b5);pointer-events:none}.guide-hero-art figcaption{position:absolute;z-index:1;bottom:21px;left:22px;transform:rotate(-4deg);padding:12px 15px;border:2px solid #201528;border-radius:8px;background:#ffda55;box-shadow:4px 4px 0 #201528;color:#25172c;font-family:var(--heading);font-size:18px;line-height:1.1}.guide-hero-art figcaption span,.guide-hero-art figcaption b{display:block}
.guide-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;background:#152135;border:1px solid #425470;border-radius:17px;padding:21px 12px;box-shadow:0 5px 0 #050a13}.guide-benefits>div{display:flex;align-items:center;justify-content:center;gap:14px;border-right:1px solid #3c4c67;padding:0 12px}.guide-benefits>div:last-child{border:0}.guide-benefits>div>span{font-size:30px;line-height:1;color:#ff75a9}.guide-benefits>div:nth-child(2)>span{color:#ffda5b}.guide-benefits>div:nth-child(3)>span{color:#7ce0ff}.guide-benefits p{margin:0}.guide-benefits b{display:block;font-size:14px;line-height:1.5}.guide-benefits small{font-size:12px;color:#a9bad3;display:block;margin-top:2px;line-height:1.5}
.guide-section{padding-top:76px;scroll-margin-top:108px}.guide-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:36px;margin-bottom:30px}.guide-section-heading>p{max-width:290px;color:#b5c4db;margin:0 0 2px}.guide-join-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px;list-style:none;padding:0;margin:0}.guide-join-steps li{border:1px solid #405674;background:linear-gradient(135deg,#1e2d46,#141e31);border-radius:18px;padding:27px;display:flex;flex-direction:column;min-width:0;box-shadow:0 5px 0 #050a14}.guide-join-steps li>span{font-family:var(--heading);font-size:26px;font-weight:800;width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:#ffdb54;color:#281c29;box-shadow:0 4px 0 #88601e;margin-bottom:25px;transform:rotate(-6deg)}.guide-join-steps li:nth-child(2)>span{background:#ff78ad;box-shadow:0 4px 0 #8f355e;transform:rotate(5deg)}.guide-join-steps li:nth-child(3)>span{background:#7edeff;box-shadow:0 4px 0 #286c90;transform:rotate(-3deg)}.guide-join-steps h3{font-size:24px;letter-spacing:-.7px;line-height:1.2;margin:0 0 14px;color:#fff0d8}.guide-join-steps p{color:#bdcbe0;margin:0 0 25px}.guide-step-note{font-size:12px;line-height:1.5;font-weight:700;letter-spacing:.4px;padding-top:16px;border-top:1px solid #43516b;color:#ffdf74;margin-top:auto}.guide-join-steps li:nth-child(2) .guide-step-note{color:#ff94be}.guide-join-steps li:nth-child(3) .guide-step-note{color:#90e5ff}
.guide-device-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.guide-device-grid article{display:flex;align-items:flex-start;gap:17px;background:#141f33;border:1px solid #3c536f;border-radius:17px;padding:24px;min-width:0}.guide-device-icon{width:45px;height:48px;display:grid;place-items:center;border:1px solid #5a4c72;border-radius:13px;background:#30233e;font-size:25px;flex-shrink:0;color:#ff88b5}.guide-device-grid article:nth-child(2) .guide-device-icon{background:#183543;color:#7ee3ff;border-color:#346475}.guide-device-grid article:nth-child(3) .guide-device-icon{background:#38312b;border-color:#705f38}.guide-device-grid h3{font-size:22px;line-height:1.25;letter-spacing:-.5px;margin:0 0 10px}.guide-device-grid p{font-size:16px;color:#b5c5db;margin:0 0 17px}.guide-device-tag{font-size:12px;color:#8eeacd;letter-spacing:.4px;line-height:1.5;display:block;font-weight:700}.guide-device-note{color:#a5b9d2;font-size:14px!important;text-align:center;margin:23px 0 0}.guide-device-note a{color:#ffe17b;display:inline-flex;align-items:center;min-height:44px;gap:9px;margin-left:8px;font-weight:700}
.guide-playground{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:65px;align-items:center}.guide-playground-copy>p:not(.guide-kicker){color:#b9c9df;max-width:480px;margin:24px 0}.guide-playground-copy h2{font-size:clamp(38px,4.5vw,58px)}.guide-sound{padding:25px;border:1px solid #565075;border-left:3px solid #ff78aa;border-radius:16px;background:linear-gradient(120deg,#2b2140,#142335);display:flex;flex-direction:column;align-items:center;gap:14px;max-width:440px}.guide-sound .audio-wave{height:49px;gap:5px;justify-content:center}.guide-sound .audio-wave i{width:5px;background:#7fdfff}.guide-sound .sample-button{min-height:47px;padding:12px 21px;font-size:14px;border-radius:10px;background:#ffda58;color:#211827;border-color:#ffe995;gap:10px}.guide-sound .sample-note{font-size:12px;line-height:1.6;color:#c1cbdf;text-align:center;max-width:none;margin:0}.guide-wheel-card.hero-stage{background:radial-gradient(ellipse at 50% 20%,#473557aa,transparent 70%),#152137;border:1px solid #6e567c;border-radius:22px;padding:27px 28px 22px;gap:0;min-width:0;box-shadow:0 7px 0 #040914}.guide-wheel-label{font-size:12px!important;line-height:1.5!important;letter-spacing:1px;font-weight:800;color:#ffca72;text-align:center;margin:0 0 32px}.guide-page .wheel-shell{width:min(100%,330px);padding:12px;--guide-wheel-orbit:clamp(70px,20vw,98px)}.guide-page .wheel-label{width:75px;height:55px;margin-left:-37.5px;margin-top:-27.5px;font-size:10px;letter-spacing:.4px}.guide-page .wheel-label b{font-size:31px;letter-spacing:-1px;margin-bottom:3px}.guide-page .label-0{transform:translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .label-1{transform:rotate(60deg) translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .label-2{transform:rotate(120deg) translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .label-3{transform:rotate(180deg) translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .label-4{transform:rotate(240deg) translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .label-5{transform:rotate(300deg) translateY(calc(-1 * var(--guide-wheel-orbit)))}.guide-page .spin-button{width:93px;height:93px;border-width:4px;font-size:12px;background:#fff5d5}.guide-page .spin-icon{font-size:32px}.guide-page .wheel-result{width:100%;max-width:100%;align-self:stretch;transform:none;margin:28px 0 0;background:#fbf0d9;border-color:#1c1729;box-shadow:3px 4px 0 #090f1b;padding:15px;gap:11px;min-height:87px}.guide-page .wheel-result p{font-size:14px;line-height:1.55;margin:4px 0 0}.guide-page .small-label{font-size:12px;letter-spacing:.25px}.guide-page .result-mark{width:36px;height:36px;font-size:28px;background:#ff84b2}.guide-page .wheel-disclaimer{font-size:12px;color:#b8c6dc;margin:17px 0 0;line-height:1.6}
.guide-faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:55px;align-items:start}.guide-questions details{border-bottom:1px solid #40506c;padding:0 0 5px}.guide-questions details:first-child{border-top:1px solid #40506c}.guide-questions summary{cursor:pointer;font-weight:700;font-size:17px;color:#f9efd9;padding:22px 35px 18px 0;position:relative;list-style:none;line-height:1.45}.guide-questions summary::-webkit-details-marker{display:none}.guide-questions summary:after{content:"+";position:absolute;right:3px;top:18px;font-size:26px;font-weight:400;color:#ffcc5e}.guide-questions details[open] summary:after{content:"−"}.guide-questions summary:focus-visible{outline:3px solid #ff76ad;outline-offset:4px;border-radius:5px}.guide-questions p{margin:0 30px 20px 0;color:#b8c8de;font-size:16px}.guide-finale{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;margin-top:75px;border:1px solid #8b6178;background:#2c2140;border-radius:23px;overflow:hidden;box-shadow:0 8px 0 #040811}.guide-finale>img{width:100%;height:100%;min-height:340px;object-fit:cover;display:block}.guide-finale>div{padding:42px;align-self:center}.guide-finale .guide-kicker{color:#8cdefa;font-size:12px}.guide-finale h2{color:#ffde73;font-size:clamp(32px,3.5vw,47px)}.guide-finale p:not(.guide-kicker){color:#c7d0e0;margin:21px 0 23px}.guide-footer{padding:39px 0 32px;margin-top:42px;display:flex;justify-content:space-between;align-items:center;gap:26px;border-top:1px solid #354661}.guide-footer .wordmark{font-size:25px}.guide-footer p{font-size:14px;color:#a6bad2;margin:0}
@media(max-width:1100px){.guide-hero{gap:30px}.guide-hero h1{font-size:57px}.guide-hero-copy>p:not(.guide-kicker){font-size:17px}.guide-actions{gap:16px}.guide-join-steps li{padding:22px}.guide-device-grid article{padding:22px;display:block}.guide-device-icon{margin-bottom:18px}.guide-device-grid h3{font-size:23px}.guide-playground{gap:35px}.guide-header{gap:20px}.guide-header .desktop-nav{gap:20px}.guide-benefits>div{padding-inline:10px;gap:11px}.guide-benefits>div>span{font-size:25px}.guide-wheel-card.hero-stage{padding-inline:23px}.guide-finale>div{padding:32px}}
@media(max-width:800px){.guide-wrap,.guide-footer{width:min(100% - 40px,620px)}.guide-header{padding:16px 20px;gap:14px;justify-content:flex-start}.guide-header .desktop-nav{display:none}.guide-header .header-cta{margin-left:auto}.guide-header .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;align-items:center;border:1px solid #55627c;border-radius:10px;background:#17233a;width:44px;height:44px;padding:10px;flex-shrink:0}.guide-header .menu-toggle span{width:21px;height:2px;background:#ffdf78;display:block}.guide-header .wordmark{font-size:25px}.guide-header .mobile-nav{left:20px;right:20px}.guide-hero{grid-template-columns:1fr;gap:31px;padding:35px 0 29px}.guide-hero h1{font-size:clamp(47px,8vw,62px);letter-spacing:-2px}.guide-hero-copy>p:not(.guide-kicker){max-width:540px;font-size:17px}.guide-hero-art{transform:none;border-radius:18px}.guide-hero-art img{aspect-ratio:1.65;object-position:center 40%}.guide-hero-art figcaption{font-size:16px;bottom:18px;left:18px}.guide-platforms{margin-top:22px}.guide-benefits{grid-template-columns:1fr;gap:0;padding:6px 20px}.guide-benefits>div{justify-content:flex-start;border-right:0;border-bottom:1px solid #3d4a63;padding:15px 0;gap:17px}.guide-benefits>div>span{width:28px;text-align:center;font-size:27px}.guide-benefits b{font-size:14px}.guide-benefits small{font-size:12px}.guide-section{padding-top:55px;scroll-margin-top:90px}.guide-section-heading{align-items:flex-start;flex-direction:column;gap:19px;margin-bottom:26px}.guide-section-heading>p{max-width:440px}.guide-page h2{font-size:38px}.guide-join-steps{grid-template-columns:1fr;gap:15px}.guide-join-steps li{padding:25px;display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:20px;align-items:start}.guide-join-steps li>span{grid-column:1;grid-row:1/4;margin:0}.guide-join-steps h3,.guide-join-steps p,.guide-step-note{grid-column:2}.guide-join-steps h3{font-size:24px;margin-bottom:12px}.guide-join-steps p{margin-bottom:17px}.guide-step-note{margin:0;padding-top:13px}.guide-device-grid{grid-template-columns:1fr;gap:14px}.guide-device-grid article{display:flex;gap:20px;padding:24px}.guide-device-icon{margin:0}.guide-device-grid p{margin-bottom:14px}.guide-device-note{margin-top:14px;text-align:left}.guide-device-note a{margin-left:0;margin-right:10px}.guide-playground{grid-template-columns:1fr;gap:30px}.guide-playground-copy h2{font-size:45px}.guide-playground-copy>p:not(.guide-kicker){max-width:none}.guide-sound{max-width:none}.guide-wheel-card.hero-stage{padding:27px 26px 23px}.guide-page .wheel-shell{--guide-wheel-orbit:98px}.guide-page .wheel-result{max-width:365px;align-self:center}.guide-faq{grid-template-columns:1fr;gap:25px}.guide-questions summary{font-size:16px}.guide-finale{grid-template-columns:1fr;margin-top:52px}.guide-finale>img{height:auto;aspect-ratio:1.65;min-height:0;object-position:center 36%}.guide-finale>div{padding:29px}.guide-finale h2{font-size:38px}.guide-footer{flex-wrap:wrap;gap:22px;margin-top:32px}.guide-footer p{order:3;width:100%}.guide-footer .guide-text-link{margin-left:auto}}
@media(max-width:420px){.guide-wrap,.guide-footer{width:calc(100% - 32px)}.guide-header{padding:14px 16px;gap:12px}.guide-header .wordmark{font-size:23px;gap:8px}.guide-header .brand-bars{gap:3px}.guide-header .brand-bars i{width:4px}.guide-header .header-cta{font-size:14px;min-height:44px;padding:8px 12px;gap:10px}.guide-header .header-cta span{font-size:19px}.guide-hero{padding-top:27px;gap:26px}.guide-hero h1{font-size:48px;line-height:1.02;letter-spacing:-2px}.guide-hero-copy>p:not(.guide-kicker){font-size:16px}.guide-kicker{font-size:12px!important;letter-spacing:.65px}.guide-actions{gap:14px}.guide-actions .button{padding:13px 19px;gap:20px;font-size:16px}.guide-actions .guide-text-link{font-size:14px}.guide-hero-art img{aspect-ratio:1.5}.guide-hero-art figcaption{font-size:14px;bottom:15px;left:14px;padding:10px 12px}.guide-benefits{padding-inline:18px}.guide-section{padding-top:44px}.guide-page h2{font-size:34px;letter-spacing:-1.1px}.guide-join-steps li{padding:22px 18px;column-gap:15px;grid-template-columns:40px minmax(0,1fr)}.guide-join-steps li>span{width:40px;height:43px;font-size:23px}.guide-join-steps h3{font-size:22px}.guide-join-steps p{font-size:16px}.guide-step-note{font-size:12px;letter-spacing:0}.guide-device-grid article{padding:22px 18px;gap:15px}.guide-device-icon{width:39px;height:44px;font-size:23px}.guide-device-grid h3{font-size:22px}.guide-device-grid p{font-size:16px}.guide-sound{padding:22px 18px}.guide-sound .audio-wave{gap:4px}.guide-sound .audio-wave i{width:4px}.guide-wheel-card.hero-stage{padding:25px 19px 20px}.guide-page .wheel-shell{--guide-wheel-orbit:clamp(70px,23vw,92px)}.guide-page .wheel-label{font-size:10px}.guide-page .wheel-label b{font-size:28px}.guide-page .spin-button{width:85px;height:85px;font-size:12px}.guide-page .wheel-result{padding:13px;gap:10px}.guide-page .wheel-disclaimer{max-width:260px}.guide-finale>div{padding:27px 22px}.guide-finale h2{font-size:34px}.guide-footer .wordmark{font-size:23px}}
@media(max-width:350px){.guide-header .header-cta{display:none}.guide-header .menu-toggle{margin-left:auto}.guide-hero h1{font-size:43px}.guide-actions{align-items:flex-start;flex-direction:column;gap:7px}.guide-platforms{gap:6px}.guide-platforms>span{font-size:12px;padding:4px 8px}.guide-join-steps li{display:block}.guide-join-steps li>span{margin-bottom:20px}.guide-step-note{display:block}.guide-device-grid article{display:block}.guide-device-icon{margin-bottom:15px}.guide-page .wheel-label{font-size:10px;letter-spacing:0}.guide-page .wheel-label b{font-size:25px}.guide-page .spin-button{width:77px;height:77px}.guide-page .spin-icon{font-size:29px}.guide-footer .guide-text-link{margin-left:0}}
@media(prefers-reduced-motion:reduce){.guide-page *,.guide-page *:before,.guide-page *:after{animation:none!important;transition:none!important}}