
html{--xw-gold:#D9B65F;--xw-gold-hi:#F2D98F;--xw-gold-lo:#8A6A22;--xw-navy:#060B1E}
#xw{order:-10;position:relative;margin:0 0 18px;display:flex;flex-direction:column;gap:14px}
.xw-world{position:relative;height:min(calc(100vh - 330px),620px);min-height:380px;border-radius:24px;overflow:hidden;background:radial-gradient(120% 80% at 50% 10%,#1B2B5C 0,#0A1430 55%,#040816 100%);isolation:isolate;contain:layout paint;border:1px solid rgba(217,182,95,.35);box-shadow:0 20px 50px rgba(0,0,0,.5)}
.xw-pan{position:absolute;inset:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;display:flex;align-items:center}
.xw-pan::-webkit-scrollbar{display:none}
.xw-stage{position:relative;flex:none;width:max(100%,calc(var(--xw-h,620px)*16/9));aspect-ratio:16/9;overflow:hidden;will-change:transform}
.xw-art,.xw-fg{position:absolute;inset:0;background:center/cover no-repeat;opacity:0;transition:opacity .7s ease}
.xw-fg{inset:-2%;pointer-events:none;will-change:transform}
#xw.xw-lit .xw-art,#xw.xw-fg-on .xw-fg,#xw-guest.xw-lit .xw-art,#xw-guest.xw-fg-on .xw-fg{opacity:1}

.xw-art{opacity:1;transition:none;background-image:url(/assets/console/world/astra-e64bb884-lqip-480.webp)}
.xw-stars{position:absolute;inset:-5% -10% 40% -10%;background-image:radial-gradient(1.2px 1.2px at 10% 20%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 30% 60%,#fff 50%,transparent 51%),radial-gradient(1.4px 1.4px at 55% 15%,#FFE7A8 50%,transparent 51%),radial-gradient(1px 1px at 75% 40%,#fff 50%,transparent 51%),radial-gradient(1.2px 1.2px at 90% 10%,#fff 50%,transparent 51%);background-size:220px 160px;opacity:.55;animation:xwTw 6s ease-in-out infinite alternate;pointer-events:none;will-change:transform}
@keyframes xwTw{to{opacity:.25}}
.xw-motes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.xw-hint{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);margin:0;padding:4px 12px;border-radius:999px;font-size:12px;color:#E8D9AE;background:rgba(4,8,22,.6);pointer-events:none;white-space:nowrap;animation:xwHint 5s ease 1.2s forwards;z-index:2}
@keyframes xwHint{0%,70%{opacity:1}100%{opacity:0}}
.xw-top{position:absolute;top:10px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;z-index:2;pointer-events:none}
.xw-top>*{pointer-events:auto}
.xw-title{margin:0;padding:4px 12px;border-radius:999px;background:rgba(4,8,22,.6);border:1px solid rgba(217,182,95,.4);color:var(--xw-gold-hi);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.xw-sound{width:44px;height:44px;border-radius:50%;border:1px solid rgba(217,182,95,.45);background:rgba(6,10,26,.72);color:#F2D98F;display:flex;align-items:center;justify-content:center}
#xw.xw-flying .xw-pill,#xw.xw-flying .xw-top{opacity:0;transition:opacity .15s}

.xw-console{position:relative;display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:center;padding:14px;border-radius:20px;border:1px solid rgba(217,182,95,.45);background:radial-gradient(90% 120% at 0 0,rgba(242,217,143,.14),transparent 60%),linear-gradient(180deg,#0B1533,#050916);box-shadow:inset 0 1px 0 rgba(242,217,143,.15),0 14px 34px rgba(0,0,0,.45)}
.xw-hero{display:flex;flex-direction:column;align-items:center;gap:6px;perspective:700px}
.xw-hero-card{position:relative;width:100%;aspect-ratio:5/7;padding:0;border-radius:9px;overflow:hidden;border:2px solid var(--xw-gold);background:#0A1430;box-shadow:0 0 0 1px #000,0 12px 26px rgba(0,0,0,.6),0 0 26px rgba(242,217,143,.3);transform:rotateY(-10deg) rotateX(4deg);animation:xwFloat 5s ease-in-out infinite;color:#FFF3D0}
.xw-hero-card img{width:100%;height:100%;object-fit:cover}
.xw-hero-card b{position:absolute;left:4px;right:4px;bottom:4px;padding:2px 4px;border-radius:5px;background:rgba(4,8,22,.85);font-size:10px;line-height:1.2}
.xw-shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,240,200,.38) 48%,transparent 62%);background-size:260% 100%;mix-blend-mode:screen;animation:rdFoil 4.5s ease-in-out infinite;pointer-events:none}
@keyframes xwFloat{50%{transform:rotateY(-4deg) rotateX(2deg) translateY(-4px)}}
.xw-cap{margin:0;font-size:10px;font-weight:600;color:#E9DBB2;text-align:center;line-height:1.25}
.xw-bars{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.xw-bar{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;border-radius:10px;border:1px solid rgba(217,182,95,.75);background:linear-gradient(180deg,rgba(18,28,58,.92),rgba(6,10,26,.96));color:#F6E7BC;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(242,217,143,.2),0 6px 16px rgba(0,0,0,.4);animation:xwIn .4s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*40ms);transition:scale .12s,box-shadow .2s}
.xw-bar svg{width:22px;height:22px;flex:none;color:var(--xw-gold-hi)}
.xw-bar span{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xw-bar i{font-style:normal;font-size:8px;color:var(--xw-gold)}
.xw-bar:hover{box-shadow:inset 0 1px 0 rgba(242,217,143,.3),0 0 20px rgba(242,217,143,.3)}
.xw-bar:active{scale:.97}
.xw-sound:focus-visible,.xw-bar:focus-visible,.xw-hero-card:focus-visible{outline:3px solid var(--xw-gold-hi);outline-offset:2px}
@keyframes xwIn{from{opacity:0;transform:translateY(8px)}}

html[data-xw] #screen-dashboard #rd-home .rd-hero,html[data-xw] #screen-dashboard #rd-home .rd-actions{display:none}

#xw-soon{position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(60% 50% at 50% 45%,rgba(30,50,110,.55),rgba(2,4,12,.88));opacity:0;transition:opacity .22s ease}
#xw-soon.xw-in{opacity:1}
.xw-soon-card{width:min(420px,100%);padding:30px 24px 22px;border-radius:22px;text-align:center;border:1px solid var(--xw-gold);background:linear-gradient(180deg,#0E1A3E,#050916);box-shadow:0 0 0 1px #000,0 30px 70px rgba(0,0,0,.7),0 0 60px rgba(242,217,143,.18);transform:translateY(14px) scale(.97);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
#xw-soon.xw-in .xw-soon-card{transform:none}
.xw-soon-glow{width:72px;height:72px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--xw-gold);background:radial-gradient(circle,rgba(242,217,143,.35),rgba(217,182,95,.05) 70%);box-shadow:0 0 40px rgba(242,217,143,.35)}
.xw-soon-glow svg{width:34px;height:34px;color:var(--xw-gold-hi)}
.xw-soon-k{margin:0;font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--xw-gold)}
#xw-soon h2{margin:6px 0 8px;font-size:26px;font-weight:800;color:#FFF3D0}
.xw-soon-p{margin:0 0 18px;font-size:14px;line-height:1.5;color:#C9BFA2}
.xw-soon-x{min-height:46px;padding:0 22px;border-radius:999px;border:1px solid var(--xw-gold);background:linear-gradient(180deg,#F2D98F,#C9A24A 55%,#8A6A22);color:#1A1204;font-weight:800}

html.rd .screen:not(#screen-dashboard) .card-base{border-color:rgba(217,182,95,.28)!important;box-shadow:inset 0 1px 0 rgba(242,217,143,.12),0 14px 34px rgba(0,0,0,.4)}

.xw-cb{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 0 22px;perspective:1100px}
.xw-cb-card{width:min(62vw,250px);aspect-ratio:5/7;padding:0;border:0;background:none;border-radius:14px}
.xw-cb-in{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.1,.2,1)}
.xw-cb-card.xw-flip .xw-cb-in{transform:rotateY(180deg)}
.xw-cb-in img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 20px 44px rgba(0,0,0,.6),0 0 30px rgba(217,182,95,.25)}
.xw-cb-f{transform:rotateY(180deg)}
.xw-cb-in picture{display:contents}

.xw-cb-f{opacity:0;transition:opacity 0s .3s}.xw-cb-b img,.xw-cb-in>img.xw-cb-b{opacity:1;transition:opacity 0s .3s}.xw-cb-card.xw-flip .xw-cb-f{opacity:1}.xw-cb-card.xw-flip .xw-cb-b img{opacity:0}
.xw-cb-in img{border-radius:4.8%/3.4%;box-shadow:0 1.5px 0 #2a2a33,0 3px 0 #15151c,0 20px 44px rgba(0,0,0,.6),0 0 30px rgba(217,182,95,.25)}
.xw-cb-card::after{content:"";position:absolute;inset:0;border-radius:4.8%/3.4%;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);background-size:300% 100%;background-position:120% 0;transition:background-position .9s ease-out}
.xw-cb-card{position:relative}.xw-cb-card:hover::after,.xw-cb-card.xw-flip::after{background-position:-60% 0}
.xw-cb-cap{margin:0;font-size:12px;color:#C9B98C}

@media (max-width:899px){
#xw{margin:0 -16px 18px;gap:12px}
.xw-world{height:auto;min-height:0;border-radius:0 0 22px 22px;border-width:0 0 1px}
.xw-pan{position:relative;inset:auto;padding:54px 0 34px}
.xw-stage{width:max(100%,150vw)}
.xw-console{margin:0 16px;grid-template-columns:78px 1fr;gap:10px;padding:12px}
.xw-bar{min-height:46px;font-size:12px;letter-spacing:.06em;padding:0 10px;gap:8px}
}
@media (min-width:900px){.xw-world{--xw-h:620px}.xw-console{grid-template-columns:120px 1fr}.xw-bars{grid-template-columns:repeat(3,1fr)}.xw-hint{display:none}}
@media (prefers-reduced-motion:reduce){.xw-stars,.xw-hero-card,.xw-shine,.xw-bar,.xw-hint{animation:none!important}.xw-art,.xw-fg,.xw-cb-in,#xw-soon,.xw-soon-card{transition:none}.xw-motes{display:none}}
@media (max-width:899px){
}
#xw .xw-pill svg,#xw .xw-bar svg,#xw-soon .xw-soon-glow svg{color:#FFE2A0!important;stroke:currentColor}

#xw-guest{width:100%;max-width:1000px;flex:none;display:flex;flex-direction:column;gap:12px;margin:0 0 18px}
#xw-guest .xw-pill svg,#xw-guest .xw-bar svg{color:#FFE2A0!important}
.xw-gconsole{grid-template-columns:78px 1fr}
.xw-join{border-color:var(--xw-gold-hi);background:linear-gradient(180deg,#F2D98F,#C9A24A 55%,#8A6A22);color:#1A1204}
.xw-join svg{color:#1A1204!important}
.xw-gmsg{margin:0;min-height:1.2em;text-align:center;font-size:13px;color:#F2D98F}
@media (max-width:899px){#xw-guest{width:calc(100% + 40px);margin:-20px -20px 16px}#xw-guest .xw-gconsole{margin:0 16px}}

@media (max-width:899px){
.xw-stage{width:100%}
.xw-pan{overflow-x:hidden;padding:46px 0 22px}
.xw-hint{display:none}
}
@media (max-width:420px){
.xw-console{grid-template-columns:64px 1fr;gap:8px;padding:10px}
.xw-bars{gap:6px}
.xw-bar{font-size:11px;letter-spacing:.03em;padding:0 8px;gap:6px}
}


#xw-guest-ph{width:100%;max-width:1000px;flex:none;display:flex;flex-direction:column;gap:12px;margin:0 0 18px;pointer-events:none}
#xw-guest-ph .xw-ph-console{height:180px}
#xw-guest-ph .xw-ph-msg{height:16px}
html:not(.rd) #xw-guest-ph{display:none}
@media (max-width:899px){#xw-guest-ph{width:calc(100% + 40px);margin:-20px -20px 16px}#xw-guest-ph .xw-ph-console{height:166px;margin:0 16px}}

.xw-soon-tag{display:inline-block;vertical-align:middle;margin-left:6px;padding:1px 6px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.06em;line-height:1.5;color:#1A1204;background:var(--xw-gold,#D9B65F);font-family:inherit}

.xw-world{display:flex;flex-direction:column}
.xw-nodes{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:14px 8px;padding:14px 12px 16px;background:linear-gradient(180deg,rgba(4,8,22,0),rgba(4,8,22,.86) 28%,rgba(4,8,22,.94));z-index:1}
.xw-nodes::before{content:"";position:absolute;left:16.6%;right:16.6%;top:40px;height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(242,217,143,.15),rgba(242,217,143,.85),rgba(242,217,143,.15));box-shadow:0 0 12px rgba(242,217,143,.55);pointer-events:none}
.xw-nodes::after{content:"";position:absolute;left:16.6%;right:16.6%;top:calc(40px + 96px);height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(242,217,143,.15),rgba(242,217,143,.7),rgba(242,217,143,.15));box-shadow:0 0 12px rgba(242,217,143,.45);pointer-events:none}
.xw-node{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-height:82px;min-width:44px;padding:2px 2px 4px;border:0;background:none;color:#F6E7BC;font-weight:700;font-size:12.5px;line-height:1.2;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.xw-orb{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;border:1px solid rgba(242,217,143,.8);background:radial-gradient(circle at 50% 35%,rgba(242,217,143,.38),rgba(18,28,58,.96) 62%);box-shadow:0 0 0 4px rgba(4,8,22,.9),0 0 22px rgba(242,217,143,.35);animation:xwNode 4.8s ease-in-out calc(var(--i,0)*.4s) infinite}
.xw-orb svg{width:24px;height:24px;color:#FFE2A0!important;stroke:currentColor}
.xw-nl{max-width:100%;overflow-wrap:anywhere}
@keyframes xwNode{0%,100%{box-shadow:0 0 0 4px rgba(4,8,22,.9),0 0 16px rgba(242,217,143,.25)}50%{box-shadow:0 0 0 4px rgba(4,8,22,.9),0 0 30px rgba(242,217,143,.6)}}
.xw-node:hover .xw-orb,.xw-node:focus-visible .xw-orb{border-color:#FFE7A8;box-shadow:0 0 0 4px rgba(4,8,22,.9),0 0 34px rgba(242,217,143,.75)}
.xw-node:focus-visible{outline:3px solid var(--xw-gold-hi);outline-offset:2px;border-radius:12px}
.xw-node:active .xw-orb{scale:.94}
.xw-top{z-index:3}
@media (min-width:900px){.xw-nodes{grid-template-columns:repeat(6,1fr);padding:16px 18px 20px}.xw-nodes::before{left:8.3%;right:8.3%}.xw-nodes::after{display:none}.xw-pan{position:relative;inset:auto;flex:1;min-height:0}.xw-world{height:auto;min-height:0}.xw-stage{width:100%}}

.xw-console{grid-template-columns:88px 1fr!important;align-items:start}
.xw-bars{grid-template-columns:1fr 1fr!important}
.xw-primary{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;border-radius:12px;border:1px solid var(--xw-gold-hi);background:linear-gradient(180deg,#F2D98F,#C9A24A 55%,#8A6A22);color:#1A1204;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.xw-primary svg{width:20px;height:20px;color:#1A1204!important;stroke:currentColor}
.xw-primary:focus-visible{outline:3px solid #FFE7A8;outline-offset:2px}
.xw-hero{display:flex;flex-direction:column;align-items:center;gap:6px}
.xw-hero-card.xw-empty,.xw-hero-card.xw-noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px;border-style:dashed;background:radial-gradient(circle at 50% 30%,rgba(242,217,143,.16),#0A1430 70%);color:#F2D98F;cursor:pointer}
.xw-hero-card.xw-empty svg,.xw-hero-card.xw-noimg svg{width:26px;height:26px;color:#FFE2A0!important;stroke:currentColor}
.xw-hero-card.xw-empty b,.xw-hero-card.xw-noimg b{position:static;background:none;padding:0;font-size:11px;line-height:1.25;text-align:center;color:#F6E7BC}
.xw-noimg{border-style:solid!important}
.xw-cap{margin:0;font-size:11px;color:#C9B98C;text-align:center}
@media (min-width:900px){.xw-console{grid-template-columns:120px 1fr!important}.xw-bars{grid-template-columns:repeat(4,1fr)!important}}
@media (max-width:420px){.xw-console{grid-template-columns:76px 1fr!important}.xw-node{font-size:12px}}
@media (prefers-reduced-motion:reduce){.xw-orb{animation:none!important}.xw-node:active .xw-orb{scale:1}}
#xw .xw-bar,#xw-guest .xw-bar{min-height:48px;height:auto}
#xw .xw-primary,#xw-guest .xw-primary{min-height:50px}
@media (min-width:900px){#xw .xw-bars,#xw-guest .xw-bars{grid-template-columns:1fr 1fr!important}}
#main-app-r5s3 #xw .xw-bar,#xw-guest .xw-bar{min-height:48px}
#main-app-r5s3 #xw .xw-primary,#xw-guest .xw-primary{min-height:50px}
#main-app-r5s3 #xw .xw-node,#xw-guest .xw-node{min-height:82px}

#xw .xw-bar,#xw-guest .xw-bar{min-height:48px!important}
#xw .xw-primary,#xw-guest .xw-primary{min-height:50px!important}
#xw .xw-node,#xw-guest .xw-node{min-height:82px!important}


#xp-si.xw-fab-away:not(.on){opacity:0!important;pointer-events:none!important;transition:opacity .18s ease}
@media (prefers-reduced-motion: reduce){#xp-si,#xp-si.xw-fab-away{transition:none!important}}


.xw-orb{animation:none!important}.xw-hero-card{animation:none!important;transform:none!important}.xw-fg,.xw-motes{display:none!important}

.xw-nodes{margin-top:-58px;padding:0 12px 14px!important;gap:8px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;background:linear-gradient(180deg,rgba(4,8,22,0),rgba(4,8,22,.78) 38%,rgba(4,8,22,.94))!important;z-index:2}
.xw-nodes::before,.xw-nodes::after{display:none!important}
#xw .xw-node,#xw-guest .xw-node,.xw-node{flex-direction:row!important;align-items:center;justify-content:flex-start;gap:7px!important;min-height:46px!important;padding:4px 8px!important;border-radius:10px;border:1px solid rgba(217,182,95,.75);background:linear-gradient(180deg,rgba(18,28,58,.94),rgba(6,10,26,.97));box-shadow:inset 0 1px 0 rgba(242,217,143,.2),0 6px 16px rgba(0,0,0,.4);font-size:12px!important;font-weight:700;line-height:1.15;text-align:left}
.xw-orb{width:auto!important;height:auto!important;border:0!important;background:none!important;box-shadow:none!important;flex:none}
.xw-orb svg{width:20px!important;height:20px!important}
.xw-node:hover .xw-orb,.xw-node:focus-visible .xw-orb{box-shadow:none!important}
.xw-node:hover{box-shadow:inset 0 1px 0 rgba(242,217,143,.3),0 0 16px rgba(242,217,143,.25)}
.xw-node:active{scale:.97}
.xw-nl{min-width:0}
@media (min-width:900px){.xw-nodes{grid-template-columns:repeat(6,minmax(0,1fr))!important;margin-top:-64px;padding:0 18px 18px!important}}
