/* Homepage Experience Stage. Existing Discovery and mode routing stay in vibesxs-player.php. */
#vibesxs-homepage-root{padding-top:0;background:#0c0a16}
#vibesxs-homepage-root .vhp-container{max-width:1440px;padding:0 0 40px}
#vxs-experience-stage{font-family:'DM Sans',sans-serif;color:#f9f5ff}
#vxs-experience-stage *{box-sizing:border-box}
.vxs-stage-eyebrow{font:700 11px/1.2 'Syne',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#9eaaff;margin:0 0 16px}
.vxs-stage-hero{min-height:580px;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(22px,4vw,64px);align-items:center;padding:clamp(40px,6vw,88px) clamp(24px,5vw,78px);background:radial-gradient(ellipse at 70% 12%,#382243 0,#15111f 46%,#0b0a15 90%)}
.vxs-stage-hero-copy{position:relative;z-index:1;max-width:680px}
#vxs-stage-title{font:800 clamp(42px,5.4vw,82px)/1.03 'Syne',sans-serif;letter-spacing:-.055em;color:#fff;margin:0 0 24px}
#vxs-stage-title em{font-style:normal;color:#aeb8ff}
.vxs-stage-intro{font-size:clamp(16px,1.5vw,20px);line-height:1.6;color:#dfd7e6;max-width:560px;margin:0 0 32px}
.vxs-stage-hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.vxs-stage-hero-actions a{min-height:50px;padding:11px 20px;border-radius:12px;font-weight:700;font-size:15px;display:inline-flex;align-items:center;gap:18px;text-decoration:none;transition:transform .2s,background .2s}
.vxs-stage-hero-actions a:hover{transform:translateY(-2px)}
.vxs-stage-primary{background:#7f91f0;color:#10152e!important;box-shadow:0 14px 34px #667eea66}
.vxs-stage-secondary{border:1px solid #e1ccf880;color:#f8f0ff!important;background:#ffffff0b}
.vxs-stage-gallery{height:clamp(360px,40vw,540px);position:relative;border-radius:28px;overflow:hidden;border:1px solid #aeb8ff70;box-shadow:0 35px 80px #0302078a;background:#21172b}
.vxs-stage-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .55s ease;pointer-events:none}
.vxs-stage-scene.is-active{opacity:1}
.vxs-stage-gallery::after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(0deg,#0b081dd6,transparent);pointer-events:none}
.vxs-stage-gallery-bar{position:absolute;z-index:1;left:20px;right:20px;bottom:18px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.vxs-stage-scene-label{font:700 14px 'Syne',sans-serif;text-shadow:0 2px 8px #000}
.vxs-stage-gallery-controls{display:flex;align-items:center;gap:7px;padding:6px;border-radius:999px;background:#100d20b8}
.vxs-stage-gallery-controls button{width:36px;height:36px;padding:0;border:1px solid #fff8;border-radius:50%;background:#ffffff25;color:#fff;cursor:pointer;display:grid;place-items:center}
.vxs-stage-pause svg{fill:currentColor;display:block}
.vxs-stage-pause .vxs-ic-play,.vxs-stage-pause[aria-pressed="true"] .vxs-ic-pause{display:none}
.vxs-stage-pause[aria-pressed="true"] .vxs-ic-play{display:inline}
.vxs-stage-gallery-controls .vxs-stage-dot{width:20px;height:20px;min-height:20px;padding:0;border:1px solid #fff9;background:#ffffff63}
.vxs-stage-gallery-controls .vxs-stage-dot.is-active{background:#aeb8ff;border-color:#aeb8ff;box-shadow:0 0 0 3px #667eea55}
.vxs-stage-experiences{position:relative;isolation:isolate;padding:clamp(46px,5vw,75px) clamp(24px,5vw,78px) clamp(50px,6vw,86px);background:radial-gradient(ellipse at 0 4%,#eef0ff,transparent 50%),radial-gradient(ellipse at 100% 90%,#edb4ac,transparent 50%),linear-gradient(125deg,#dfe4fb,#e8eaf8 54%,#f2c8b8);color:#1c1626;overflow:hidden;scroll-margin-top:80px}
.vxs-stage-experiences::before{content:'';position:absolute;right:-180px;top:-290px;width:610px;height:610px;border:1px solid #ffffffb0;border-radius:50%;box-shadow:0 0 0 64px #ffffff20,0 0 0 135px #ffffff18;pointer-events:none}
.vxs-stage-section-head{position:relative;display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}
.vxs-stage-experiences .vxs-stage-eyebrow{color:#61345f}
.vxs-stage-section-head h2{font:800 clamp(30px,3vw,48px)/1.08 'Syne',sans-serif;letter-spacing:-.045em;margin:0;color:#171321}
.vxs-stage-section-head>p{max-width:260px;font-size:14px;line-height:1.5;color:#423449;margin:0}
.vxs-stage-path-grid{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.vxs-stage-path{position:relative;display:block;height:clamp(300px,30vw,395px);padding:0;border:1px solid #ffffff87;border-radius:20px;overflow:hidden;text-align:left;background:#1b1830;color:#fff;font-family:inherit;cursor:pointer;box-shadow:0 19px 38px #41324952;transition:transform .25s,box-shadow .25s}
.vxs-stage-path:hover{transform:translateY(-5px);box-shadow:0 24px 48px #34254180}
.vxs-stage-path[aria-expanded=true]{outline:3px solid #39264a;outline-offset:3px}
.vxs-stage-path img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(1.12) saturate(1.07);transition:transform .4s}
.vxs-stage-path:hover img{transform:scale(1.045)}
.vxs-stage-path-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0d0a1b0d 5%,#0d0a1b40 45%,#0c0a1dd9 100%)}
.vxs-stage-path-copy{position:absolute;bottom:24px;left:22px;right:22px;display:grid;gap:7px}
.vxs-stage-path-copy small{font:800 12px 'Syne',sans-serif;letter-spacing:.17em;color:#ffd0c4}
.vxs-stage-path-copy strong{font:800 clamp(25px,2.5vw,38px)/1.05 'Syne',sans-serif;color:#fff}
.vxs-stage-path-copy>span{font-size:13px;line-height:1.4;color:#f1eaf6}
.vxs-stage-path-arrow{position:absolute;right:19px;top:18px;font-size:22px;color:#fff;text-shadow:0 2px 8px #000}
.vxs-stage-destinations{position:relative;margin-top:20px;padding:22px;background:#171526;color:#f9f5ff;border-radius:18px;border:1px solid #ffffff80;box-shadow:0 22px 45px #39284342}
.vxs-stage-destinations[hidden],.vxs-stage-destination-set[hidden]{display:none!important}
.vxs-stage-destinations-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.vxs-stage-destinations-head h3{font:800 22px 'Syne',sans-serif;margin:0;color:#fff}
.vxs-stage-close{position:relative;width:40px;height:40px;padding:0;border:1px solid #ffffff80;border-radius:10px;background:#ffffff18;color:#fff;font-size:0;line-height:1;cursor:pointer}
.vxs-stage-close::before,.vxs-stage-close::after{content:'';position:absolute;left:50%;top:50%;width:18px;height:2px;background:currentColor;border-radius:2px;transform:translate(-50%,-50%) rotate(45deg)}
.vxs-stage-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.vxs-stage-destination-set{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vxs-stage-destination-set a{min-height:48px;padding:11px 14px;border:1px solid #ffffff35;border-radius:10px;background:#ffffff0c;color:#f7efff;display:flex;align-items:center;justify-content:space-between;gap:10px;text-decoration:none;font-size:14px}
.vxs-stage-destination-set a:hover{background:#667eea35;color:#fff}
.vxs-stage-connect-guide{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:16px;padding:14px 2px 0;border-top:1px solid #ffffff24;color:#d6d2e2;font-size:13px;line-height:1.5}
.vxs-stage-connect-guide>span{color:#a9a4b8;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.vxs-stage-connect-guide a{color:#e4d5ff;font-weight:700;text-underline-offset:3px}
.vxs-stage-connect-guide a:hover{color:#fff}
.vxs-stage-discovery{padding:54px clamp(24px,5vw,78px) 58px;background:radial-gradient(ellipse at 50% 100%,#233346,#151523 68%);color:#fff}
.vxs-stage-discovery-head{text-align:center;margin:0 auto 24px}
.vxs-stage-discovery-head h2{font:800 clamp(28px,3.4vw,44px) 'Syne',sans-serif;margin:0 0 9px;color:#fff}
.vxs-stage-discovery-head>p:last-child{color:#c8ccdb;font-size:15px;margin:0}
.vxs-stage-discovery .vhp-intro-panel{max-width:900px;margin:0 auto}
.vxs-stage-discovery .vhp-sp-trigger-sub{font-size:13px;white-space:normal;mask-image:none;-webkit-mask-image:none}
.vxs-stage-discovery .vhp-sp-trigger-label{font-size:16px}
.vxs-stage-discovery .vhp-sp-trigger-open{min-height:68px}
.vxs-stage-discovery .vhp-sp-section-label{font-size:13px}
.vxs-stage-discovery .vhp-sp-refine-toggle,.vxs-stage-discovery .vhp-sp-chip{min-height:42px;font-size:13px}
.vxs-stage-discovery .vhp-sp-clear{min-height:40px;font-size:12px}
#vibesxs-homepage-root .vhp-mood-section{--active-mood:#a987d4;position:relative;margin:0;padding:70px clamp(24px,5vw,78px);border:0;border-radius:0;background:radial-gradient(ellipse at 90% 14%,color-mix(in srgb,var(--active-mood) 22%,transparent),transparent 50%),#0c0b19;scroll-margin-top:70px;transition:background .3s}
#vibesxs-homepage-root .vhp-step-header{display:block;margin:0 0 14px}
#vibesxs-homepage-root .vhp-step-header .vhp-step-badge{margin:0}
#vibesxs-homepage-root .vhp-step-header .vhp-step-num,#vibesxs-homepage-root .vhp-step-header .vhp-step-line-h{display:none}
#vibesxs-homepage-root .vhp-step-header h2{font:800 clamp(30px,3.5vw,46px) 'Syne',sans-serif;margin:0 0 7px;color:#fff}
#vibesxs-homepage-root .vhp-description{margin:0;font-size:15px;color:#d7d2e1}
#vibesxs-homepage-root .vhp-mood-welcome{display:block;margin:0 0 24px;font-size:14px;color:#c9c4d8}
#vibesxs-homepage-root .vhp-mood-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;opacity:1;filter:none}
#vibesxs-homepage-root .vhp-mood-card{appearance:none;min-width:0;aspect-ratio:auto;min-height:180px;background:linear-gradient(145deg,color-mix(in srgb,var(--mood-edge) 16%,#111222),#171827)!important;border:1px solid color-mix(in srgb,var(--mood-edge) 60%,#ffffff30);box-shadow:inset 0 1px 0 #ffffff15,0 12px 25px #0004;color:#fff;animation:none}
#vibesxs-homepage-root .vhp-mood-card.selected{border:2px solid var(--mood-edge);box-shadow:0 0 0 2px #ffffff50,0 0 28px color-mix(in srgb,var(--mood-edge) 55%,transparent)}
#vibesxs-homepage-root .vhp-mood-card .vhp-mood-overlay{display:none}
#vibesxs-homepage-root .vhp-mood-card .vhp-mood-content{opacity:1!important}
#vibesxs-homepage-root .vhp-mood-card .vhp-mood-name{font-size:15px}
#vibesxs-homepage-root .vhp-mood-card .vhp-mood-desc{font-size:11px}
#vibesxs-homepage-root .vhp-mood-card:focus-visible,#vxs-experience-stage :focus-visible,.vxs-stage-discovery :focus-visible{outline:3px solid #dfe4ff;outline-offset:3px}
#vibesxs-homepage-root .vhp-action-section{margin:0;padding:0 clamp(24px,5vw,78px) 68px;background:#0c0b19;border:0;border-radius:0}
#vibesxs-homepage-root .vhp-action-section.vhp-mode-preview{display:none!important}
#vibesxs-homepage-root .vhp-action-section .vhp-step-badge{margin-bottom:16px}
#vibesxs-homepage-root .vhp-action-section .vhp-step-label{font-size:26px}
@media(max-width:1100px){#vibesxs-homepage-root .vhp-mood-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1000px){.vxs-stage-experiences::before{display:none}.vxs-stage-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vxs-stage-path{height:310px}.vxs-stage-destination-set{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.vxs-stage-hero{grid-template-columns:1fr;padding:42px 24px}.vxs-stage-gallery{height:360px}#vibesxs-homepage-root .vhp-mood-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.vxs-stage-hero{padding:32px 20px 26px;gap:26px;min-height:0}.vxs-stage-hero-copy h1{font-size:clamp(38px,10.5vw,56px)}.vxs-stage-intro{font-size:15px;line-height:1.5;margin-bottom:20px}.vxs-stage-gallery{height:260px;border-radius:18px}.vxs-stage-scene-label{font-size:12px}.vxs-stage-gallery-bar{left:12px;right:12px;bottom:10px;display:flex;flex-direction:column;align-items:stretch;gap:6px}.vxs-stage-gallery-controls{align-self:flex-end;gap:4px;padding:4px}.vxs-stage-gallery-controls .vxs-stage-dot{width:16px;height:16px;min-height:16px}.vxs-stage-gallery-controls button{width:32px;height:32px}.vxs-stage-experiences{padding:39px 18px 48px}.vxs-stage-section-head{display:block}.vxs-stage-section-head>p{margin-top:9px}.vxs-stage-path-grid{grid-template-columns:1fr;gap:10px}.vxs-stage-path{height:132px;display:block;border-radius:14px}.vxs-stage-path img{width:37%;object-position:center}.vxs-stage-path-shade{background:linear-gradient(90deg,#17132b00 0%,#17132bdc 36%,#17132b 58%)}.vxs-stage-path-copy{left:40%;right:33px;top:14px;bottom:12px;gap:2px}.vxs-stage-path-copy strong{font-size:19px}.vxs-stage-path-copy>span{font-size:11px;line-height:1.25}.vxs-stage-path-arrow{right:12px;top:10px;font-size:17px}.vxs-stage-destination-set{grid-template-columns:1fr}.vxs-stage-discovery{padding:42px 18px}.vxs-stage-discovery .vhp-sp-trigger-open{min-height:64px;padding:11px}.vxs-stage-discovery .vhp-sp-trigger-sub{font-size:12px}#vibesxs-homepage-root .vhp-mood-section{padding:46px 18px}#vibesxs-homepage-root .vhp-mood-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}#vibesxs-homepage-root .vhp-mood-card{min-height:154px;padding:12px 8px}#vibesxs-homepage-root .vhp-action-section{padding:0 18px 50px}}
@media(max-width:600px){.vxs-stage-destinations{padding:18px}.vxs-stage-destinations-head{gap:8px}.vxs-stage-destinations-head h3{min-width:0;font-size:18px}.vxs-stage-close{flex:0 0 40px}}
.vxs-stage-primary>span[aria-hidden],.vxs-stage-path-arrow,.vxs-stage-destination-set a>span:last-child{display:inline-block;width:18px;height:18px;flex:0 0 18px;font-size:0;line-height:0;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19 19 5M8 5h11v11'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19 19 5M8 5h11v11'/%3E%3C/svg%3E") center/contain no-repeat}
.vxs-stage-destination-set .vxs-stage-app-name{display:inline-flex;align-items:center;gap:10px;min-width:0}
.vxs-stage-destination-set .vxs-stage-app-icon{display:inline-grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border:1px solid #aeb8ff66;border-radius:8px;background:#aeb8ff1c;font:17px/1 system-ui,'Apple Color Emoji','Segoe UI Emoji',sans-serif}
.vxs-stage-destination-set .vxs-stage-app-icon--games span{background:linear-gradient(135deg,#7f96f5,#a274dc);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#8f9df0;font:800 18px/.95 'Syne',sans-serif}
.vxs-stage-secondary>span[aria-hidden]{display:inline-block;width:18px;height:18px;flex:0 0 18px;font-size:0;line-height:0;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v16m-7-7 7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v16m-7-7 7 7 7-7'/%3E%3C/svg%3E") center/contain no-repeat}
@media(prefers-reduced-motion:reduce){.vxs-stage-scene,.vxs-stage-path,.vxs-stage-path img,#vibesxs-homepage-root .vhp-mood-section{transition:none!important}#vibesxs-homepage-root .vhp-mood-card{animation:none!important}}
.vxs-stage-hero-copy{container-type:inline-size}
@supports (width:1cqw){#vxs-stage-title{font-size:clamp(42px,min(5.4vw,14cqw),82px)}.vxs-stage-path-copy{container-type:inline-size}.vxs-stage-path-copy strong{font-size:clamp(22px,min(2.5vw,13.5cqw),38px)}}