:root{color-scheme:light dark}.ak-world-page{max-width:1200px;margin:auto;padding:clamp(16px,3vw,32px);font-family:var(--ns-font-sans,Arial,sans-serif);color:var(--ns-text,#172033);background:var(--ns-surface,#fff);min-height:100vh}.ak-world-page header{max-width:680px}.ak-world-page h1{margin:.25rem 0;text-transform:capitalize}.ak-world-kicker{color:var(--ns-accent,#6750a4);font-weight:700;margin:0}.ak-world-stage{position:relative;min-height:520px;border:1px solid var(--ns-border,#d7dce5);border-radius:20px;overflow:hidden;box-shadow:var(--ns-elevation-2,0 10px 30px #0002)}.ak-world-stage canvas{display:block;width:100%;height:100%;touch-action:none}.ak-world-cast{margin:10px 0 0;color:var(--ns-text-muted,#596579);font-size:.9rem}.ak-world-page output{display:block;padding:12px 0;min-height:48px}.ak-world-page alive-agent{position:absolute;right:clamp(18px,4vw,48px);bottom:clamp(20px,4vw,44px);width:140px;height:210px;pointer-events:none}.ak-world-joystick{display:none}@media(min-width:601px){.ak-world-page[data-room="store-aisle"]{display:grid;grid-template-columns:minmax(0,1fr)}.ak-world-page[data-room="store-aisle"] header{grid-row:1}.ak-world-page[data-room="store-aisle"] .ak-world-stage{grid-row:2;grid-column:1}.ak-world-page[data-room="store-aisle"] #world-host{grid-row:2;grid-column:1;position:relative;inset:auto;align-self:end;justify-self:end;margin:0 clamp(18px,4vw,48px) clamp(20px,4vw,44px) 0;z-index:1}.ak-world-page[data-room="store-aisle"] #world-host>.ak-face{bottom:0}.ak-world-page[data-room="store-aisle"] #world-host>.ak-caption{left:auto;right:0;bottom:calc(100% + 8px);width:max-content;max-width:min(320px,calc(100vw - 96px));min-height:0;max-height:none;box-sizing:border-box;padding:6px 12px;border-radius:12px;text-align:left;overflow-wrap:anywhere;background:rgba(32,33,36,.88);color:#fff}}@media(max-width:600px){.ak-world-page{padding:12px}.ak-world-stage{min-height:62vh;border-radius:14px}.ak-world-cast{font-size:.82rem}.ak-world-page alive-agent{width:100px;height:160px}.ak-world-joystick{display:grid;place-items:center;position:fixed;left:24px;bottom:24px;width:92px;height:92px;border:1px solid var(--ns-border,#d7dce5);border-radius:50%;background:color-mix(in srgb,var(--ns-surface,#fff) 82%,transparent);z-index:3}.ak-world-joystick span{width:38px;height:38px;border-radius:50%;background:var(--ns-accent,#6750a4)}}@media(max-width:480px){.ak-world-page[data-room="store-aisle"]{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}.ak-world-page[data-room="store-aisle"] header{grid-row:1}.ak-world-page[data-room="store-aisle"] .ak-world-stage{grid-row:2}.ak-world-page[data-room="store-aisle"] output{grid-row:3;padding:0}.ak-world-page[data-room="store-aisle"] #world-host{grid-row:4;position:relative;inset:auto;display:block;justify-self:end;width:min(220px,100%);height:180px;pointer-events:none}.ak-world-page[data-room="store-aisle"] #world-store-details{grid-row:5;min-width:0;padding-top:0}.ak-world-page[data-room="store-aisle"] .ns-product-sticky{box-sizing:border-box;width:100%;max-width:100%;min-width:0;bottom:calc(env(safe-area-inset-bottom,0px) + 12px)}.ak-world-page[data-room="store-aisle"] .ns-product-sticky span{flex:1 1 160px;min-width:0;overflow-wrap:anywhere}.ak-world-page[data-room="store-aisle"] .ns-product-sticky .ns-product-quote{min-height:44px;max-width:100%}}@media(max-width:600px){.ak-world-page[data-room="store-aisle"] .ns-product-sticky{z-index:4}}@media(prefers-reduced-motion:reduce){.ak-world-stage canvas{scroll-behavior:auto}}
/* Line 21791: the booth's printed free ticket on the HD stage; tapping it is the visitor's yes to walking in with the host. */
.ak-world-ticket{position:absolute;left:16px;top:16px;z-index:2;display:grid;gap:2px;min-height:44px;min-width:132px;max-width:calc(100% - 32px);padding:10px 16px;border:2px dashed #b4532a;border-radius:10px;background:#fbf3df;color:#2a1f1a;font:inherit;text-align:left;cursor:pointer;box-shadow:0 6px 18px #0004;animation:ak-world-ticket-in .5s ease-out}.ak-world-ticket__admit{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#7a3d1f}.ak-world-ticket__title{font-size:1.05rem}.ak-world-ticket.is-following{outline:3px solid var(--ns-accent,#6750a4);outline-offset:2px}.ak-world-ticket:focus-visible{outline:3px solid var(--ns-accent,#6750a4);outline-offset:2px}@keyframes ak-world-ticket-in{from{transform:translateY(-12px) rotate(-4deg);opacity:0}to{transform:none;opacity:1}}@media(prefers-reduced-motion:reduce){.ak-world-ticket{animation:none}}
/* Public world visitors use the same host's hover/tap menu to return to their admitted customer site.
   The world overlay remains inert outside the host's existing face and controls. */
.ak-world-page[data-public-world] #world-host > :is(.ak-face,.ak-menu,.ak-show){pointer-events:auto}
.ak-world-page[data-public-world] #world-host[data-ak-reveal] > .ak-menu-btn,
.ak-world-page[data-public-world] #world-host > .ak-menu-btn[aria-expanded="true"]{pointer-events:auto}
@media(hover:hover){.ak-world-page[data-public-world] #world-host:is(:hover,:focus-within) > .ak-menu-btn{pointer-events:auto}}
/* An HD room already draws this host in the world. Keep the corner shell's space, caption and one menu, but not a second face. */
.ak-world-page[data-host-in-world="1"] #world-host > .ak-face{visibility:hidden}

/* The Giving Agents host owns the room's one visible caption. World progress remains announced to assistive technology. */
.ak-world-page[data-room="giving-agents-event-room"] .ak-world-status--sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* This room opts into the house token plane; no other world changes theme. */
@media(prefers-color-scheme:dark){
    .ak-world-page[data-room="giving-agents-event-room"]{color-scheme:dark;color:var(--ns-text);background:var(--ns-bg)}
    .ak-world-page[data-room="giving-agents-event-room"] :is(.ak-world-stage,.ak-world-cast){color:var(--ns-text-2);background:var(--ns-surface);border-color:var(--ns-border)}
    .ak-world-page[data-room="giving-agents-event-room"] :is(h1,h2,strong){color:var(--ns-text)}
    .ak-world-page[data-room="giving-agents-event-room"] a{color:var(--ns-gold-light)}
}

/* Line 27338 (fix forward OA-HIY at /agent/{slug}/world/pool-deck): the greeting was printed twice (the status line under the stage
   and the host's corner caption), and on a phone the round thumb control sat on both. As the office room already does, the host's
   one caption is the visible line and room progress stays announced to assistive technology. On a phone the host's face and
   caption stand in the flow under the stage, right of the thumb control, and the page keeps room at its foot for that control.
   Rooms with their own layout (store aisle, office, Giving Agents) keep it. */
.ak-world-page:not([data-room="store-aisle"]):not([data-room="office"]):not([data-room="giving-agents-event-room"]) #world-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Line 28828 (live check 10131813, "no talk control on phone"): her face and caption are placed absolutely inside the shell, so
   width:auto shrank it to 0 px in the stage's grid cell and in the fixed page corner; the phone shell keeps a fixed width.
   Line 29109 (live check 10140639, "host faint dots on phone"): at 100 px the kit took the shell for tiny (alive-kit.js TINY,
   140 px) and drew her as 8 px letters, faint dots on the dark hall; at 140 px she wears the same drawn face as on a desktop. */
@media(max-width:600px){
    .ak-world-page:not([data-room="store-aisle"]):not([data-room="office"]):not([data-room="giving-agents-event-room"]){padding-bottom:132px}
    .ak-world-page:not([data-room="store-aisle"]):not([data-room="office"]):not([data-room="giving-agents-event-room"]) #world-host{position:relative;inset:auto;display:block;width:140px;max-width:none;aspect-ratio:auto;height:190px;margin:8px 0 0 106px}
    .ak-world-page:not([data-room="store-aisle"]):not([data-room="office"]):not([data-room="giving-agents-event-room"]) .ak-world-stage{min-height:56vh}
}
/* The lit room handoff starts from the same visible page corner at every viewport size. */
.ak-world-page[data-host-walk-between="on"] #world-host{position:fixed!important;inset:auto 16px 24px auto!important;margin:0!important;z-index:5}
.ak-world-page[data-host-walk-between="on"] #world-host > :is(.ak-face,.ak-menu,.ak-menu-btn,.ak-show){pointer-events:auto}

/* Line 27572 (fix forward of OA-MA03 at /agent/{slug}/world/theater-hall): the corner host and the thumb control share the
   stage's own grid cell (the store aisle's rule), so her caption speaks on the stage above her face instead of a 100 px
   column squeezed over the room status, and the thumb control rides the stage's corner instead of covering the cast line. */
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]){display:grid;grid-template-columns:minmax(0,1fr);align-content:start}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) header{grid-row:1}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) .ak-world-stage{grid-row:2;grid-column:1}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) #world-host{grid-row:2;grid-column:1;position:relative;inset:auto;align-self:end;justify-self:end;margin:0 clamp(12px,3vw,40px) clamp(12px,3vw,36px) 0;z-index:1}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) #world-host>.ak-face{bottom:0}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) #world-host>.ak-caption{left:auto;right:0;bottom:calc(100% + 8px);width:max-content;max-width:min(320px,calc(100vw - 72px));min-height:0;max-height:none;box-sizing:border-box;padding:6px 12px;border-radius:12px;text-align:left;overflow-wrap:anywhere;background:rgba(32,33,36,.88);color:#fff}
/* An HD room hides the corner face (she is drawn in the room), so her caption takes the corner itself. */
.ak-world-page[data-host-in-world="1"]:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) #world-host>.ak-caption{bottom:0}
.ak-world-page:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"]) .ak-world-joystick{grid-row:2;grid-column:1;position:relative;left:auto;bottom:auto;align-self:end;justify-self:start;margin:0 0 12px 12px}

/* Line 28682 (live check 10131251 at /agent/{slug}/world/theater-hall and /store-aisle): with the host's walk between page and
   room lit, her shell stayed pinned to the viewport corner (the fixed rule above) even while she stood in the room, so on a phone
   her caption hung below the stage (hall) or ran off it as bare grey text (aisle), and the aisle's thumb control sat fixed over
   the status line. While she is in the room (data-host-in-world) her shell rides the stage's own grid cell with her caption as
   one bubble in the stage corner; the moment she walks out (world-stage.js show(false) drops the mark) the page corner is hers. */
.ak-world-page[data-host-walk-between="on"][data-host-in-world="1"]:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"],[data-room="store-aisle"]) #world-host{position:relative!important;inset:auto!important;translate:none!important;grid-row:2;grid-column:1;align-self:end;justify-self:end;margin:0 12px 12px 0!important;z-index:2}
.ak-world-page[data-host-walk-between="on"][data-host-in-world="1"]:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"],[data-room="store-aisle"]) #world-host>.ak-caption{left:auto;right:0;bottom:0;width:max-content;max-width:min(320px,calc(100vw - 72px));min-height:0;max-height:none;box-sizing:border-box;padding:6px 12px;border-radius:12px;text-align:left;overflow-wrap:anywhere;background:rgba(32,33,36,.88);color:#fff}
@media(max-width:600px){
    .ak-world-page[data-room="store-aisle"]{display:grid;grid-template-columns:minmax(0,1fr)}
    .ak-world-page[data-room="store-aisle"] header{grid-row:1}
    .ak-world-page[data-room="store-aisle"] .ak-world-stage{grid-row:2;grid-column:1}
    .ak-world-page[data-room="store-aisle"] .ak-world-joystick{grid-row:2;grid-column:1;position:relative;left:auto;bottom:auto;align-self:end;justify-self:start;margin:0 0 12px 12px}
    /* On a phone her caption sits just above the thumb control (92 px + its 12 px margin) in the stage's lower corner. */
    .ak-world-page[data-host-walk-between="on"][data-host-in-world="1"]:is([data-room="theater-hall"],[data-room="theater-lobby"],[data-room="pool-deck"],[data-room="store-aisle"]) #world-host{margin:0 12px 116px 0!important}
}

/* Line 28828 (live check 10131813, blank white stage): with no working WebGL context the lobby wears its drawn tier
   (world-stage.js showDrawnRoom); each ready door on its marquee is a real link, its title read from the hidden span. */
.ak-world-door-link{position:absolute;z-index:1;display:block;border-radius:10px;outline-offset:2px}
.ak-world-door-link:hover{background:color-mix(in srgb,var(--ns-accent,#6750a4) 14%,transparent)}
.ak-world-door-link:focus-visible{outline:3px solid var(--ns-accent,#6750a4)}
.ak-world-door-link>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* Line 29275 (live check 10141919 at /agent/{slug}/world/store-aisle, "caption covers product price"): the aisle's price cards
   hang on the shelves at 1.15 m (world-store.js), below the 1.7 m eye line, so in every view they sit under the horizon. In the
   aisle her caption rides the stage's top band (sky and wall tops), never the shelf line where the prices are. */
.ak-world-page[data-host-walk-between="on"][data-host-in-world="1"][data-room="store-aisle"] #world-host{align-self:start;margin:12px 12px 0 0!important}
.ak-world-page[data-host-walk-between="on"][data-host-in-world="1"][data-room="store-aisle"] #world-host>.ak-caption{top:0;bottom:auto}
