.plaza-view{position:relative;min-height:100svh;overflow:hidden;padding:88px clamp(16px,3vw,46px) 24px;background:#09142f;color:#f5fbff;image-rendering:pixelated}
.pixel-dog{display:block!important;padding:0!important;border:0!important;background:transparent!important}
.plaza-sky{position:absolute;inset:0 0 38%;overflow:hidden;background:linear-gradient(#187ed5,#52c8ef 58%,#ffd8ad);transition:filter .8s,background .8s}.plaza-sky:after{position:absolute;right:12%;top:16%;width:68px;height:68px;background:#fff0a8;box-shadow:0 0 0 9px #fff2a52b,0 0 60px #ffe889;content:""}.plaza-sky i{position:absolute;width:120px;height:20px;background:#e9fbff;box-shadow:30px -14px #e9fbff,65px 2px #e9fbff;animation:plazaCloud 23s linear infinite}.plaza-sky i:nth-child(1){left:-20%;top:19%}.plaza-sky i:nth-child(2){left:32%;top:31%;animation-duration:34s;transform:scale(.7)}.plaza-sky i:nth-child(3){left:78%;top:12%;animation-duration:28s;transform:scale(1.25)}
.plaza-view.night .plaza-sky{background:linear-gradient(#05091f,#141b55 68%,#6b3975)}.plaza-view.night .plaza-sky:after{border-radius:50%;background:#d8ecff;box-shadow:0 0 32px #9ec7ff}.plaza-view.rain .plaza-sky{filter:saturate(.55) brightness(.72)}.plaza-weather{position:absolute;z-index:6;inset:0;pointer-events:none;opacity:0;background-image:repeating-linear-gradient(105deg,transparent 0 28px,#d6f4ffb8 29px,#d6f4ffb8 30px,transparent 31px 62px);background-size:90px 130px;animation:plazaRain .65s linear infinite}.plaza-view.rain .plaza-weather{opacity:.5}
.plaza-hud{position:relative;z-index:9;display:flex;align-items:center;justify-content:space-between;max-width:1500px;margin:auto}.plaza-hud small{color:#8eeaff;font:8px "DM Mono",monospace;letter-spacing:.14em}.plaza-hud h1{margin:4px 0 0;font-size:clamp(24px,3vw,42px)}.plaza-live{display:grid;grid-template-columns:auto auto;align-items:center;gap:0 9px;padding:10px 14px;border:2px solid #0d2447;background:#081329dd;box-shadow:5px 5px 0 #030817}.plaza-live span{width:8px;height:8px;background:#73ffb8;box-shadow:0 0 12px #73ffb8;animation:pulse 1.2s infinite}.plaza-live b{font:22px "DM Mono",monospace}.plaza-live small{grid-column:1/3;color:#7896a9;font-size:7px}
.plaza-world{position:relative;z-index:3;height:min(650px,67vh);min-height:500px;max-width:1500px;margin:12px auto 0;overflow:hidden;border:4px solid #0a1832;background:linear-gradient(180deg,transparent 0 44%,#4c88a6 44% 47%,#30496b 47% 50%,#172745 50%);box-shadow:0 14px 0 #030817,0 26px 70px #0008}.plaza-world:before{position:absolute;inset:47% 0 0;content:"";background:linear-gradient(90deg,#ffffff08 1px,transparent 1px),linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(135deg,#172945,#293f64);background-size:54px 54px,54px 54px,auto;transform:perspective(600px) rotateX(58deg) scale(1.45);transform-origin:top}.plaza-ground{position:absolute;right:0;bottom:0;left:0;height:15%;border-top:8px solid #62ddc2;background:repeating-linear-gradient(90deg,#113446 0 38px,#153c50 38px 76px);clip-path:polygon(0 32%,100% 0,100% 100%,0 100%)}
.plaza-place{position:absolute;z-index:4;display:grid;place-items:center;min-width:150px;min-height:125px;border:4px solid #071229;background:#192b58;color:#fff;box-shadow:8px 8px 0 #06091c;cursor:pointer;transition:.18s}.plaza-place:hover{transform:translateY(-7px);filter:brightness(1.18)}.plaza-place i{display:grid;width:52px;height:52px;place-items:center;border:3px solid #88f4ff;background:#10294c;box-shadow:4px 4px 0 #030817;color:#8ff6ff;font-style:normal;font-size:25px}.plaza-place b{font-size:12px}.place-gear{left:3%;top:25%;background:#23435f}.place-arena{left:25%;top:9%;min-width:240px;min-height:165px;background:#4d236f;border-color:#24103c}.place-arena i{border-color:#ff8fdc;color:#ff8fdc}.place-travel{right:21%;top:18%;background:#123f6d}.place-home{right:3%;top:30%;background:#315649}.plaza-treasury{position:absolute;z-index:5;left:52%;top:30%;display:flex;align-items:center;gap:10px;padding:11px;border:3px solid #092138;background:#172d4c;box-shadow:6px 6px #05091b}.plaza-treasury>i{display:grid;width:40px;height:40px;place-items:center;background:#74f1d0;color:#092032;font:bold 23px "DM Mono"}.plaza-treasury span,.plaza-treasury small{display:block}.plaza-treasury span{font-size:10px}.plaza-treasury small{margin-top:3px;color:#7f9bad;font-size:7px}
.plaza-dogs{position:absolute;z-index:7;inset:0}.pixel-dog{position:absolute;left:var(--dog-x);top:var(--dog-y);width:70px;height:62px;filter:drop-shadow(5px 8px 0 #02081755);transform:translate(-50%,-50%);transition:left .7s linear,top .7s linear;cursor:pointer}.pixel-dog .body{position:absolute;left:17px;top:27px;width:43px;height:26px;border:4px solid #071229;background:hsl(var(--coat) 72% 58%);box-shadow:inset 9px 0 #ffffff35}.pixel-dog .head{position:absolute;left:0;top:9px;width:34px;height:34px;border:4px solid #071229;background:hsl(var(--coat) 76% 66%)}.pixel-dog .head:before,.pixel-dog .head:after{position:absolute;top:-13px;width:10px;height:13px;border:3px solid #071229;border-bottom:0;background:hsl(var(--coat) 76% 66%);content:""}.pixel-dog .head:before{left:0}.pixel-dog .head:after{right:0}.pixel-dog .face{position:absolute;left:8px;top:14px;width:5px;height:5px;background:#071229;box-shadow:14px 0 #071229,7px 9px 0 1px #fff}.pixel-dog .tail{position:absolute;right:0;top:20px;width:13px;height:10px;border:4px solid #071229;border-left:0;background:hsl(var(--coat) 76% 66%);transform:rotate(-30deg);transform-origin:left}.pixel-dog .legs{position:absolute;left:24px;top:50px;width:9px;height:12px;background:#071229;box-shadow:22px 0 #071229}.pixel-dog strong{position:absolute;left:50%;bottom:-23px;padding:3px 6px;border:2px solid #071229;background:#f8fbff;color:#08142b;font:8px "DM Mono";white-space:nowrap;transform:translateX(-50%)}.pixel-dog em{position:absolute;left:50%;top:-27px;display:none;max-width:140px;padding:5px 7px;border:2px solid #071229;background:#fff;color:#101a35;font:normal 8px sans-serif;white-space:nowrap;transform:translateX(-50%)}.pixel-dog.talking em{display:block}.pixel-dog[data-action="wave"] .head{animation:dogWave .6s infinite alternate}.pixel-dog[data-action="play"]{animation:dogPlay .75s infinite}.pixel-dog[data-action="dance"]{animation:dogDance .5s infinite steps(2)}.pixel-dog[data-action="zoom"]{animation:dogZoom 1.5s infinite}.pixel-dog[data-action="nap"]{transform:translate(-50%,-50%) rotate(8deg) scaleY(.72)}.pixel-dog.mine strong{background:#72f4d0}.pixel-dog.target{filter:drop-shadow(0 0 12px #ff87e9) drop-shadow(5px 8px 0 #02081755)}
.plaza-console{position:relative;z-index:10;display:grid;grid-template-columns:minmax(250px,1fr) 1.5fr;gap:10px;max-width:1500px;margin:24px auto 0}.plaza-feed,.plaza-controls{border:3px solid #0a1832;background:#07142a;box-shadow:6px 6px #020612}.plaza-feed header{display:flex;justify-content:space-between;padding:8px 11px;border-bottom:2px solid #142849;font-size:9px}.plaza-feed header span{color:#6dcfb7}.plaza-feed>div{display:flex;gap:8px;overflow:auto;padding:10px;white-space:nowrap}.plaza-feed p{margin:0;color:#91a9b7;font-size:9px}.plaza-feed article{padding:5px 8px;background:#102341;color:#cce8f3;font-size:8px}.plaza-controls{padding:10px}.plaza-actions{display:flex;gap:7px;overflow:auto}.plaza-actions button,#plaza-chat button{border:2px solid #234b6b;background:#17355a;color:#dffbff;box-shadow:3px 3px #020713;cursor:pointer;font-size:9px}.plaza-actions button{padding:8px 12px}.plaza-actions button:hover{background:#633071;border-color:#ff8ee5}#plaza-chat{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:9px}#plaza-chat input{min-width:0;padding:9px 11px;border:2px solid #1e3855;background:#030b1b;color:#fff}#plaza-chat button{padding:0 18px;background:#287e74}
.plaza-world{background:#142848 url("./assets/plaza-city-day-v1.png") center/cover no-repeat}.plaza-world:before,.plaza-ground{display:none}.plaza-world:after{position:absolute;z-index:12;inset:0;content:"";pointer-events:none;background:linear-gradient(0deg,#04102760,transparent 34%);transition:background .8s}.plaza-view.night .plaza-world:after{background:linear-gradient(#06102aa8,#11174770 43%,#030b1bb5),radial-gradient(circle at 68% 28%,#725cff42,transparent 30%);mix-blend-mode:multiply}.plaza-view.rain .plaza-world:after{background:linear-gradient(#16304d78,#07132960),linear-gradient(100deg,transparent,#8ddfff26)}
.plaza-place{min-width:0;min-height:0;width:132px;height:82px;border:0;background:transparent;box-shadow:none;place-content:end center}.plaza-place i{width:32px;height:32px;border:2px solid #dffcff;background:#061329dc;box-shadow:3px 3px #020817;font-size:15px}.plaza-place b{margin-top:5px;padding:5px 8px;border:2px solid #071229;background:#071329e8;box-shadow:3px 3px #020817;font-size:9px}.plaza-place:hover{background:#67e8ff1a;outline:2px solid #8af3ff;transform:translateY(-3px)}.place-gear{left:0;top:14%;background:transparent}.place-arena{left:20%;top:5%;width:260px;height:200px;background:transparent}.place-travel{right:29%;top:8%;width:190px;height:190px;background:transparent}.place-home{right:0;top:16%;width:210px;height:190px;background:transparent}.plaza-treasury{left:47%;top:29%;padding:6px;border-width:2px;box-shadow:3px 3px #05091b}.plaza-treasury>i{width:26px;height:26px;font-size:15px}.plaza-treasury span{font-size:8px}.plaza-treasury small{display:none}
@keyframes plazaCloud{to{left:115%}}@keyframes plazaRain{to{background-position:-35px 130px}}@keyframes dogWave{to{transform:rotate(-12deg)}}@keyframes dogPlay{50%{transform:translate(-50%,-68%) rotate(-4deg)}}@keyframes dogDance{50%{transform:translate(-50%,-50%) rotate(8deg) scaleX(-1)}}@keyframes dogZoom{0%,100%{margin-left:-18px}50%{margin-left:18px}}@media(max-width:760px){.plaza-view{padding:72px 10px 18px}.plaza-hud h1{font-size:22px}.plaza-world{height:570px}.plaza-place{min-width:104px;min-height:92px}.place-arena{left:4%;top:8%;min-width:150px;min-height:120px}.place-gear{left:3%;top:34%}.place-travel{right:3%;top:15%}.place-home{right:4%;top:38%}.plaza-treasury{left:33%;top:31%}.plaza-console{grid-template-columns:1fr}.pixel-dog{transform:translate(-50%,-50%) scale(.85)}}

/* The facilities are holographic signs mounted over the existing city art.
   Their hit areas stay generous, while no rectangular UI surface is painted. */
.city-art-loading .plaza-place{visibility:hidden;opacity:0!important}
.city-art-ready .plaza-place{animation:facilityWake .64s cubic-bezier(.18,.82,.22,1) both;animation-delay:var(--entry-delay)}
.city-art-error .plaza-place{visibility:visible;opacity:1}
.plaza-place{--facility:#72efff;--facility-rgb:114,239,255;--entry-delay:.08s;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-end!important;padding:0;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;filter:none;isolation:isolate;overflow:visible;color:#efffff;transform-origin:50% 78%;transition:transform .22s cubic-bezier(.2,.8,.2,1),filter .22s}
.plaza-place.place-arena{--facility:#f28fff;--facility-rgb:242,143,255;--entry-delay:.18s}
.plaza-place.place-travel{--facility:#70bfff;--facility-rgb:112,191,255;--entry-delay:.28s}
.plaza-place.place-home{--facility:#7affc6;--facility-rgb:122,255,198;--entry-delay:.38s}
.plaza-place:before,.plaza-place:after{position:absolute;left:50%;content:"";pointer-events:none;transform:translateX(-50%)}
.plaza-place:before{bottom:34px;width:52px;height:16px;border:1px solid rgba(var(--facility-rgb),.7);border-radius:50%;background:radial-gradient(ellipse,rgba(var(--facility-rgb),.34),transparent 68%);box-shadow:0 0 18px rgba(var(--facility-rgb),.48);animation:facilityGround 2.2s ease-in-out infinite}
.plaza-place:after{bottom:40px;width:2px;height:46px;background:linear-gradient(transparent,var(--facility),transparent);box-shadow:0 0 12px var(--facility);opacity:.52;animation:facilityScan 2.6s ease-in-out infinite}
.plaza-place i{position:relative;z-index:2;display:grid!important;width:35px!important;height:35px!important;flex:none;place-items:center;border:1px solid color-mix(in srgb,var(--facility) 82%,white)!important;border-radius:50%;background:radial-gradient(circle at 38% 30%,rgba(var(--facility-rgb),.36),#061427e8 63%)!important;box-shadow:0 0 0 4px rgba(var(--facility-rgb),.08),0 0 20px rgba(var(--facility-rgb),.62),inset 0 0 12px rgba(var(--facility-rgb),.25)!important;color:var(--facility)!important;font:normal 16px/1 "DM Mono",monospace!important;text-shadow:0 0 9px var(--facility);animation:facilityBeacon 1.8s ease-in-out infinite}
.plaza-place i:before,.plaza-place i:after{position:absolute;inset:-7px;border:1px dashed rgba(var(--facility-rgb),.58);border-radius:50%;content:"";animation:facilityOrbit 8s linear infinite}.plaza-place i:after{inset:-12px;border-style:solid;border-color:transparent var(--facility);opacity:.35;animation-duration:4.5s;animation-direction:reverse}
.plaza-place b{position:relative;z-index:3;display:grid;min-width:92px;margin-top:7px!important;padding:6px 10px 5px!important;border:1px solid rgba(var(--facility-rgb),.58)!important;border-radius:3px;background:linear-gradient(90deg,#031022e8,#071a30f2 52%,#031022e8)!important;box-shadow:0 5px 16px #0009,0 0 14px rgba(var(--facility-rgb),.15)!important;color:#f3ffff;font:700 9px/1.15 "Noto Sans SC",sans-serif!important;letter-spacing:.05em;text-align:center;white-space:nowrap;clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%,0 7px)}
.plaza-place b:before{position:absolute;top:0;left:15%;width:70%;height:1px;background:var(--facility);box-shadow:0 0 8px var(--facility);content:"";animation:facilityLabel 2.4s ease-in-out infinite}
.plaza-place b small{display:block;max-height:0;margin-top:0;overflow:hidden;color:color-mix(in srgb,var(--facility) 80%,white);font:500 7px/1.25 "DM Mono",monospace;letter-spacing:.02em;opacity:0;transform:translateY(-2px);transition:max-height .22s,margin-top .22s,opacity .18s,transform .22s}
.plaza-place>em{position:absolute;z-index:1;bottom:4px;width:70%;height:52%;border-right:1px solid rgba(var(--facility-rgb),.18);border-left:1px solid rgba(var(--facility-rgb),.18);background:linear-gradient(90deg,transparent,rgba(var(--facility-rgb),.09),transparent);clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);opacity:.45;pointer-events:none;animation:facilityRay 2.8s ease-in-out infinite}
.plaza-place:hover,.plaza-place:focus-visible{background:transparent!important;outline:0!important;filter:drop-shadow(0 0 9px rgba(var(--facility-rgb),.52));transform:translateY(-4px) scale(1.04)}
.plaza-place:hover i,.plaza-place:focus-visible i{box-shadow:0 0 0 7px rgba(var(--facility-rgb),.12),0 0 32px rgba(var(--facility-rgb),.88),inset 0 0 16px rgba(var(--facility-rgb),.38)!important;animation-duration:.72s}
.plaza-place:hover b,.plaza-place:focus-visible b{border-color:var(--facility)!important;background:linear-gradient(90deg,#04152cf5,#0b2340fa,#04152cf5)!important;box-shadow:0 7px 22px #000b,0 0 21px rgba(var(--facility-rgb),.34)!important}
.plaza-place:hover b small,.plaza-place:focus-visible b small{max-height:14px;margin-top:4px;opacity:1;transform:none}
.plaza-place:hover:before,.plaza-place:focus-visible:before{animation-duration:.7s;box-shadow:0 0 30px rgba(var(--facility-rgb),.8)}
@keyframes facilityWake{0%{visibility:visible;opacity:0;filter:blur(5px);transform:translateY(13px) scale(.82)}55%{opacity:1}100%{visibility:visible;opacity:1;filter:none;transform:none}}
@keyframes facilityBeacon{50%{filter:brightness(1.24);transform:translateY(-2px)}}
@keyframes facilityOrbit{to{transform:rotate(1turn)}}
@keyframes facilityGround{50%{opacity:.48;transform:translateX(-50%) scaleX(1.28)}}
@keyframes facilityScan{0%,100%{opacity:.2;transform:translate(-50%,8px) scaleY(.72)}50%{opacity:.72;transform:translate(-50%,-3px) scaleY(1.1)}}
@keyframes facilityLabel{50%{left:3%;width:94%;opacity:.45}}
@keyframes facilityRay{50%{opacity:.75;filter:brightness(1.4)}}
@media(max-width:760px){.plaza-place{width:108px!important;height:102px!important;min-width:0!important;min-height:0!important}.place-arena{left:2%!important;top:5%!important}.place-gear{left:0!important;top:31%!important}.place-travel{right:2%!important;top:13%!important}.place-home{right:1%!important;top:36%!important}.plaza-place b{min-width:82px;padding:5px 7px!important;font-size:8px!important}.plaza-place b small{display:none}.plaza-place:before{bottom:29px}.plaza-place:after{bottom:35px;height:39px}.plaza-place>em{bottom:2px}}
@media(prefers-reduced-motion:reduce){.city-art-ready .plaza-place,.plaza-place:before,.plaza-place:after,.plaza-place i,.plaza-place i:before,.plaza-place i:after,.plaza-place b:before,.plaza-place>em{animation:none!important}.city-art-ready .plaza-place{visibility:visible;opacity:1}}

/* Remote players share the GLB-derived Corgi silhouette instead of the old
   block placeholder. Genome traits remain server-owned presentation data. */
.remote-dog{--dog-depth:1;width:86px;height:76px;filter:none;transform:translate(-50%,-100%) scale(var(--dog-depth));transform-origin:50% 100%}.remote-dog .plaza-dog-avatar{position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:contain;filter:hue-rotate(var(--coat-hue)) saturate(1.18) drop-shadow(0 9px 5px #0208178a);image-rendering:auto}.remote-dog .plaza-dog-aura{position:absolute;z-index:1;left:14%;right:14%;bottom:2%;height:17%;border:2px solid hsl(var(--coat-hue) 92% 68% / .75);border-radius:50%;background:hsl(var(--coat-hue) 92% 58% / .16);box-shadow:0 0 18px hsl(var(--coat-hue) 92% 58% / .55);transform:perspective(70px) rotateX(66deg)}.remote-dog .plaza-dog-module{position:absolute;z-index:3;right:13%;top:29%;width:8px;height:8px;border:1px solid #dffcff;background:hsl(var(--coat-hue) 92% 58%);box-shadow:0 0 9px hsl(var(--coat-hue) 92% 58%)}.remote-dog strong{z-index:4;bottom:-15px;border:1px solid #72eaff80;border-radius:4px;background:#041225e8;color:#e9ffff;box-shadow:0 4px 14px #0008}.remote-dog em{z-index:5;top:-22px;border:1px solid #72eaff80;border-radius:7px;background:#041225f2;color:#e9ffff}.remote-dog[data-action="wave"] .plaza-dog-avatar{animation:remoteDogWave .55s ease-in-out infinite alternate}.remote-dog[data-action="play"] .plaza-dog-avatar{animation:remoteDogPlay .7s ease-in-out infinite}.remote-dog[data-action="dance"] .plaza-dog-avatar{animation:remoteDogDance .55s steps(2) infinite}.remote-dog[data-action="zoom"] .plaza-dog-avatar{animation:remoteDogZoom .7s ease-in-out infinite alternate}.remote-dog[data-action="nap"] .plaza-dog-avatar{transform:rotate(7deg) scaleY(.8)}.remote-dog.target .plaza-dog-aura{border-color:#ff87e9;box-shadow:0 0 26px #ff87e9}.remote-dog.target strong{border-color:#ff87e9;color:#ffdafa}@keyframes remoteDogWave{to{transform:translateY(-4px) rotate(-3deg)}}@keyframes remoteDogPlay{50%{transform:translateY(-10px) rotate(4deg)}}@keyframes remoteDogDance{50%{transform:rotate(7deg) scaleX(-1)}}@keyframes remoteDogZoom{to{transform:translateX(8px)}}

/* Lightweight multiplayer actors stay alive and visibly rendezvous. */
.remote-dog{transition:left 1.8s cubic-bezier(.35,.05,.22,1),top 1.8s cubic-bezier(.35,.05,.22,1)}
.remote-dog[data-action="idle"] .plaza-dog-avatar{animation:remoteDogIdle 1.35s ease-in-out infinite}
.remote-dog[data-action="sniff"] .plaza-dog-avatar{animation:remoteDogSniff .72s ease-in-out infinite}
.remote-dog.talking{z-index:11}
.remote-dog.talking em{display:block;max-width:170px;white-space:normal;text-align:center;line-height:1.35}
@keyframes remoteDogIdle{50%{transform:translateY(-3px) rotate(1deg)}}
@keyframes remoteDogSniff{50%{transform:translate(5px,2px) rotate(3deg)}}