*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#000000;font-family:Arial,Helvetica,sans-serif;color:#303f4a}canvas{display:block;touch-action:none}header{position:absolute;top:32px;left:38px;right:38px;display:flex;justify-content:space-between;pointer-events:none}.brand{display:flex;gap:16px;align-items:center}.mark{background:white;border-radius:17px;width:57px;height:57px;display:flex;align-items:center;justify-content:center;font-size:29px;font-weight:800;letter-spacing:-3px;box-shadow:0 4px 24px #5368790a}.mark span{color:#ffae40;letter-spacing:0}h1{font-size:23px;letter-spacing:-.8px;margin:0 0 5px}p{margin:0;color:#667780;font-size:14px}.location{display:flex;gap:12px;align-items:center;background:#ffffffd9;padding:12px 18px;border-radius:16px;font-size:14px;font-weight:600}.location small{display:block;font-weight:400;color:#71818a;margin-top:5px;font-size:12px}.sun{color:#ecaa39;font-size:30px}footer{position:absolute;bottom:28px;left:38px;right:38px;display:flex;justify-content:flex-end;align-items:end;pointer-events:none}.hint{display:flex;align-items:center;gap:14px;padding:15px 20px;background:#ffffffed;border:1px solid #ffffff;border-radius:18px;box-shadow:0 8px 30px #233d4710}.hint strong{font-size:14px;display:block;margin-bottom:6px}.hint div>span{font-size:13px;color:#7b8992}.mouse{font-size:25px;color:#76939d}.tools{pointer-events:auto;display:flex;background:white;border-radius:16px;padding:7px;align-items:center;box-shadow:0 8px 30px #233d4710}.tools span{height:22px;width:1px;background:#e7ecef;margin:0 5px}button{border:0;background:transparent;color:#526a76;font-size:26px;width:42px;height:40px;cursor:pointer;border-radius:10px}button:hover{background:#edf5f7}button:focus-visible{outline:2px solid #258ba8}#you{position:absolute;pointer-events:none;background:#fff;color:#327f9e;padding:5px 10px;border-radius:9px;font-size:11px;font-weight:800;letter-spacing:1px;transform:translate(-50%,-100%);box-shadow:0 2px 8px #0001}#error{position:absolute;top:40%;left:10%;right:10%;background:white;padding:30px;border-radius:20px;text-align:center}@media(max-width:600px){header{top:18px;left:18px;right:18px}.location{display:none}footer{left:14px;right:14px;bottom:16px}.hint{padding:12px;gap:8px}.hint strong{font-size:12px}.hint div>span{font-size:11px}.tools button{width:32px}.brand p{font-size:12px}}

#portal-dialog{border:1px solid #fff;border-radius:24px;padding:30px;width:min(420px,calc(100vw - 36px));color:#303f4a;background:#f8fcfd;box-shadow:0 22px 90px #193b4940;text-align:center}#portal-dialog::backdrop{background:#20374565;backdrop-filter:blur(3px)}.portal-icon{font-size:38px;color:#379fc0;margin-bottom:12px}#portal-question{font-size:23px;line-height:1.35;letter-spacing:-.5px;margin:0 0 25px}.portal-actions{display:flex;gap:12px}.portal-actions button,.portal-actions a{font-family:inherit;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:1;width:auto;height:46px;border-radius:12px;text-decoration:none;cursor:pointer}.portal-actions button{background:#e8eff2;color:#526a76}.portal-actions a{background:#328eac;color:white}.portal-actions a:hover{background:#277791}.portal-actions a:focus-visible{outline:3px solid #244f64;outline-offset:3px}

.social-dialog{border:1px solid white;border-radius:24px;padding:26px;width:min(420px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow:auto;color:#303f4a;background:#f8fcfd;box-shadow:0 22px 90px #193b4940}.social-dialog::backdrop{background:#20374565;backdrop-filter:blur(3px)}.social-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.5px;color:#328eac}.social-dialog h2{font-size:24px;margin:7px 0 10px}.social-dialog p{font-size:14px;line-height:1.6}.social-actions{display:grid;gap:10px;margin-top:24px}.social-actions button{width:100%;height:auto;min-height:48px;font-size:16px;font-weight:600;background:#e8eff2}.social-actions #open-chat{background:#328eac;color:white}.social-actions #block-user{color:#a34151}.social-dialog button:disabled{opacity:.45;cursor:not-allowed}.close-dialog{flex-shrink:0;align-self:flex-start}.chat-dialog{width:min(470px,calc(100vw - 28px))}.chat-empty{text-align:center;padding:35px 10px}.chat-empty>span{font-size:40px;color:#328eac}.chat-empty h3{font-size:18px}.chat-compose{display:flex;gap:8px}.chat-compose input{min-width:0;flex:1;padding:13px;border:1px solid #d7e3e8;border-radius:10px;font:inherit;font-size:14px;background:#edf3f5}.chat-compose button{font-size:14px;width:60px;background:#328eac;color:white}.social-dialog #chat-back{font-size:14px;width:auto;padding:0 12px;margin-top:14px}@media(max-width:600px){.hint div>span{display:block;max-width:175px;line-height:1.5}.social-dialog{padding:20px}}

#portal-description{font-size:16px;line-height:1.6;color:#60727d;margin:-10px 0 24px}#portal-dialog{max-height:calc(100dvh - 28px);overflow:auto}

.account-controls{position:absolute;left:38px;bottom:28px;display:flex;gap:8px;padding:7px;background:white;border-radius:16px;box-shadow:0 8px 30px #233d4710}.account-controls button{width:auto;padding:0 16px;font:600 14px Arial,Helvetica,sans-serif}.account-controls #create-account-button{background:#337dcb;color:white}.account-controls #create-account-button:hover{background:#2867ac}.account-dialog fieldset{border:0;margin:22px 0 0;padding:0;display:grid;gap:8px}.account-dialog label{font-size:13px;font-weight:600;margin-top:5px}.account-dialog input{width:100%;padding:12px;border:1px solid #d7e3e8;border-radius:10px;background:#edf3f5;font:inherit;font-size:14px}.account-dialog .account-submit{width:100%;height:46px;margin-top:12px;font-size:15px;background:#337dcb;color:white}.account-dialog .account-switch{width:100%;height:auto;min-height:40px;margin-top:16px;font-size:14px;color:#2867ac}@media(max-width:600px){.account-controls{left:14px;bottom:16px;gap:2px}.account-controls button{padding:0 9px;font-size:12px}}@media(max-width:360px){.account-controls{bottom:78px}}

[hidden]{display:none!important}.account-panel{position:absolute;left:38px;bottom:28px;width:min(330px,calc(100vw - 190px));pointer-events:none}.account-panel>p{color:white;text-shadow:0 1px 4px #000,0 1px 8px #000;line-height:1.45;font-size:13px;margin:0 0 9px}.account-panel #account-notice{font-size:12px;margin:8px 0 0}.account-panel .account-controls{position:static;display:inline-flex;pointer-events:auto}.account-dialog input:focus{outline:2px solid #337dcb}.friend-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid #d7e3e8}.friend-row span{flex:1 0 100%;font-size:14px}.friend-row button{width:auto;padding:0 12px;font-size:14px;background:#e8eff2}#chat-messages{height:280px;overflow:auto;margin:20px 0;display:flex;flex-direction:column;gap:10px}.message{max-width:85%;align-self:flex-start;padding:10px 14px;border-radius:14px;background:#e3ebee;white-space:pre-wrap;overflow-wrap:anywhere}.message.mine{align-self:flex-end;background:#337dcb;color:white}#chat-status{margin-bottom:10px;color:#a34151}@media(max-width:600px){.account-panel{left:14px;bottom:16px;width:calc(100vw - 145px)}}@media(max-width:360px){.account-panel{bottom:78px;width:calc(100vw - 28px)}}

/* Independent side slots reserved for future approved ad units. */
.advertisement-panel{position:fixed;z-index:10;top:43%;transform:translateY(-50%);width:184px;padding:7px 11px 11px;border:1px solid #d7e3e8;border-radius:12px;background:#f8fcfdf5;box-shadow:0 4px 18px #0003;text-align:center;pointer-events:auto}#advertisement-left{left:max(14px,env(safe-area-inset-left))}#advertisement-right{right:max(14px,env(safe-area-inset-right))}.advertisement-label{display:block;font-size:9px;line-height:14px;letter-spacing:1px;color:#687b87;margin-bottom:4px}.google-ad-slot{height:min(414px,55.2dvh);display:flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:0;overflow:visible}.advertisement-placeholder{font-size:12px;color:#71838e;letter-spacing:.3px}@media(max-width:800px){.advertisement-panel{width:112px;padding:6px}.advertisement-label{font-size:8px;letter-spacing:.5px}.google-ad-slot{height:min(303.6px,46.92dvh)}}@media(max-width:480px),(max-height:450px){.advertisement-panel{width:76px;padding:4px;top:35%;border-radius:8px}#advertisement-left{left:max(6px,env(safe-area-inset-left))}#advertisement-right{right:max(6px,env(safe-area-inset-right))}.advertisement-label{font-size:6px;letter-spacing:0;line-height:10px;margin-bottom:3px}.google-ad-slot{height:min(193.2px,34.5dvh)}.advertisement-placeholder{font-size:10px}}

.host-dialog{border:2px solid #d8b65d;background:#f9f7f0}.host-dialog .eyebrow{color:#8a6b22}.host-dialog p{margin:14px 0;line-height:1.7;color:#4e5760}.host-dialog #host-done{width:100%;height:46px;margin-top:12px;font-size:15px;font-weight:600;background:#263342;color:#fff0c2}

#portal-dialog.has-download .portal-actions{flex-wrap:wrap}#portal-dialog.has-download #portal-yes{order:0}#portal-dialog.has-download #portal-download{order:1;background:#c83f50}#portal-dialog.has-download #portal-download:hover{background:#a93240}#portal-dialog.has-download #portal-no{order:2;flex-basis:100%}

/* NPC dialogue action overrides the compact zoom-button defaults. */
#npc-dialogue{margin:16px 0 22px;line-height:1.7;overflow-wrap:break-word}
#npc-done{display:block;width:100%;height:auto;min-height:48px;padding:12px 18px;font:600 16px/1.4 Arial,Helvetica,sans-serif;white-space:normal;background:#328eac;color:white;border-radius:12px;text-align:center}
#npc-done:hover{background:#277791}
#npc-done:focus-visible{outline:3px solid #244f64;outline-offset:3px}
