:root{--blue:#1652ff;--ink:#12244a;--muted:#6c7995}*{box-sizing:border-box}body{margin:0;background:#edf2fe;color:var(--ink);font:14px -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;overflow:hidden}button,a,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #f58bff;outline-offset:3px}canvas{display:block;position:fixed;inset:0;touch-action:none}header{position:absolute;top:0;left:0;right:0;height:95px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;z-index:2;background:linear-gradient(#f7f9ffed,#f7f9ff00)}.brand{font-size:28px;font-weight:800;letter-spacing:-1.2px;color:var(--blue)}.brand span{display:block;font:9px monospace;letter-spacing:2.5px;color:var(--muted);margin:6px 0 0 27px}header nav{display:flex;gap:25px;align-items:center}header nav button{background:none;border:0;color:var(--muted);padding:10px 0}header nav .active{color:var(--blue);border-bottom:2px solid var(--blue)}header nav a{font-size:12px}.pill{border:1px solid #cbd7f1;border-radius:30px;background:#fff9;padding:12px 20px;color:var(--ink)}.pill span{margin-left:15px}.intro{position:absolute;left:48px;top:155px;pointer-events:none;z-index:1}.intro button{pointer-events:auto}.eyebrow{font:10px monospace;letter-spacing:1.8px;color:var(--blue);display:flex;align-items:center;gap:8px}i{width:6px;height:6px;border-radius:50%;background:var(--blue);display:inline-block}h1{font-size:clamp(46px,5.4vw,84px);letter-spacing:-5px;line-height:1.01;margin:26px 0 20px;font-weight:650}h1 em{font-style:normal;color:var(--blue)}.intro p{font-size:15px;line-height:1.65;color:var(--muted)}.primary{background:var(--blue);color:white;border:0;border-radius:5px;padding:15px 21px;font-weight:600;margin-top:12px;box-shadow:0 8px 20px #1652ff20}.primary span{margin-left:30px}.intro-note{font:10px monospace;letter-spacing:.6px;color:var(--muted);margin-top:24px}.maplabel{position:absolute;top:116px;left:53%;display:grid;gap:8px;pointer-events:none}.maplabel span{font:9px monospace;letter-spacing:1.8px;color:var(--blue)}.maplabel strong{font-size:13px;font-weight:500}.districts{position:absolute;left:50%;bottom:77px;transform:translateX(-50%);display:flex;gap:4px;background:#ffffffed;padding:6px;border:1px solid #fff;border-radius:14px;box-shadow:0 12px 40px #2c4d8720;z-index:2}.districts button{background:none;border:0;white-space:nowrap;padding:12px 16px;border-radius:9px;font-size:12px;color:var(--muted)}.districts button.selected{background:var(--blue);color:white}.districts small{display:inline-block;margin-right:8px;opacity:.6}.maptools{position:absolute;right:30px;bottom:145px;display:grid;background:white;border-radius:12px;box-shadow:0 4px 24px #1a397518;overflow:hidden}.maptools button{background:white;border:0;width:38px;height:38px;font-size:20px;color:var(--ink)}footer{position:absolute;bottom:0;left:0;right:0;height:48px;background:#f7f9ffeb;border-top:1px solid #c8d4ec70;display:flex;align-items:center;justify-content:space-between;padding:0 30px;font:9px monospace;letter-spacing:.6px;color:var(--muted)}footer b{font-weight:400;border:1px solid #cbd7ed;padding:4px 6px;margin-left:10px;color:var(--blue)}footer button{background:none;border:0;color:var(--muted);font:inherit}#panel{position:absolute;right:25px;top:107px;bottom:145px;width:365px;background:#fffefc;border:1px solid white;border-radius:18px;box-shadow:0 24px 70px #16365c30;overflow:auto;padding:30px;z-index:3}#panel[hidden]{display:none}#close{position:absolute;right:13px;top:10px;background:none;border:0;font-size:24px;color:var(--muted)}#panel h2{font-size:32px;letter-spacing:-1.2px;margin:17px 0 12px}#panel h3{font-size:17px;margin:4px 0}#panel p{font-size:13px;line-height:1.65;color:var(--muted)}#panel .primary{width:100%;margin:10px 0}.card{border:1px solid #e0e6f3;border-radius:12px;padding:16px;margin:12px 0}.card .tag{font:9px monospace;letter-spacing:1px;color:var(--blue)}.card button,.secondary{border:1px solid #dbe3f4;background:#f6f8ff;border-radius:6px;padding:9px 12px;color:var(--blue);margin:8px 5px 0 0}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.avatar{width:42px;height:42px;display:grid;place-items:center;background:var(--blue);color:white;border-radius:10px;font-size:23px}.small{font:10px monospace!important;line-height:1.6!important}.choices{display:flex;flex-wrap:wrap;gap:5px}input,textarea,select{width:100%;padding:11px;background:#f6f8ff;border:1px solid #dbe3f4;border-radius:7px;color:var(--ink);margin:7px 0 12px}textarea{height:90px;resize:vertical}label{font-size:12px}#toast{position:absolute;top:105px;left:50%;transform:translateX(-50%);background:#12244a;color:white;border-radius:9px;padding:12px 20px;font-size:12px;z-index:5;opacity:0;pointer-events:none;transition:opacity .2s}body.detail .intro{opacity:.16}body.detail .intro button{pointer-events:none}@media(max-width:900px){header{padding:0 20px;height:75px}header nav{gap:12px}header nav a{display:none}.intro{left:24px;top:110px}.intro h1{font-size:52px;letter-spacing:-3px}.intro p{font-size:13px}.maplabel{display:none}.districts{max-width:calc(100% - 28px);overflow:auto;justify-content:flex-start;bottom:65px}.districts button{padding:11px}footer span:nth-child(2){display:none}footer{padding:0 15px}.brand{font-size:23px}.pill{font-size:11px;padding:10px}#panel{right:15px;width:340px;top:85px;bottom:132px}.maptools{right:14px;bottom:128px}}@media(max-width:600px){header nav{display:none}.intro{top:94px}.intro h1{font-size:42px;margin-top:17px}.intro p,.intro-note{display:none}.intro .primary{padding:11px 15px;font-size:12px}.eyebrow{font-size:8px}.intro{pointer-events:none}#panel{left:12px;right:12px;width:auto;padding:25px;top:85px;bottom:127px}body.detail .intro{display:none}footer{font-size:8px}footer b{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

#mode{font-size:10px;width:62px;height:42px}.maptools button{width:62px}.maplabel{display:none}.intro{top:24%}header{background:linear-gradient(#f7f9fffa,#f7f9ffb0,transparent)}body.detail .intro{opacity:0}.secondary{display:inline-block}@media(max-width:600px){.intro{top:100px}.intro h1{font-size:44px}.intro .eyebrow{max-width:200px;font-size:8px}.maptools button{width:42px}#mode{width:42px;font-size:9px}footer button{max-width:135px}}

.wander{display:block;margin-top:14px;border:0;background:none;color:#385278;font-size:12px;padding:5px 0}.wander span{margin-left:9px}body.wandering .intro{display:none}canvas{cursor:grab}canvas:active{cursor:grabbing}.intro{transition:opacity .2s}.districts button:hover:not(.selected){background:#eef3ff;color:var(--blue)}.maptools button:hover{background:#edf3ff}.pill:hover{background:#fff}#panel .eyebrow{padding-right:4px;line-height:1.7}#panel{scrollbar-width:thin;scrollbar-color:#c5d5f6 transparent}.card strong{display:block;margin-top:12px;font-size:17px;color:var(--ink)}@media(max-width:600px){.wander{font-size:11px;margin-top:8px}}

body.detail .intro{visibility:hidden}

body.plan .intro{display:none}

#panel details{border-top:1px solid #e0e6f3;margin-top:22px;padding-top:16px}#panel summary{cursor:pointer;color:var(--blue);font-size:12px}button[disabled]{opacity:.6;cursor:wait}#panel label{display:block}#panel .secondary{line-height:1.4}#panel [aria-pressed=true]{background:#1652ff;color:#fff;border-color:#1652ff}

.accessgate{position:absolute;z-index:5;top:50%;left:50%;transform:translate(-50%,-50%);width:min(430px,calc(100% - 30px));background:#fffffff5;padding:38px;border-radius:22px;box-shadow:0 25px 80px #17335b40}.accessgate h2{font-size:38px;line-height:1.05;letter-spacing:-1.7px}.accessgate p{color:var(--muted);line-height:1.6}.gated .intro,.gated .districts,.gated .maptools,.gated #myspace,.gated header nav,.gated #about{display:none}.gated canvas{pointer-events:none;filter:blur(3px)}.districts{max-width:calc(100% - 36px);overflow:auto}

#homedock[hidden]{display:none}#homedock{position:absolute;z-index:2;left:26px;bottom:150px;max-width:360px;background:#fffffff0;border:1px solid white;border-radius:16px;padding:20px;box-shadow:0 12px 40px #17365c18}.homecopy{display:grid;gap:8px}.homecopy strong{font-size:20px;letter-spacing:-.5px}.homemeta{font-size:12px;color:var(--muted)}.homeactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.homeactions .primary{width:100%;margin:4px 0}.homeactions .secondary{font-size:12px;margin:4px 0 0;flex:1}body.detail #homedock{display:none}body:not(.plan) #homedock{display:none}#panel.interior{width:min(850px,calc(100% - 50px));padding:18px 22px 0;overflow:hidden}#panel.interior #panelcontent{height:100%;display:flex;flex-direction:column}#panel.interior h2{font-size:24px;margin:10px 0 14px}iframe.activity{width:100%;flex:1;min-height:0;border:0;border-radius:10px;background:#f5f7fc}body.member #myspace{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-color:#1652ff50;background:#fff}body.member #myspace:before{content:'●';color:#21a66d;font-size:9px;margin-right:9px}@media(max-width:600px){#homedock{left:12px;right:65px;top:90px;bottom:auto;padding:13px;max-width:none}.homecopy .eyebrow{display:none}.homecopy strong{font-size:16px}.homecopy{gap:4px}.homeactions{margin-top:5px}.homeactions .primary{width:auto;padding:9px;flex:1;font-size:11px}.homeactions .secondary{padding:8px;flex:none;font-size:11px}.homemeta{font-size:10px}#panel.interior{left:10px;right:10px;top:82px;bottom:125px;width:auto;padding:16px 13px 0}body.member #myspace{max-width:175px;font-size:10px}.brand span{max-width:175px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* Arrival stays the island, including for returning members. The walk has its own compact HUD. */
#explore,#walkhud,#walk-controls{display:none}body.plan #world{display:none}body.plan #explore{display:block;width:100%;height:100%;outline:none}body.plan #walkhud{display:flex;position:absolute;z-index:2;top:96px;left:28px;right:28px;justify-content:space-between;align-items:flex-start;pointer-events:none}.where,.walk-settings{pointer-events:auto;background:#fffffff0;backdrop-filter:blur(12px);border:1px solid #ffffffbb;border-radius:14px;padding:12px 16px;box-shadow:0 5px 25px #10264a14}.where{display:grid;gap:6px}.where strong{font-size:19px;max-width:260px}.where button,.walk-settings button{border:0;background:none;color:var(--blue);font-size:11px;padding:4px 0;text-align:left}.walk-settings{display:flex;gap:16px}.where button{border-top:1px solid #dce5f5;padding-top:8px}body.plan header{background:#f7f9ffed;backdrop-filter:blur(16px);height:80px;border-bottom:1px solid #d8e3f4}body.plan #walk-controls{display:flex;position:absolute;z-index:2;bottom:145px;left:28px;align-items:center;gap:16px}#interact{border:1px solid #ffffffa0;border-radius:28px;padding:13px 20px;background:#1652ff;color:white;box-shadow:0 6px 20px #15346730}.walk-hint{font-size:11px;color:#233b65;background:#ffffffe8;padding:12px;border-radius:22px}#joystick{display:none;touch-action:none;width:94px;height:94px;border:1px solid #ffffffc0;border-radius:50%;background:#ffffffa6;align-items:center;justify-content:center;box-shadow:0 4px 20px #15346720}#joystick span{display:block;width:40px;height:40px;border-radius:50%;background:#1652ff;transform:translate(var(--sx,0px),var(--sy,0px));pointer-events:none}body.plan #homedock{display:none}body.detail #walkhud,body.detail #walk-controls,body.gated #walkhud,body.gated #walk-controls{display:none}body.plan footer span:nth-child(2){font-size:0}body.plan footer span:nth-child(2)::after{content:'A world to wander. People and work to discover.';font-size:9px}#toast{max-width:min(560px,calc(100% - 32px));line-height:1.6;top:190px}body.plan .maptools{bottom:152px}.intro .primary{font-size:16px}.intro .wander{font-size:12px}
@media(max-width:600px){body.plan header{height:72px}body.plan #walkhud{top:84px;left:12px;right:12px}.where{padding:10px 12px;max-width:60%}.where strong{font-size:15px}.walk-settings{display:grid;gap:5px;padding:10px}.walk-settings button{font-size:10px}body.plan #walk-controls{bottom:135px;left:16px;gap:18px}#joystick{display:flex}.walk-hint{display:none}#interact{font-size:12px;padding:12px 15px}.where .eyebrow{font-size:8px}#toast{top:220px}body.plan .maptools{right:12px;bottom:135px}body.plan .districts{bottom:61px}.intro .primary{font-size:15px}body.plan #panel{bottom:118px}}
@media(pointer:coarse){#joystick{display:flex}.walk-hint{display:none}}
.walk-settings #character-head[aria-pressed=true]{color:#fff;background:var(--blue);border-radius:16px;padding:5px 9px}
.header-actions{display:flex;align-items:center;gap:12px;min-width:0}
#myspace{border:1px solid #1652ff;background:#1652ff;color:#fff;font-weight:700;box-shadow:0 7px 22px #1652ff27;white-space:nowrap;transition:transform .16s ease,box-shadow .16s ease}#myspace:hover{transform:translateY(-2px);box-shadow:0 11px 25px #1652ff35}body.member #myspace{color:var(--ink);box-shadow:none}body.member #myspace:hover{box-shadow:0 7px 20px #1652ff1c}
.signout{border:0;background:transparent;color:#526586;font-size:12px;padding:10px 4px;white-space:nowrap}.signout:hover{color:var(--blue);text-decoration:underline}.signout[hidden]{display:none}
@media(prefers-reduced-motion:reduce){#myspace{transition:none}#myspace:hover{transform:none}}
header{gap:24px}.brand{flex-shrink:0}header nav{gap:20px;white-space:nowrap}
.token-pill{display:flex;align-items:center;gap:10px;flex-shrink:0;padding:10px 13px;border:1px solid #c6d5ff;border-radius:28px;background:#f9fbfff2;box-shadow:0 3px 16px #1652ff09;color:var(--ink)}
.token-pill:hover{background:#fff;border-color:var(--blue)}
.token-mark{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--blue);color:#fff;font-size:18px}
.token-pill strong{display:block;font-size:11px;font-weight:700;white-space:nowrap;letter-spacing:.2px}
.token-divider{color:#94a4c4;margin:0 2px}.token-pill small{display:block;margin-top:4px;color:var(--blue);font:8px monospace;letter-spacing:1.4px}.token-arrow{color:var(--blue);font-size:15px}
@media(max-width:1200px) and (min-width:601px){
 header,body.plan header{height:108px;padding:12px 24px;flex-wrap:wrap;align-content:center;row-gap:5px;background:#f7f9fff0;backdrop-filter:blur(12px)}
 header nav{order:3;justify-content:center;flex-basis:100%;gap:24px}
 header nav a{display:block}header nav button{padding:5px 0;font-size:12px}
 body.plan #walkhud{top:120px}#panel{top:120px}
}
@media(max-width:600px){
 header,body.plan header{height:110px;padding:16px;align-items:flex-start;gap:12px}
 .header-actions{display:contents}.token-pill{position:absolute;right:16px;top:65px;padding:6px 10px;gap:8px}
 .token-mark{width:22px;height:22px;font-size:15px}.token-pill strong{font-size:10px}.token-pill small{display:inline;margin-left:8px;font-size:8px;letter-spacing:.6px}.token-pill strong{display:inline}.token-arrow{font-size:13px}
 #myspace,body.member #myspace{margin-left:auto;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 #signout{font-size:11px;padding:10px 2px}
 .intro{top:132px}body.plan #walkhud{top:122px}#panel,#panel.interior{top:120px}
}

/* Zora outdoor cinema: an honest ready screen that never pretends a stream is live. */
#panel.cinema-portal .cinema-screen-preview{min-height:190px;margin:18px 0 15px;padding:22px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:#f5f7ff;border:1px solid #8a84d6;border-radius:14px;background:radial-gradient(ellipse at 50% 45%,#6648a4 0,#202b58 43%,#0c1837 100%);box-shadow:inset 0 0 28px #a480ff38,0 10px 32px #17295724}
#panel.cinema-portal .cinema-screen-brand{font:800 11px ui-monospace,monospace;letter-spacing:3px;color:#d2c6ff}
#panel.cinema-portal .cinema-screen-preview strong{font-size:19px;letter-spacing:-.4px}
#panel.cinema-portal .cinema-screen-note{max-width:250px;color:#d0d8ef;font-size:12px;line-height:1.5}
#panel.cinema-portal .cinema-screen-preview button{margin:2px 0 0;background:#fff;color:#1652ff;border:0;border-radius:8px;padding:10px 18px;font-weight:700}
#panel.cinema-portal .cinema-screen-preview.playing{display:block;min-height:0;padding:0;overflow:hidden;background:#08132f}
#panel.cinema-portal .cinema-screen-preview.playing .cinema-video{margin:0;border-radius:0}
#panel.cinema-portal .cinema-play-card{min-height:116px;margin:12px 0 8px;padding:20px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid #6478c5;border-radius:10px;color:#e8edff;background:radial-gradient(ellipse at center,#273c78,#09142f 75%);font-size:14px;line-height:1.55}
#panel.cinema-portal .cinema-video{display:block;width:100%;aspect-ratio:16/9;margin:12px 0 6px;border:0;border-radius:9px;background:#08132f}
@media(max-width:600px){#panel.cinema-portal .cinema-screen-preview{min-height:155px;margin:12px 0;padding:16px}#panel.cinema-portal .cinema-screen-preview strong{font-size:17px}}
.mini-game{height:240px;position:relative;overflow:hidden;border:1px solid #cbd7f1;border-radius:22px;background:radial-gradient(circle at 50% 30%,#315eff,#0c1948 70%);margin:18px 0}.mini-game strong{position:absolute;left:18px;top:16px;color:#fff;z-index:2}.mini-game .coin{position:absolute;left:46%;top:50%;width:52px;height:52px;padding:0;border:0;border-radius:50%;background:#fff;color:var(--blue);font-size:24px;box-shadow:0 8px 30px #05102a88;transform:translate(-50%,-50%);transition:left .14s,top .14s}.mini-game .coin:disabled{opacity:.45}
.signin-status{min-height:36px}.gated.detail #accessgate{display:none}.gated.detail #panel{z-index:6}

/* Two distinct BBOOK contracts: let visitors choose the quoted pool before leaving Basebook. */
header{z-index:4}
.token-menu{position:relative;flex-shrink:0}
.token-menu summary{list-style:none;cursor:pointer}
.token-menu summary::-webkit-details-marker{display:none}
.token-menu .token-pill{position:static}
.token-options{position:absolute;right:0;top:calc(100% + 8px);width:min(330px,calc(100vw - 32px));padding:6px;background:#fff;border:1px solid #d5e0f7;border-radius:14px;box-shadow:0 16px 45px #11285828;z-index:5}
.token-options a{display:block;padding:11px 12px;border-radius:9px}
.token-options a:hover,.token-options a:focus-visible{background:#eef3ff}
.token-options strong{display:block;color:var(--blue);font-size:12px}
.token-options small{display:block;margin-top:5px;color:#667994;font:10px/1.45 monospace;overflow-wrap:anywhere}
@media(max-width:600px){.token-menu{position:absolute;right:16px;top:65px}.token-menu .token-pill{padding:6px 10px;gap:8px}}

/* The walk should feel like a place: one clear destination card, calm tools,
   and a district switcher that remains usable on narrow screens. */
body.plan .where{width:min(290px,calc(100vw - 32px));gap:9px;padding:18px 18px 16px;border:1px solid #d8e6ff;border-radius:20px;background:#fffffff5;box-shadow:0 15px 45px #173c7028}
body.plan .where .eyebrow{font-size:10px;letter-spacing:1.7px}
body.plan .where .eyebrow i{width:8px;height:8px;background:#31b876;box-shadow:0 0 0 4px #31b8761c}
body.plan .where strong{font-size:24px;line-height:1.05;letter-spacing:-.8px}
body.plan #place-sub{font-size:12px;line-height:1.45;color:#677891;max-width:245px}
body.plan #place-action{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding:10px 12px;border:0;border-radius:10px;background:#1652ff;color:#fff;font-size:12px;font-weight:700;box-shadow:0 7px 16px #1652ff26}
body.plan #place-action:hover{background:#0d45e8}
body.plan .walk-settings{align-items:center;gap:3px;padding:6px;border:1px solid #d8e6ff;border-radius:15px;background:#fffffff4;box-shadow:0 12px 32px #173c701a}
body.plan .walk-settings button{padding:9px 11px;border-radius:10px;color:#38537e;font-size:11px;white-space:nowrap}
body.plan .walk-settings button:hover{background:#ecf3ff;color:#1652ff}
body.plan #happening{font-weight:700;color:#17428d}
body.plan #happening:first-letter{color:#24ab70}
body.plan .districts{bottom:70px;border:1px solid #d8e6ff;border-radius:16px;padding:5px;background:#fffffff5;box-shadow:0 14px 40px #153c7729;scrollbar-width:none}
body.plan .districts::-webkit-scrollbar{display:none}
body.plan .districts button{padding:11px 13px;font-size:11px;font-weight:600}
body.plan .districts button.selected{box-shadow:0 5px 14px #1652ff28}
body.plan #interact{font-weight:700;box-shadow:0 8px 22px #0e3da848}
body.plan .maptools{border:1px solid #d8e6ff;border-radius:15px;box-shadow:0 10px 30px #163c7125}
body.plan .maptools button+button{border-top:1px solid #edf2fb}
@media(max-width:900px){body.plan .walk-settings{max-width:calc(100vw - 260px);overflow-x:auto}}
@media(max-width:600px){body.plan #walkhud{left:10px;right:10px;top:121px;gap:7px}body.plan .where{width:43%;min-width:0;max-width:none;padding:11px;gap:5px;border-radius:14px}body.plan .where strong{font-size:17px}body.plan #place-sub{font-size:10px;line-height:1.25}body.plan #place-action{font-size:10px;padding:8px;margin-top:2px}body.plan .walk-settings{max-width:54%;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0;padding:4px;border-radius:13px}body.plan .walk-settings button{font-size:10px;padding:6px}body.plan #happening{width:100%;text-align:right}body.plan #walk-controls{bottom:140px}body.plan .districts{bottom:58px}body.plan .maptools{bottom:151px}}

/* A cabinet takes the screen on phones so touch controls and game HUD fit. */
#panel.arcade-playing{width:min(1060px,calc(100% - 40px));bottom:62px}
#panel.arcade-lobby{width:min(940px,calc(100% - 36px));bottom:70px;background:#080e26;border:1px solid #344481;color:#fff;padding:28px;box-shadow:0 25px 90px #07173a85}
body:has(#panel.arcade-lobby:not([hidden])) .district-dock{visibility:hidden}
.intro .cinema-entry{display:inline-block;pointer-events:auto;margin:12px 0 0 15px;padding:12px 14px;border-radius:8px;background:#ffffffeb;border:1px solid #b8cdf4;color:#1652ff;font-weight:700;font-size:12px;box-shadow:0 8px 20px #124ea324}.intro .cinema-entry:hover{background:#eaf2ff}@media(max-width:600px){.intro .cinema-entry{margin-left:5px;padding:11px 10px;font-size:11px}}
#panel.arcade-lobby #close{color:#c6d7ff}
#panel.arcade-lobby #panelcontent>.eyebrow{color:#83a9ff;letter-spacing:3px}
#panel.arcade-lobby h2{font-size:clamp(31px,4vw,48px);margin:10px 0 3px;color:#fff}
#panel.arcade-lobby #panelcontent>p{color:#b7c8ee}
.arcade-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:24px 0 18px}
.arcade-cabinet{min-width:0;display:flex;flex-direction:column;border:1px solid #5b70b3;border-radius:18px;padding:8px;background:linear-gradient(145deg,#304280,#14214f 65%,#0a1437);box-shadow:inset 0 0 0 2px #081338,0 13px 30px #020918aa}
.arcade-screen{position:relative;min-height:170px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:7px solid #080d22;border-radius:13px;background:radial-gradient(circle at 48% 45%,#ff668a55,transparent 45%),linear-gradient(155deg,#242f70,#070c23 75%);box-shadow:inset 0 0 42px #050720}
.arcade-screen:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 4px,#0002 5px 6px);pointer-events:none}
.arcade-glyph{font-size:75px;font-weight:900;line-height:1;color:#ffa7c7;text-shadow:0 0 14px #fb3c96,0 0 42px #fb3c96aa;transform:rotate(-7deg)}
.arcade-marquee{position:absolute;bottom:9px;left:10px;right:10px;text-align:center;font:700 10px monospace;letter-spacing:1.3px;color:#c8d8ff}
.arcade-cabinet.golf .arcade-screen{background:radial-gradient(circle at 50% 65%,#b5ffbd6b,transparent 46%),linear-gradient(150deg,#1b684f,#0b1833 80%)}
.arcade-cabinet.golf .arcade-glyph{color:#c8ffac;text-shadow:0 0 16px #7cff9d,0 0 42px #77ffa4aa;transform:rotate(0)}
.arcade-cabinet.dash .arcade-screen{background:radial-gradient(circle at 50% 50%,#ffe6856b,transparent 45%),linear-gradient(150deg,#754ba3,#101237 80%)}
.arcade-cabinet.dash .arcade-glyph{color:#ffe083;text-shadow:0 0 16px #ffe27c,0 0 42px #fdc644aa;transform:rotate(0)}
.arcade-info{display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:14px 11px 10px}
.arcade-info h3{font-size:19px!important;line-height:1.15;margin:0!important;color:#fff}
.arcade-info p{font-size:12px!important;line-height:1.5!important;color:#b7c8ee!important;min-height:38px;margin:11px 0!important}
.arcade-info .primary{width:100%;margin:auto 0 0!important;border-radius:10px;background:#2462ff;box-shadow:0 5px 20px #0a49ee60}
.arcade-footnote{font-size:11px!important;letter-spacing:.2px}
@media(max-width:700px){#panel.arcade-lobby{left:8px;right:8px;top:76px;bottom:58px;width:auto;padding:18px 14px}.arcade-grid{grid-template-columns:1fr;gap:12px;margin:18px 0}.arcade-cabinet{flex-direction:row;min-height:145px}.arcade-screen{min-height:125px;flex:0 0 39%}.arcade-glyph{font-size:52px}.arcade-marquee{font-size:7px}.arcade-info{padding:8px 7px}.arcade-info h3{font-size:17px!important}.arcade-info p{min-height:0;margin:7px 0!important}.arcade-info .primary{padding:10px 12px;font-size:12px}}
#panel.arcade-playing #panelcontent>.secondary{margin:0 0 9px;align-self:flex-start}
@media(max-width:600px){#panel.arcade-playing{position:fixed;inset:0;width:100%;height:100dvh;border:0;border-radius:0;padding:12px 10px 0;z-index:8}#panel.arcade-playing h2{font-size:19px;margin:3px 0 8px}#panel.arcade-playing #panelcontent>.secondary{padding:8px 10px;margin:0 0 6px}#panel.arcade-playing iframe.activity{border-radius:8px 8px 0 0}}

/* The island stays the hero. Copy occupies the sky on phones, and the artwork
   starts beneath it so Creators Square / Zora is never under the headline. */
@media(min-width:901px){body:not(.plan) .intro{left:clamp(26px,3.5vw,56px);top:clamp(190px,25vh,260px);width:min(340px,27vw);max-width:calc(100vw - 52px)}body:not(.plan) .intro h1{font-size:clamp(48px,4.4vw,70px);letter-spacing:-.058em;line-height:1.02}body:not(.plan) .intro p{max-width:225px;line-height:1.5}}
body:not(.plan) .intro h1{text-shadow:0 2px 18px #f5f9ffb8}
body:not(.plan) .intro .primary{box-shadow:0 10px 26px #0d43d550;transition:transform .22s ease,box-shadow .22s ease}
body:not(.plan) .intro .primary:hover{transform:translateY(-3px);box-shadow:0 17px 34px #0d43d55e}
@media(max-width:600px){
 body:not(.plan) .intro{top:119px;left:14px;right:14px;width:auto;padding:10px 12px 12px;border:1px solid #fff8;border-radius:18px;background:linear-gradient(110deg,#f6f9fffa 0%,#f6f9fff0 64%,#f6f9ffd0 100%);box-shadow:0 10px 30px #2d4d7918;backdrop-filter:blur(8px)}
 body:not(.plan) .intro h1{font-size:34px;letter-spacing:-2.2px;line-height:1.02;margin:8px 0 9px}
 body:not(.plan) .intro .eyebrow{font-size:8px;max-width:none}
 body:not(.plan) .intro .primary{margin-top:0;padding:10px 14px;font-size:12px}
 body:not(.plan) .intro .wander{display:inline-block;margin:0 0 0 12px;padding:9px 3px;font-size:11px}
 body:not(.plan) .intro .intro-note{display:none}
}
@media(prefers-reduced-motion:reduce){body:not(.plan) .intro .primary{transition:none}body:not(.plan) .intro .primary:hover{transform:none}}

/* The painted arrival and the walk share a camera-sized stage, so moving
   between them feels continuous instead of replacing one canvas abruptly. */
#world,#explore{display:block;width:100vw;height:100vh;height:100dvh;transition:opacity .48s ease;will-change:opacity}
#world{opacity:1}
#explore{opacity:0;pointer-events:none}
body.plan #world{display:block;opacity:0;pointer-events:none}
body.plan #explore{display:block;width:100vw;height:100vh;height:100dvh;opacity:1;pointer-events:auto}
@media(max-width:600px){.districts{scroll-snap-type:x proximity;scrollbar-width:none}.districts button{scroll-snap-align:center}}

@media(prefers-reduced-motion:reduce){#world,#explore{transition:none;will-change:auto}}

/* A visible, swipeable place dock keeps every district reachable on phones. */
.district-dock{position:absolute;z-index:3;left:50%;bottom:70px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;width:min(1250px,calc(100vw - 24px));padding:5px;border:1px solid #d8e6ff;border-radius:17px;background:#fffffff5;box-shadow:0 14px 40px #153c7729}
.district-dock .districts,body.plan .district-dock .districts{position:static;left:auto;bottom:auto;transform:none;flex:1;min-width:0;max-width:none;overflow-x:auto;overflow-y:hidden;display:flex;justify-content:flex-start;padding:0;border:0;border-radius:10px;background:transparent;box-shadow:none;scrollbar-width:none;touch-action:pan-x;overscroll-behavior-x:contain}
.district-dock .districts::-webkit-scrollbar{display:none}
.district-arrow{flex:0 0 34px;align-self:stretch;border:0;border-radius:11px;background:#edf3ff;color:#1652ff;font-size:24px;font-weight:600;line-height:1}
.district-arrow:disabled{opacity:.35;cursor:default}
.district-arrow:not(:disabled):active{background:#dbe8ff}
#places{font-size:9px;font-weight:700;width:62px;height:42px}
body.plan #arcade-shortcut{color:#a01752;background:#ffeaf2;font-weight:800}
body.plan #arcade-shortcut:hover{color:#8b0642;background:#ffdae9}
@media(max-width:900px){.district-dock{bottom:65px}}
@media(max-width:600px){.district-dock,body.plan .district-dock{bottom:58px;width:calc(100vw - 20px)}.district-arrow{flex-basis:30px}body.plan #surprise{display:none}body.plan #arcade-shortcut{font-size:11px;background:#ffe7f0;padding:7px 9px}#places{width:42px;font-size:8px;height:37px}}

/* Phone layout: keep the island visible and give the walk one clear status bar. */
@media(max-width:600px){
 header,body.plan header{height:96px;padding:12px;gap:7px}
 .brand{font-size:20px;letter-spacing:-.8px}
 .brand span{font-size:7px;letter-spacing:2px;margin:4px 0 0 20px}
 #myspace,body.member #myspace{max-width:min(35vw,142px);padding:9px 10px;font-size:10px}
 #signout{font-size:10px;padding:9px 0}
 .token-menu{right:12px;top:55px}
 .token-menu .token-pill{padding:6px 9px;box-shadow:0 4px 14px #1652ff16}
 body:not(.plan) .intro{top:104px;left:12px;right:12px;padding:10px 12px 11px;border-radius:15px;background:#f8fafff5;backdrop-filter:blur(4px)}
 body:not(.plan) .intro h1{font-size:28px;letter-spacing:-1.5px;line-height:1.02;margin:5px 0 7px}
 body:not(.plan) .intro .eyebrow{font-size:7px;letter-spacing:1.35px}
 body:not(.plan) .intro .primary{padding:8px 11px;font-size:11px;border-radius:9px}
 body:not(.plan) .intro .wander{font-size:11px;margin-left:10px;padding:7px 2px}
 body.plan #walkhud{top:118px;left:9px;right:9px;display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
 body.plan .where{width:100%;min-height:58px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:9px;row-gap:0;padding:7px 9px;border-radius:12px}
 body.plan .where .eyebrow{grid-column:1;font-size:8px;letter-spacing:1px}
 body.plan .where strong{grid-column:1;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.plan #place-sub{display:none}
 body.plan #place-action{grid-column:2;grid-row:1/3;max-width:125px;margin:0;padding:8px 9px;font-size:10px;line-height:1.15}
 body.plan .walk-settings{width:100%;max-width:none;display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:3px;overflow-x:auto;scrollbar-width:none;padding:3px 5px;border-radius:11px}
 body.plan .walk-settings::-webkit-scrollbar{display:none}
 body.plan .walk-settings button,body.plan #arcade-shortcut{flex:0 0 auto;width:auto;padding:6px 8px;font-size:10px}
 body.plan #happening{width:auto;white-space:nowrap}
 body.plan #happening span{display:none}
 body.plan #happening::after{content:'Now';font-size:10px}
 body.plan .maptools{right:9px;bottom:139px;border-radius:12px}
 body.plan .maptools button,body:not(.plan) .maptools button{min-height:34px}
 body.plan #walk-controls{bottom:137px;left:10px;gap:8px}
 body.plan #joystick{width:74px;height:74px}
 body.plan #joystick span{width:32px;height:32px}
 body.plan #interact{font-size:11px;padding:10px 12px}
 .district-dock,body.plan .district-dock{bottom:55px;width:calc(100vw - 18px)}
 footer{height:43px}
 #panel,#panel.interior{top:116px;bottom:110px}
}

/* Keep controls readable as the viewport narrows or the browser is zoomed. */
.districts button{color:#344b70}
#panel p{color:#50617d;font-size:14px;line-height:1.5}
#panel .card button,#panel .secondary{font-size:13px;min-height:40px}
@media(max-width:1200px) and (min-width:601px){
 header nav button,header nav a{font-size:13px}
 .district-dock .districts button{font-size:13px;min-height:42px}
 .maptools button{min-height:42px}
}
@media(max-width:600px){
 body.plan .where{min-height:64px}
 body.plan .where strong{font-size:18px}
 body.plan #place-action{font-size:11px;min-height:42px;max-width:139px}
 body.plan .walk-settings{min-height:42px;align-items:center}
 body.plan .walk-settings button,body.plan #arcade-shortcut{font-size:12px;min-height:34px;padding:7px 9px}
 body.plan #happening::after{font-size:12px}
 body.plan #interact{font-size:12px;min-height:44px}
 .district-dock .districts button,body.plan .district-dock .districts button{font-size:12px;min-height:43px;padding:10px 12px}
 .district-arrow{min-height:43px}
 .maptools button,body.plan .maptools button{font-size:18px;min-height:40px}
 #places,#mode{font-size:10px;width:42px;line-height:1.2}
 .token-pill small{font-size:9px;letter-spacing:.3px}
 footer,footer button{font-size:10px;color:#526786}
 footer button{max-width:none;white-space:nowrap}
 #panel h2{font-size:27px}
 #panel .eyebrow{font-size:10px}
}

/* Keep the illustrated arrival and walkable canvas separate. */
#world,#explore{transition:none;will-change:auto}
body.plan #world{display:none}
body:not(.plan) #explore{display:none}

/* A public conversation stays inside the world instead of sending residents
   to the workspace. The scroll area leaves the composer in reach on phones. */
#panel.world-chat-view{display:flex;flex-direction:column}
#panel.world-chat-view[hidden]{display:none}
#panel.world-chat-view #panelcontent{display:flex;flex-direction:column;min-height:0;height:100%}
.world-chat-list{display:flex;flex:1 1 auto;min-height:40px;flex-direction:column;gap:10px;overflow:auto;overscroll-behavior:contain;padding:4px 3px 10px}
.world-chat-message{padding:12px 14px;border:1px solid #d9e3f5;border-radius:15px;background:#f7faff;overflow-wrap:anywhere}
.world-chat-message-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;color:#152a4c}
.world-chat-message-head strong{font-size:14px}
.world-chat-message-head time{flex:none;font-size:11px;color:#5c6c82}
#panel .world-chat-body{margin:7px 0 0;white-space:pre-wrap;line-height:1.45;color:#20324e;font-size:14px}
.world-chat-recipient{display:block;margin-top:4px;font-size:11px;color:#4e6891}
.world-chat-reply{margin-top:8px;border:0;background:none;padding:4px 0;color:#1454e5;font-size:12px;font-weight:700;cursor:pointer}
#panel .world-chat-status,#panel .world-chat-empty{font-size:12px;color:#526786}
.world-chat-form{display:grid;gap:8px;margin-top:10px}
.world-chat-form[hidden]{display:none}
.world-chat-form label{display:grid;gap:6px;font-size:12px;font-weight:700;color:#21385e}
.world-chat-form textarea{box-sizing:border-box;width:100%;min-height:82px;padding:12px;border:1px solid #b9c9e5;border-radius:12px;background:#fff;color:#182a49;font:inherit;resize:vertical}
.world-chat-form textarea:focus-visible{outline:3px solid #78a5ff;outline-offset:1px}
.world-chat-form .small{margin:0;font-size:11px;color:#526786}
.world-chat-actions{display:flex;justify-content:flex-end}
.world-chat-actions button{min-height:44px}
.world-chat-signin{margin-top:10px;min-height:44px}

@media(max-width:600px){
 #myspace,body.member #myspace{max-width:min(166px,calc(100vw - 154px))}
}
@media(max-width:360px){
 body.plan #cycle{display:none}
 body.plan #happening{display:inline-flex}
 body.plan .walk-settings{justify-content:space-between}
 body.plan .walk-settings button,body.plan #arcade-shortcut{font-size:11px;padding:7px 6px}
}

/* A linked profile adds another control; keep Arcade and sound visible instead
   of clipping the last action off the phone-sized strip. */
@media(max-width:600px){
 body.plan .walk-settings{flex-wrap:wrap;overflow:visible;justify-content:space-between}
 body.plan #arcade-shortcut{order:-1}
 body.plan #character-head{order:1}
}

/* Desktop arrival: a compact invitation beside the island, with Zora and the
   central neighborhoods left visible. */
@media(min-width:901px){
 body:not(.plan) .intro{
  left:clamp(20px,2.5vw,44px);
  top:clamp(146px,19vh,224px);
  width:clamp(300px,18vw,350px);
  padding:21px 20px 18px;
  border:1px solid #ffffffb8;
  border-radius:22px;
  background:linear-gradient(140deg,#f9fbfff2,#f9fbffe0);
  box-shadow:0 18px 50px #173c7030;
  backdrop-filter:blur(10px);
 }
 body:not(.plan) .intro h1{font-size:clamp(42px,2.9vw,56px);line-height:1.04;letter-spacing:-.055em;margin:15px 0 18px;font-weight:750}
 body:not(.plan) .intro p{max-width:none;font-size:14px;line-height:1.55;margin:0 0 12px}
 body:not(.plan) .intro .primary{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:12px;border-radius:11px;font-size:15px}
 body:not(.plan) .intro .wander{margin-top:10px;padding:8px 2px;font-size:13px}
 body:not(.plan) .intro-note{margin-top:18px}
}

/* Phone HUD: a short destination card and one row of controls leave the
   character and nearby activity visible, even with a linked profile. */
@media(max-width:600px){
 body:not(.plan) .intro{top:100px;padding:9px 12px 10px}
 body:not(.plan) .intro h1{font-size:clamp(27px,7.4vw,31px);margin:5px 0 7px;letter-spacing:-1.6px}
 body:not(.plan) .intro .primary{min-height:38px;padding:8px 12px;font-size:12px}
 body.plan #walkhud{top:104px;gap:5px}
 body.plan .where{min-height:59px;padding:8px 10px;grid-template-columns:minmax(0,1fr) minmax(116px,40%)}
 body.plan .where strong{font-size:clamp(15px,4.5vw,18px);line-height:1.1}
 body.plan #place-action{width:100%;max-width:none;min-height:39px;padding:7px 9px;font-size:11px}
 body.plan .walk-settings{width:100%;height:42px;min-height:42px;max-width:none;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:2px;overflow:hidden;padding:2px 4px}
 body.plan .walk-settings button,body.plan #arcade-shortcut{flex:0 1 auto;min-height:34px;white-space:nowrap;padding:6px 6px;font-size:11px}
 body.plan #arcade-shortcut{order:0}
 body.plan #happening{order:1;width:auto;font-size:0;padding:6px 5px}
 body.plan #happening::before{content:'●';font-size:11px;color:#20a875;margin-right:4px}
 body.plan #happening::after{content:'World';font-size:11px;color:#17428d}
 body.plan #cycle{order:2;font-size:0;padding:6px 5px}
 body.plan #cycle::after{content:attr(data-phase);font-size:11px;text-transform:capitalize}
 body.plan #sound{order:3;padding:6px 5px}
 body.plan #character-head{order:4;position:relative;flex:0 0 37px;width:37px;height:35px;min-height:35px;overflow:hidden;color:transparent;font-size:0;padding:0}
 body.plan #character-head::after{content:'Face';position:absolute;inset:0;display:grid;place-items:center;color:#345582;font-size:10px;font-weight:700}
 body.plan #character-head[aria-pressed='true']{background:#e6efff}
 body.plan #character-head[aria-pressed='true']::after{color:#1652ff}
 body.plan #surprise{display:none}
 body.plan #interact .keyboard-key{display:none}
}

/* On a phone the invitation is a compact action card: the headline and both
   choices use the width, instead of leaving an empty right half over the art. */
#panel.profile-view #panelcontent>.eyebrow,#panel.profile-view #panelcontent>h2{display:none}
#panel.profile-view iframe.activity{margin-top:14px}
@media(max-width:600px){
 body:not(.plan) .intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(128px,42%);column-gap:10px;align-items:center}
 body:not(.plan) .intro .eyebrow{grid-column:1/-1;white-space:nowrap}
 body:not(.plan) .intro h1{grid-column:1;grid-row:2/4;margin:4px 0 0;font-size:clamp(24px,7vw,30px);line-height:1.04}
 body:not(.plan) .intro .primary{grid-column:2;grid-row:2;width:100%;margin:4px 0 0;justify-content:space-between;min-height:39px}
 body:not(.plan) .intro .primary span{margin-left:5px}
 body:not(.plan) .intro .wander{grid-column:2;grid-row:3;margin:2px 0 0;padding:7px 2px;width:100%;text-align:center}
 body:not(.plan) .intro .wander span{margin-left:5px}
}

/* Arrival copy sits in the sky; the Musebook port remains visible below it. */
@media(min-width:901px){
 body:not(.plan) .intro{left:24px;top:88px;width:294px;padding:15px 17px 17px;border:1px solid #ffffffd9;border-radius:18px;background:#f8fbfff0;backdrop-filter:blur(9px);box-shadow:0 12px 34px #173c7022}
 body:not(.plan) .intro h1{font-size:34px;line-height:1.01;margin:10px 0 11px;letter-spacing:-2px}
 body:not(.plan) .intro p,body:not(.plan) .intro .intro-note{display:none}
 body:not(.plan) .intro .primary{display:inline-flex;width:auto;font-size:13px;padding:10px 13px;margin:0 9px 0 0}
 body:not(.plan) .intro .primary span{margin-left:13px}
 body:not(.plan) .intro .wander{display:inline-block;width:auto;font-size:12px;margin:0}
 body:not(.plan) .intro .cinema-entry{display:none}
}

/* Presence stays in the header; details only open when requested. */
#live-toggle[aria-pressed="true"]{background:#7034cf;color:#fff;border-color:#7034cf}
.walk-settings #live-roster-toggle{display:inline-flex;align-items:center;justify-content:center;border:0;background:#f0e7ff;color:#6234a4;border-radius:9px;white-space:nowrap;font-weight:700}
body.plan #live-roster-toggle[hidden]{display:none}
#live-panel{position:fixed;right:20px;top:146px;z-index:24;max-width:min(330px,calc(100vw - 32px));padding:14px 16px;border:1px solid #b7a0e9;border-radius:18px;background:#fffffff0;box-shadow:0 10px 32px #44227822;color:#202050;backdrop-filter:blur(12px)}
#live-panel[hidden]{display:none}#live-status{font-size:14px}.live-note{font-size:11px;line-height:1.4;max-width:280px;margin:7px 0 9px;color:#66617d}
#live-people{display:grid;gap:8px;max-height:210px;overflow:auto}.live-person{display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:13px}.live-person span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-person button,#live-self{flex-shrink:0;background:#7034cf;color:#fff;border:0;border-radius:12px;padding:8px 10px;font:600 12px inherit;cursor:pointer}#live-self{margin-top:8px}body.detail #live-panel{display:none}
@media(max-width:600px){#live-panel{top:auto;bottom:190px;right:12px;max-width:calc(100vw - 24px);padding:10px 12px}.live-note{font-size:10px;max-width:240px}#live-people{max-height:100px}}

/* Sign-in choices should read as a small sheet, not an empty full-height room. */
body.plan #panel.signin-choice,#panel.signin-choice{bottom:auto;height:auto;max-height:calc(100dvh - 190px)}
@media(max-width:600px){body.plan #panel.signin-choice,#panel.signin-choice{top:84px;bottom:auto;height:auto;max-height:calc(100dvh - 205px)}}

/* Play mode keeps the scene clear. A small More menu retains the secondary
   controls, and Places opens the full destination list on demand. */
#world-more,#world-account,#world-exit{display:none}
body.detail.plan .district-dock,body.detail.plan .maptools{visibility:hidden}
@media(max-width:600px){
 body.plan footer{display:none}
 body.plan #walkhud{top:94px;left:8px;right:8px;display:flex;align-items:center;flex-wrap:nowrap;gap:6px}
 body.plan .where{display:flex;flex:1 1 auto;width:auto;min-width:0;min-height:42px;height:42px;max-width:none;align-items:center;padding:6px 10px;border-radius:13px}
 body.plan .where strong{min-width:0;max-width:none;font-size:13px;line-height:1.12;white-space:normal;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
 body.plan .where .eyebrow,body.plan #place-sub,body.plan #place-action{display:none}
 body.plan .walk-settings{display:flex;flex:0 0 auto;width:auto;min-width:0;max-width:none;height:42px;min-height:42px;gap:3px;justify-content:flex-end;overflow:visible;padding:3px 5px;border-radius:13px}
 body.plan .walk-settings button{flex:0 0 auto;min-height:34px;padding:6px 8px}
 body.plan #world-more{display:inline-flex;align-items:center;justify-content:center;order:3;font-size:11px;color:#1652ff}
 body.plan #happening{display:inline-flex;align-items:center;order:2}
 body.plan #live-roster-toggle{order:1;min-height:34px;font-size:11px;padding:6px}
 body.plan #cycle,body.plan #sound,body.plan #character-head,body.plan #arcade-shortcut,body.plan #surprise{display:none}
 body.plan #live-toggle{display:inline-flex;order:0;max-width:82px;overflow:hidden;text-overflow:ellipsis}
 body.plan.controls-expanded #walkhud{flex-wrap:wrap}
 body.plan.controls-expanded .where{flex:1 1 100%;height:auto;min-height:44px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}
 body.plan.controls-expanded #place-action{display:flex;grid-column:2;grid-row:1;max-width:145px;width:auto;min-height:36px;margin:0;padding:7px 9px}
 body.plan.controls-expanded .walk-settings{flex:1 1 100%;height:auto;min-height:42px;flex-wrap:wrap;justify-content:flex-start}
 body.plan.controls-expanded #live-toggle,body.plan.controls-expanded #cycle,body.plan.controls-expanded #sound,body.plan.controls-expanded #arcade-shortcut{display:inline-flex}
 body.plan.controls-expanded #character-head:not([hidden]){display:inline-flex}
 body.plan .district-dock{display:none}
 body.plan #walk-controls{bottom:calc(12px + env(safe-area-inset-bottom,0px));left:10px;gap:10px}
 body.plan #joystick{width:74px;height:74px}
 body.plan #interact{min-height:44px}
 body.plan .maptools{right:10px;bottom:calc(12px + env(safe-area-inset-bottom,0px))}
 body.plan .maptools #mode,body.plan .maptools #minus,body.plan .maptools #plus{display:none}
 body.plan .maptools #places,body.plan .maptools #reset{display:block;width:46px;min-height:40px}
 body.plan #panel.world-chat-view{top:86px;bottom:calc(12px + env(safe-area-inset-bottom,0px))}
 body.plan #live-panel{top:143px;bottom:auto;right:8px;max-width:min(255px,calc(100vw - 16px));display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;padding:6px 8px;border-radius:12px}
 body.plan #live-status{font-size:11px}
 body.plan #live-panel .live-note{display:block;flex:1 1 100%;font-size:11px;margin:3px 0 5px}
 body.plan #live-panel #live-people{display:grid;flex:1 1 100%;max-height:120px}
 body.plan #live-panel #live-self[hidden]{display:none}
 /* The world canvas already spans the viewport. Keep browser-safe inset space,
    but let the scene reach every edge instead of reserving a site header. */
 body.plan header{display:none}
 body.plan #walkhud{top:calc(8px + env(safe-area-inset-top,0px))}
 body.plan #live-panel{top:calc(60px + env(safe-area-inset-top,0px))}
 body.plan #live-panel[hidden]{display:none}
 body.plan.controls-expanded #world-account,body.plan.controls-expanded #world-exit{display:inline-flex}
 body.plan #toast{top:calc(70px + env(safe-area-inset-top,0px))}
 body.plan #panel:not(.signin-choice){top:calc(8px + env(safe-area-inset-top,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px))}
 body.plan #panel.world-chat-view{top:calc(8px + env(safe-area-inset-top,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px))}
}

/* A conversation in the play view: one tap from Talk, no full-screen detour. */
#inline-chat{position:fixed;z-index:26;top:154px;right:20px;width:min(380px,calc(100vw - 32px));max-height:min(480px,55dvh);display:flex;flex-direction:column;box-sizing:border-box;padding:12px;border:1px solid #b8c9ed;border-radius:18px;background:#fffffff7;box-shadow:0 18px 48px #10264a38;color:#142b55;backdrop-filter:blur(16px)}
#inline-chat[hidden]{display:none}
.inline-chat-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:1px 2px 10px;border-bottom:1px solid #dce6f7}
.inline-chat-head div{display:grid;gap:2px}.inline-chat-head strong{font-size:16px}.inline-chat-head span{font-size:11px;color:#5a6e90}
#inline-chat-close{width:32px;height:32px;border:0;border-radius:9px;background:#eef3ff;color:#284873;font-size:23px;line-height:1;cursor:pointer}
#inline-chat-messages{min-height:70px;max-height:260px;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:12px 2px;scrollbar-width:thin}
.inline-chat-row{display:grid;gap:2px;max-width:95%;padding:8px 10px;border-radius:12px;background:#edf3ff;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.inline-chat-row strong{font-size:11px;color:#1652c7}.inline-chat-empty{font-size:12px;color:#647593}
#inline-chat-form{display:flex;gap:7px;margin:0;padding-top:9px;border-top:1px solid #dce6f7}
#inline-chat-form[hidden],#inline-chat-signin[hidden]{display:none}
#inline-chat-input{flex:1;min-width:0;height:42px;box-sizing:border-box;margin:0;border:1px solid #bfceed;border-radius:10px;background:#fff;font:14px system-ui,sans-serif}
#inline-chat-send,#inline-chat-signin{flex:none;min-height:42px;margin:0;padding:9px 12px;border:0;border-radius:10px;background:#1652ff;color:white;font-weight:700;cursor:pointer}
#inline-chat-send:disabled{opacity:.6}#inline-chat-signin{width:100%}
#inline-chat-status{min-height:0;margin:5px 2px 0;color:#9b3344;font-size:11px}
.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}
@media(max-width:600px){#inline-chat{top:calc(110px + env(safe-area-inset-top,0px));left:8px;right:8px;width:auto;max-height:min(430px,58dvh);padding:10px}#inline-chat-messages{max-height:calc(58dvh - 130px);min-height:65px}}

@media(max-width:380px){body.plan .walk-settings{gap:1px;padding:3px}body.plan .walk-settings button,body.plan #live-roster-toggle{padding:6px 5px;font-size:10px}body.plan .where{padding:6px 7px}body.plan .where strong{font-size:12px}}

/* Landmark actions stay compact so the world remains visible around them. */
body.plan #panel.landmark-portal,#panel.landmark-portal{bottom:auto;height:auto;max-height:calc(100dvh - 150px)}
@media(max-width:600px){body.plan #panel.landmark-portal{top:calc(60px + env(safe-area-inset-top,0px));bottom:auto;max-height:calc(100dvh - 150px)}}

/* Chat stays inside the phone viewport and leaves the world visible above it. */
#inline-chat{min-width:0}
#inline-chat-messages{flex:1 1 auto;min-height:0;max-height:none}
.inline-chat-row{width:fit-content;max-width:86%;box-sizing:border-box;padding:9px 12px;border-radius:15px 15px 15px 5px;background:#f0f4fc;color:#1a2c4a}
.inline-chat-row.mine{align-self:flex-end;border-radius:15px 15px 5px 15px;background:#1652ff;color:#fff}
.inline-chat-meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.inline-chat-row.mine strong,.inline-chat-row.mine time{color:#e0eaff}
.inline-chat-row time{font-size:10px;color:#7283a3;white-space:nowrap}
#inline-chat-form{min-width:0;align-items:center}
#inline-chat-input{width:100%;min-width:0;padding:0 12px;font-size:16px}
#inline-chat-send{min-width:68px}
@media(max-width:600px){
 body.plan #inline-chat{top:auto;bottom:calc(8px + env(safe-area-inset-bottom,0px));left:8px;right:8px;width:auto;max-width:calc(100vw - 16px);height:min(300px,38dvh);max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 74px);padding:10px 12px;border-radius:19px;box-shadow:0 12px 40px #091c4560}
 body.plan.chat-composing #inline-chat{top:var(--chat-keyboard-top,8px);bottom:auto;height:var(--chat-keyboard-height,210px);max-height:none}
 body.plan #inline-chat-messages{max-height:none;padding:9px 0;gap:7px}
 body.plan #inline-chat-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}
 body.plan #inline-chat-form[hidden]{display:none}
 body.plan #inline-chat:has(#inline-chat-form[hidden]){height:min(240px,38dvh)}
 body.plan #inline-chat-input{height:44px}
 body.plan #inline-chat-send{min-width:65px;min-height:44px;padding:8px 10px}
 body.plan.chat-open #walk-controls,body.plan.chat-open .maptools{visibility:hidden}
}

/* Voice is opt-in and its controls stay visible without opening a full panel. */
#voice-join{border:0;border-radius:11px;padding:9px 12px;background:#1652ff;color:#fff;font-weight:750;cursor:pointer}
#voice-hear{border:0;border-radius:11px;padding:9px 12px;background:#e9f0ff;color:#174cba;font-weight:750;cursor:pointer}
#voice-join:disabled{opacity:.65}
#voice-status{flex:1 1 100%;margin:0;color:#596982;font-size:11px;line-height:1.35}
.walk-settings #voice-mute,.walk-settings #voice-leave{font-weight:700;border-radius:10px;background:#e8f0ff;color:#174cba}
.walk-settings #voice-admin{font-weight:700;border-radius:10px;background:#ffe6ea;color:#a32845}
.walk-settings #voice-mute[hidden],.walk-settings #voice-leave[hidden],.walk-settings #voice-admin[hidden],#voice-join[hidden],#voice-hear[hidden]{display:none!important}
@media(max-width:600px){
 body.plan #voice-admin{display:none}
 body.plan.controls-expanded #voice-admin:not([hidden]){display:inline-flex}
 body.plan.voice-active .walk-settings{position:relative}
 body.plan.voice-active .walk-settings #voice-mute,body.plan.voice-active .walk-settings #voice-leave{position:absolute;top:calc(42px + 4px);z-index:4;min-height:32px;padding:6px 9px;box-shadow:0 4px 14px #14295330}
 body.plan.voice-active .walk-settings #voice-mute{right:79px}
 body.plan.voice-active .walk-settings #voice-leave{right:0}
 body.plan.controls-expanded.voice-active .walk-settings #voice-mute,body.plan.controls-expanded.voice-active .walk-settings #voice-leave{position:static}
 body.plan #live-panel #voice-join{max-width:100%;min-height:36px;font-size:12px}
}

/* Keep the walk clear on phones. The location and current trail stay visible;
   secondary world actions open through More when needed. */
@media(max-width:600px){
 body.plan{overscroll-behavior:none}
 body.plan #walkhud{top:calc(8px + env(safe-area-inset-top,0px));align-items:flex-start;gap:6px}
 body.plan .where{display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;justify-content:center;width:auto;min-width:0;max-width:none;height:auto;min-height:49px;padding:7px 10px;gap:2px}
 body.plan .where strong{display:block;width:100%;font-size:clamp(13px,3.7vw,16px);line-height:1.14;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
 body.plan .where #trail{display:block;max-width:100%;min-height:24px;margin:0;padding:1px 0;border:0;background:none;color:#1950bf;font-size:11px;font-weight:700;line-height:1.2;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.plan .where #trail:focus-visible{outline-offset:1px}
 body.plan .walk-settings{flex:0 0 auto;width:auto;min-width:0;max-width:58%;height:49px;min-height:49px;padding:3px;align-items:center;gap:2px}
 body.plan .walk-settings #happening,body.plan .walk-settings #world-more{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:5px 7px;font-size:11px;font-weight:700}
 body.plan .walk-settings #live-toggle:not([aria-pressed='true']),body.plan .walk-settings #live-roster-toggle{display:none}
 body.plan.controls-expanded .walk-settings #live-toggle:not([aria-pressed='true']),body.plan.controls-expanded .walk-settings #live-roster-toggle:not([hidden]){display:inline-flex}
 body.plan.controls-expanded .where{flex:1 1 100%;min-height:52px}
 body.plan.controls-expanded .walk-settings{flex:1 1 100%;width:100%;max-width:none;height:auto;min-height:44px;justify-content:flex-start;flex-wrap:wrap}
 body.plan.controls-expanded .walk-settings button{min-height:40px}
 body.plan #walk-controls{bottom:calc(10px + env(safe-area-inset-bottom,0px));left:calc(10px + env(safe-area-inset-left,0px));gap:10px}
 body.plan #joystick{width:82px;height:82px;flex:none}
 body.plan #joystick span{width:35px;height:35px}
 body.plan #interact{min-height:50px;padding:12px 17px;font-size:14px;font-weight:800;touch-action:manipulation}
 body.plan .maptools{right:calc(10px + env(safe-area-inset-right,0px));bottom:calc(10px + env(safe-area-inset-bottom,0px))}
 body.plan .maptools #places,body.plan .maptools #reset{min-width:46px;min-height:44px}
 body.plan #live-panel{top:calc(66px + env(safe-area-inset-top,0px))}
 body.plan #inline-chat{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 84px)}
 #inline-chat-close{width:40px;height:40px;flex:none}
 .inline-chat-row{font-size:14px;line-height:1.4}
}
@media(max-width:360px){
 body.plan .walk-settings{max-width:48%}
 body.plan .walk-settings #happening,body.plan .walk-settings #world-more{padding:5px 6px}
 body.plan #interact{padding:11px 13px}
}
.guide-report{display:grid;gap:12px;margin:16px 0}
.guide-report label{display:grid;gap:5px;font-weight:700;color:#142856}
.guide-report textarea{width:100%;min-height:72px;padding:10px 12px;border:1px solid #b9c9e8;border-radius:12px;background:#fff;color:#142856;font:inherit;resize:vertical}
.guide-report-preview{white-space:pre-wrap;overflow-wrap:anywhere;padding:14px;border:1px solid #b9c9e8;border-radius:12px;background:#f0f5ff;color:#142856;font:500 13px/1.5 system-ui,sans-serif}

/* Perspective world: the existing canvas keeps input and the map fallback. */
#explore-3d{display:none;position:fixed;inset:0;width:100vw;height:100dvh;pointer-events:none;z-index:1}
body.plan.world-3d #explore{opacity:0!important;pointer-events:auto}
body.plan.world-3d #explore-3d{display:block}
body:not(.plan) #explore-3d{display:none}

/* The top bar stays one row. Controls open a separate compact tray. */
body.plan #walkhud,body.plan.controls-expanded #walkhud{flex-wrap:nowrap;align-items:flex-start;z-index:26}
body.plan .walk-settings,body.plan.controls-expanded .walk-settings{position:relative;display:flex;flex:0 0 auto;width:auto;max-width:58%;height:48px;min-height:48px;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:3px;overflow:visible;padding:4px;background:#fffffff2;box-shadow:0 8px 28px #10264a20}
body.plan .walk-settings > button{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:7px 9px;font-size:12px;font-weight:750}
body.plan .walk-settings > #live-toggle{display:inline-flex!important;max-width:none;order:0;overflow:visible}
body.plan .walk-settings > #happening{order:1;width:auto;text-align:center}
body.plan .walk-settings > #world-more{display:inline-flex;order:2;color:#1652ff}
body.plan.controls-expanded .where{flex:1 1 auto;width:auto;max-width:none;height:auto;min-height:48px;display:flex;flex-direction:column;grid-template-columns:none;gap:2px}
body.plan.controls-expanded #place-action{display:none}
body.plan .world-controls-menu,body.plan.controls-expanded .world-controls-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:30;width:min(310px,calc(100vw - 20px));max-height:min(70dvh,540px);overflow-y:auto;display:grid;gap:11px;padding:14px;border:1px solid #cbd9f2;border-radius:18px;background:#fffffff8;box-shadow:0 18px 48px #10264a40;backdrop-filter:blur(16px)}
body.plan .world-controls-menu[hidden]{display:none!important}
.controls-menu-title{display:flex;align-items:center;justify-content:space-between;color:#142749;font:800 15px/1.2 system-ui,sans-serif}
body.plan .walk-settings .controls-menu-title button{font-size:23px;line-height:1;min-width:34px;min-height:34px;text-align:center}
.controls-menu-core,.controls-menu-extra{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
body.plan .walk-settings .world-controls-menu button,body.plan.controls-expanded .walk-settings .world-controls-menu button{display:flex;position:static;align-items:center;justify-content:center;min-width:0;max-width:none;min-height:42px;padding:9px 8px;border:1px solid #d6e2f7;border-radius:11px;background:#f2f6ff;color:#213d73;font:700 12px/1.2 system-ui,sans-serif;text-align:center;white-space:normal;box-shadow:none}
body.plan .walk-settings .world-controls-menu button[hidden],body.plan.controls-expanded .walk-settings .world-controls-menu button[hidden]{display:none!important}
body.plan .walk-settings .world-controls-menu #live-menu,body.plan .walk-settings .world-controls-menu #voice-shortcut{background:#1757e8;color:#fff;border-color:#1757e8}
body.plan .walk-settings .world-controls-menu #voice-shortcut[aria-pressed=true]{background:#137963;border-color:#137963}
body.plan .walk-settings .world-controls-menu #voice-leave{background:#fff0f4;color:#9b2450;border-color:#f0ccdb}
body.plan .walk-settings .world-controls-menu #live-roster-toggle{grid-column:1/-1}
body.plan .walk-settings .world-controls-menu #voice-join{display:none}
body.plan .walk-settings .world-controls-menu #voice-mute{display:none}
body.plan .walk-settings .world-controls-menu #voice-hear:not([hidden]){grid-column:1/-1}
#world-extra{border-top:1px solid #e3e9f4;padding-top:10px}
#world-extra summary{cursor:pointer;color:#315587;font:750 12px/1.4 system-ui,sans-serif;list-style:none;padding:5px 2px}
#world-extra summary::after{content:'  ⌄'}
#world-extra[open] summary::after{content:'  ⌃'}
.controls-menu-extra{padding-top:9px}
body.plan .walk-settings .world-controls-menu #voice-admin{grid-column:1/-1;background:#fff0f4;color:#9b2450}
body.plan #live-panel{z-index:25;top:calc(70px + env(safe-area-inset-top,0px));right:8px;bottom:auto;max-width:min(290px,calc(100vw - 16px))}
body.plan #live-panel[hidden]{display:none!important}
body.plan #live-panel .live-note{margin:3px 0;font-size:11px}
body.plan #voice-status{font-size:11px;margin:5px 0 0;color:#495f83}
@media(max-width:600px){
 body.plan #walkhud,body.plan.controls-expanded #walkhud{top:calc(8px + env(safe-area-inset-top,0px));left:8px;right:8px;gap:6px}
 body.plan .where,body.plan.controls-expanded .where{flex:1 1 auto;width:auto;max-width:none;min-width:0;min-height:48px;padding:7px 10px}
 body.plan .where strong{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.1}
 body.plan .walk-settings,body.plan.controls-expanded .walk-settings{flex:0 0 auto;max-width:59%;min-height:48px;height:48px;gap:1px}
 body.plan .walk-settings > button,body.plan.controls-expanded .walk-settings > button{min-height:39px;padding:6px 5px;font-size:11px}
 body.plan #live-panel{top:calc(70px + env(safe-area-inset-top,0px));bottom:auto}
}
@media(max-width:370px){body.plan .walk-settings > button,body.plan.controls-expanded .walk-settings > button{font-size:10px;padding:5px 4px}body.plan .walk-settings,body.plan.controls-expanded .walk-settings{max-width:61%}}
body.plan .walk-settings .world-controls-menu #surprise{display:flex}
@media(min-width:601px){body.plan .where,body.plan.controls-expanded .where{flex:0 1 340px;max-width:340px}}
body.plan.detail #walkhud,body.plan.gated #walkhud,body.plan.detail #walk-controls,body.plan.gated #walk-controls{display:none!important}

/* Visiting a resident should feel like a short encounter, not an empty full-screen form. */
body.plan #panel.looper-home,#panel.looper-home{height:auto;bottom:auto;max-height:calc(100dvh - 160px);padding:24px}
#panel.looper-home h2{margin:8px 0 6px}
#panel.looper-home #panelcontent>p{margin:8px 0 12px;max-width:31ch}
#panel.looper-home .looper-portrait{display:block;width:72px;height:72px;margin:6px 0 10px;border:3px solid #dde7fa;border-radius:20px;object-fit:cover;box-shadow:0 8px 20px #17295724}
#panel.looper-home .primary{border-radius:11px}
#panel.looper-home .looper-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 16px}
#panel.looper-home .looper-chat{border-top:1px solid #dce4f4;padding-top:12px}
#panel.looper-home .looper-chat h3{font-size:1.04rem;margin:0 0 4px}
#panel.looper-home .looper-chat>p{margin:0 0 10px}
#panel.looper-home .looper-messages{display:flex;flex-direction:column;gap:7px;max-height:190px;overflow:auto;overscroll-behavior:contain}
#panel.looper-home .looper-empty{margin:4px 0;color:#60708c;font-size:.9rem;line-height:1.45}
#panel.looper-home .looper-message{max-width:86%;padding:9px 12px;border-radius:14px;background:#edf3ff;color:#172848;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.91rem}
#panel.looper-home .looper-message.owner{align-self:flex-end;background:#1857ef;color:#fff}
#panel.looper-home .looper-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-top:10px;align-items:center}
#panel.looper-home .looper-compose input,#panel.looper-home .looper-compose textarea{display:block;width:100%;min-width:0;max-width:100%;font:inherit;padding:10px 12px;border:1px solid #b7c6e4;border-radius:11px}
#panel.looper-home .looper-compose textarea{min-height:88px;resize:vertical}
#panel.looper-home .looper-compose button{width:auto;min-width:0;min-height:44px;margin:0;white-space:nowrap}
#panel.looper-home .looper-compose input{min-height:44px;margin:0;background:white}
#panel.looper-home .looper-public-compose{grid-template-columns:minmax(0,1fr)}
#panel.looper-home .looper-public-compose button{width:100%}
#panel.looper-home .looper-chat-status{min-height:20px;margin:8px 0 0;color:#526587;font-size:.82rem;line-height:1.4}
/* Nearby guides have a direct conversation; the public chat stays in the HUD. */
#panel.guide-chat-view{height:auto;bottom:auto;max-height:calc(100dvh - 150px);padding:23px;display:flex;flex-direction:column}
#panel.guide-chat-view[hidden]{display:none}
#panel.guide-chat-view #panelcontent{display:flex;flex-direction:column;min-height:0}
#panel.guide-chat-view h2{margin:8px 0 2px}
#panel.guide-chat-view #panelcontent>p{margin:3px 0 10px}
#panel .guide-conversation{display:flex;flex-direction:column;min-height:190px;max-height:min(48dvh,390px);padding:11px;border:1px solid #d8e2f3;border-radius:16px;background:#f7f9ff}
#panel .guide-conversation>strong{font-size:12px;color:#34527c;margin:0 0 8px}
#panel .guide-messages{display:flex;flex-direction:column;gap:8px;min-height:90px;overflow-y:auto;overscroll-behavior:contain;flex:1;padding:4px 2px}
#panel .guide-message{max-width:87%;padding:9px 12px;border-radius:15px;background:white;color:#172848;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.4}
#panel .guide-message.mine{align-self:flex-end;background:#1652ff;color:white}
#panel .guide-message.theirs{align-self:flex-start;border:1px solid #dce4f3}
#panel .guide-empty{margin:auto;color:#61718e}
#panel .guide-status{font-size:11px;line-height:1.3;margin:6px 2px;color:#536784}
#panel .guide-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;margin-top:4px}
#panel .guide-compose input{min-width:0;margin:0;background:white;min-height:43px}
#panel .guide-compose button.primary{width:auto;min-height:43px;margin:0;padding:8px 13px;border-radius:10px}
#panel .guide-tools{margin-top:11px;border-top:0;padding-top:0}
#panel .guide-tools summary{font-size:12px;font-weight:700;color:#31548a}
@media(max-width:600px){body.plan #panel.guide-chat-view{top:calc(62px + env(safe-area-inset-top,0px));bottom:auto;max-height:calc(100dvh - 190px);padding:18px}#panel .guide-conversation{max-height:min(45dvh,350px)}}
@media(max-width:600px){body.plan.guide-composing #panel.guide-chat-view{top:var(--guide-top,8px);max-height:var(--guide-height,380px)}body.plan.guide-composing #panel .guide-conversation{min-height:120px;max-height:calc(var(--guide-height,380px) - 138px)}}
#panel.cinema-viewing{height:auto;bottom:auto;max-height:calc(100dvh - 90px);width:min(760px,calc(100vw - 30px));padding:24px;background:#f8f5ff}
#panel.cinema-viewing h2{font-size:clamp(23px,5vw,34px);margin:10px 0 4px}
#panel.cinema-viewing .cinema-viewing-stage{min-height:180px;margin:14px 0 10px;display:grid;place-items:center;border-radius:14px;overflow:hidden;background:#0d1735;color:#d5dcf8}
#panel.cinema-viewing .cinema-viewing-player{display:block;width:100%;aspect-ratio:16/9;border:0;background:#0d1735}
#panel.cinema-viewing .secondary{display:inline-block;margin-top:2px}
@media(max-width:600px){body.plan #panel.cinema-viewing{top:calc(54px + env(safe-area-inset-top,0px));bottom:auto;left:8px;right:8px;width:auto;max-height:calc(100dvh - 160px);padding:16px}#panel.cinema-viewing .cinema-viewing-stage{min-height:0}}
/* Collected crystals become a small place album, opened deliberately from Controls. */
#panel .collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0 21px}
#panel .collection-stamp{display:flex;align-items:center;gap:8px;min-width:0;padding:11px 10px;border:1px dashed #c8d6ed;border-radius:12px;color:#697992;background:#f7f9fd;font-size:12px;font-weight:700}
#panel .collection-stamp.collected{border-style:solid;border-color:#8fd4c9;background:#e8f8f4;color:#176655}
#panel .collection-mark{font-size:18px;line-height:1;color:#9faeca}
#panel .collection-stamp.collected .collection-mark{color:#168f78}
body.plan .walk-settings .world-controls-menu #finds{grid-column:1/-1;background:#e8f8f4;color:#176655;border-color:#a6ddce}
@media(max-width:600px){#panel.looper-home .looper-compose{display:grid;grid-template-columns:minmax(0,1fr)}#panel.looper-home .looper-compose textarea,#panel.looper-home .looper-compose input,#panel.looper-home .looper-compose button{width:100%;margin:0;min-width:0;max-width:100%}#panel.looper-home .looper-compose textarea{height:auto;min-height:88px}}
@media(max-width:600px){body.plan #panel.looper-home{top:calc(78px + env(safe-area-inset-top,0px));left:12px;right:12px;max-height:calc(100dvh - 184px);padding:22px}}

/* Walk mode has one place label and one action row. The island-wide ribbon is
   for map browsing; Places remains the deliberate destination picker here. */
body.plan .district-dock{display:none}
body.plan #walkhud,body.plan.controls-expanded #walkhud{left:clamp(10px,2vw,24px);right:clamp(10px,2vw,24px);gap:8px}
body.plan .where,body.plan.controls-expanded .where{flex:0 1 auto;width:auto;max-width:min(245px,42vw);min-height:46px;height:46px;padding:6px 12px;border-radius:15px;box-shadow:0 6px 22px #10264a1d}
body.plan .where,body.plan.controls-expanded .where{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;overflow:hidden}
body.plan .where .eyebrow,body.plan #place-sub,body.plan #place-action,body.plan.controls-expanded #place-action{display:none}
body.plan .where strong{font-size:14px;line-height:1.08}
body.plan .where #trail{font-size:10px;min-height:17px;line-height:1.1}
body.plan .walk-settings,body.plan.controls-expanded .walk-settings{min-height:46px;height:46px;max-width:none;gap:2px;padding:4px;border-radius:15px;box-shadow:0 6px 22px #10264a1d}
body.plan .walk-settings > #live-toggle,body.plan .walk-settings > #happening,body.plan .walk-settings > #world-more{min-height:36px;padding:7px 10px;border-radius:10px;font-size:11px;white-space:nowrap}
body.plan .walk-settings > #live-toggle[aria-pressed="true"]{background:#7034cf;color:#fff}
body.plan .walk-settings > #live-toggle[aria-pressed="true"]::after{content:attr(data-neighbors);display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:5px;padding:0 4px;border-radius:99px;background:#ffffff29;color:#fff;font-size:10px;line-height:1}
body.plan .walk-settings > #happening[aria-expanded="true"],body.plan .walk-settings > #world-more[aria-expanded="true"]{background:#e8efff;color:#153f98}
body.plan .world-controls-menu,body.plan.controls-expanded .world-controls-menu{width:min(272px,calc(100vw - 20px));max-height:min(63dvh,420px);gap:9px;padding:11px;border-radius:16px}
body.plan .walk-settings .world-controls-menu #summon-loopers{background:#e9e2ff;border-color:#d5c4ff;color:#4c278f}
body.plan .walk-settings .world-controls-menu #summon-loopers[aria-pressed="true"]{background:#4c278f;color:#fff}
body.plan .walk-settings .world-controls-menu #finds{grid-column:auto}
body.plan .world-controls-menu #live-menu,body.plan .world-controls-menu #chat-menu{display:none!important}
body.plan .maptools{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:clamp(10px,2vw,24px);z-index:2}
@media(max-width:600px){
 body.plan #walkhud,body.plan.controls-expanded #walkhud{left:8px;right:8px;gap:6px}
 body.plan .where,body.plan.controls-expanded .where{flex:1 1 auto;min-width:0;max-width:none;min-height:46px;height:46px;padding:6px 9px}
 body.plan .where strong{font-size:12px}
 body.plan .walk-settings,body.plan.controls-expanded .walk-settings{flex:0 0 auto;max-width:63%;min-height:46px;height:46px;padding:3px;gap:0}
 body.plan .walk-settings > #live-toggle,body.plan .walk-settings > #happening,body.plan .walk-settings > #world-more{min-height:38px;padding:6px 6px;font-size:10px}
 body.plan .walk-settings > #happening{font-size:0}
 body.plan .walk-settings > #happening::after{font-size:10px}
 body.plan #walk-controls{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
 body.plan .maptools{bottom:calc(12px + env(safe-area-inset-bottom,0px));right:8px}
}
@media(max-width:360px){body.plan .walk-settings,body.plan.controls-expanded .walk-settings{max-width:66%}body.plan .walk-settings > #live-toggle,body.plan .walk-settings > #happening,body.plan .walk-settings > #world-more{padding-inline:4px;font-size:9px}}

/* Keep the overflow menu a real finger-sized target above the 3D/video layers. */
body.plan #walkhud{isolation:isolate}
body.plan .walk-settings > #world-more{min-width:48px;min-height:44px;touch-action:manipulation;user-select:none;-webkit-user-select:none}
body.plan .world-controls-menu{pointer-events:auto;touch-action:pan-y}

/* The illustrated-map conversation is a bounded sheet. Only messages scroll;
   the send form stays visible even on a short desktop window. Walk mode uses
   the same inline conversation reached from Chat. */
#panel.world-chat-view{overflow:hidden;min-height:0;padding:20px 18px 16px;bottom:12px}
#panel.world-chat-view #panelcontent{min-height:0;height:100%;overflow:hidden}
#panel.world-chat-view #panelcontent>.eyebrow,#panel.world-chat-view #panelcontent>h2,#panel.world-chat-view #panelcontent>p{flex:none}
#panel.world-chat-view #panelcontent>.eyebrow{margin:0 34px 2px 0}
#panel.world-chat-view #panelcontent>h2{font-size:24px;line-height:1.1;margin:4px 34px 5px 0}
#panel.world-chat-view #panelcontent>p{margin:0 0 9px;line-height:1.35}
#panel.world-chat-view .world-chat-list{flex:1 1 0;min-height:0;overflow-y:auto}
#panel.world-chat-view .world-chat-status{flex:none;min-height:0;margin:4px 0}
#panel.world-chat-view .world-chat-form{flex:none;gap:5px;margin:0;padding-top:9px;border-top:1px solid #dce6f7}
#panel.world-chat-view .world-chat-form label{gap:3px}
#panel.world-chat-view .world-chat-form textarea{min-height:58px;height:58px;max-height:58px;margin:0;resize:none}
#panel.world-chat-view .world-chat-actions button{margin:0;min-height:40px;padding:8px 12px}
@media(max-width:600px){#panel.world-chat-view{top:calc(8px + env(safe-area-inset-top,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px));padding:16px 13px 12px}}

/* Two personal routes live on the arrival card and at the top of Places. */
.arrival-shortcuts{display:flex;gap:7px;margin-top:10px;pointer-events:auto}
.arrival-shortcuts button{flex:1;min-width:0;min-height:38px;padding:7px 9px;border:1px solid #cedcf7;border-radius:10px;background:#f7faff;color:#1648ad;font-size:11px;font-weight:750;white-space:nowrap}
.arrival-shortcuts button:hover{background:#eaf1ff}
#panel .places-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:4px 0 12px}
#panel .places-shortcuts button{min-width:0;min-height:43px;margin:0;padding:8px;border-color:#cbd9f4;border-radius:10px;background:#edf3ff;color:#1846a4;font-size:11px;line-height:1.2;white-space:normal}
@media(max-width:600px){
 body:not(.plan) .intro .arrival-shortcuts{grid-column:1/-1;grid-row:4;margin-top:7px}
 body:not(.plan) .intro .arrival-shortcuts button{min-height:34px;padding:6px;font-size:10px}
 #panel .places-shortcuts button{font-size:10px}
}

/* Summoning belongs beside Interact, not behind a second control panel. */
body.plan #summon-direct{min-height:44px;padding:10px 15px;border:1px solid #d6c9fa;border-radius:24px;background:#eee8ff;color:#512b9b;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 6px 20px #3d268d22}
body.plan #summon-direct[aria-pressed="true"]{background:#522b9d;color:#fff}
@media(max-width:600px){body.plan #summon-direct{min-height:43px;padding:9px 10px;font-size:11px}}
@media(max-width:360px){body.plan #summon-direct{position:absolute;left:77px;bottom:73px;padding:7px 9px;font-size:10px;min-height:34px}}

/* Keep the two actions together and leave the scene clear. Keyboard guidance
   remains available to screen readers and on the Interact tooltip. */
body.plan .walk-action-pair{display:flex;align-items:center;gap:4px;padding:4px;border:1px solid #ffffffdb;border-radius:30px;background:#ffffffe0;box-shadow:0 8px 25px #17345a2e;backdrop-filter:blur(12px)}
body.plan .walk-action-pair #interact,body.plan .walk-action-pair #summon-direct{min-height:42px;box-shadow:none}
body.plan .walk-hint{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;clip-path:inset(50%);border:0}
@media(max-width:600px){body.plan #walk-controls{gap:7px}body.plan .walk-action-pair{gap:2px;padding:3px}body.plan .walk-action-pair #interact{padding:9px 12px}body.plan .walk-action-pair #summon-direct{padding:9px 10px;font-size:11px}}
@media(max-width:360px){body.plan .walk-action-pair{flex-direction:column;align-items:stretch;border-radius:19px}body.plan .walk-action-pair #summon-direct{position:static;min-height:32px;font-size:10px}body.plan .walk-action-pair #interact{min-height:36px}}
.looper-access-wallet{display:block;max-width:100%;margin:8px 0;padding:10px;border:1px solid #d5dff1;border-radius:9px;background:#f3f6fc;color:#233963;font-size:12px;overflow-wrap:anywhere}
#panel.looper-directory{width:min(460px,calc(100vw - 24px));height:auto;bottom:auto;max-height:calc(100dvh - 150px);padding:20px;overflow-y:auto}
#panel.looper-directory h2{font-size:clamp(25px,3vw,34px);margin:9px 30px 6px}
#panel.looper-directory .card{margin:8px 0;padding:12px}
#panel.looper-directory .card h3{margin:4px 0 1px}
#panel.looper-directory .card p{margin:0 0 5px;font-size:12px}
#panel.looper-directory .card .primary{min-height:40px;margin:5px 0 0;padding:9px 12px}
#panel.looper-directory .looper-directory-access{padding:9px 11px;border-radius:10px;background:#f1f5ff;color:#26436d;font-size:12px}
@media(max-width:600px){body.plan #panel.looper-directory,#panel.looper-directory{top:calc(78px + env(safe-area-inset-top,0px));left:12px;right:12px;max-height:calc(100dvh - 184px);padding:17px}#panel.looper-directory .card{padding:10px}#panel.looper-directory .card .primary{min-height:36px}}

/* Public chat keeps the composer anchored; history is the only scroll area. */
#inline-chat{height:min(390px,55dvh);min-height:190px;overflow:hidden}
#inline-chat-messages{flex:1 1 0;min-height:0;overflow-y:auto}
#inline-chat-form,#inline-chat-signin,#inline-chat-status{flex:none}
@media(max-width:600px){body.plan #inline-chat{height:min(255px,34dvh);min-height:190px}body.plan.chat-composing #inline-chat{height:var(--chat-keyboard-height,210px)}}

/* The public Looper request is a quick note, with Send in reach at the bottom
   of its scrollable place card. Private Looper chat keeps its roomier input. */
#panel.looper-home .looper-public-compose{position:sticky;bottom:0;z-index:2;gap:7px;margin-top:8px;padding:8px 0 4px;background:#fffefc;box-shadow:0 -6px 18px #fffefc}
#panel.looper-home .looper-public-compose textarea{height:56px;min-height:56px;max-height:56px;margin:0;resize:none}
#panel.looper-home .looper-public-compose button{min-height:42px;margin:0}
@media(min-width:601px){#panel.looper-home .looper-public-compose{grid-template-columns:minmax(0,1fr) auto;align-items:end}#panel.looper-home .looper-public-compose button{width:auto;min-width:122px;height:56px}}
@media(max-width:600px){#panel.looper-home .looper-public-compose textarea{height:54px;min-height:54px;max-height:54px}}

/* A plot visit is a small room with its own look and useful doors, not a blank profile card. */
body.plan #panel.space-home,#panel.space-home{width:min(510px,calc(100vw - 24px));height:auto;bottom:auto;max-height:calc(100dvh - 150px);padding:20px;overflow:auto}
#panel.space-home h2{font-size:clamp(24px,2.6vw,34px);margin:8px 32px 14px;line-height:1.08}
#panel.space-home .space-scene{--wall:#dfeeda;--floor:#b9d9be;--accent:#408d75;position:relative;height:210px;margin:0 0 16px;overflow:hidden;border:1px solid #b7cde1;border-radius:18px;background:linear-gradient(178deg,var(--wall) 0 59%,var(--floor) 59% 100%);isolation:isolate}
#panel.space-home .space-sunset{--wall:#f6d0bc;--floor:#ebb797;--accent:#d66483}
#panel.space-home .space-neon{--wall:#d8d4ef;--floor:#a9a0da;--accent:#6951b7}
#panel.space-home .space-scene:before{content:'';position:absolute;left:-10%;right:-10%;top:59%;height:1px;background:#ffffffa6;box-shadow:0 22px 0 #ffffff60,0 45px 0 #ffffff50}
#panel.space-home .space-scene-window{position:absolute;left:9%;top:12%;width:28%;height:40%;border:9px solid #f7f8f5;box-shadow:0 7px 18px #3258772b;background:linear-gradient(135deg,#a7d8e7,#c7ebf1 48%,#86b9c9)}
#panel.space-home .space-scene-light{position:absolute;right:14%;top:13%;width:30%;height:30%;border-radius:50%;background:#fff5c6;filter:blur(5px);opacity:.62}
#panel.space-home .space-scene-table{position:absolute;left:43%;bottom:18%;width:38%;height:14%;border-radius:8px;background:var(--accent);transform:skewY(-7deg);box-shadow:0 14px 0 #3e567b55,0 28px 20px #263e5936}
#panel.space-home .space-scene-seat{position:absolute;left:19%;bottom:13%;width:22%;height:19%;border-radius:9px;background:#fff5e7;border:6px solid var(--accent);box-shadow:0 9px 0 #6f5f6970}
#panel.space-home .space-scene-plant{position:absolute;right:8%;bottom:16%;width:14%;height:28%;border-radius:54% 48% 42% 55%;background:#4c9d79;box-shadow:-12px 15px 0 #72bb93,0 24px 0 -5px #865e4c}
#panel.space-home .space-scene-sign{position:absolute;right:9%;top:14%;max-width:42%;padding:7px 10px;border-radius:7px;background:#172846e8;color:#fff;font-size:12px;line-height:1.2;overflow-wrap:anywhere}
#panel.space-home .space-visit-info{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;color:#203452;font-size:13px}
#panel.space-home .space-visit-info span{color:#60718e}
#panel.space-home .space-visit-copy{margin:10px 0 0;color:#51627e}
#panel.space-home .space-visit-actions{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}
#panel.space-home .space-visit-actions .primary{margin:0;border-radius:11px}
#panel.space-home .space-visit-offers h3{margin:10px 0}
#panel.space-home .space-leave{margin-top:14px}
@media(max-width:600px){body.plan #panel.space-home{top:calc(58px + env(safe-area-inset-top,0px));left:12px;right:12px;bottom:auto;max-height:calc(100dvh - 126px);padding:16px}#panel.space-home .space-scene{height:190px}#panel.space-home h2{font-size:25px}}