body.arrival-active{background:#080b10}
body.arrival-active>#viewport,body.arrival-active>#game-hud,body.arrival-active>#admin-button,body.arrival-active>#coordinates{visibility:hidden;pointer-events:none}
#arrival-intro{position:fixed;inset:0;z-index:100000;background:#090c11;font-family:Arial,sans-serif;color:#ede2ce;isolation:isolate}
.arrival-stage,.arrival-shade,.arrival-black{position:absolute;inset:0;width:100%;height:100%}
.arrival-stage{image-rendering:pixelated}
.arrival-shade{pointer-events:none;background:linear-gradient(#080b1038,transparent 25%,transparent 70%,#080b10b8)}
.arrival-black{background:#000;opacity:0;pointer-events:none;z-index:3}
.arrival-controls{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:16px;right:16px;text-align:center;z-index:5}
#arrival-intro button{font:600 16px Arial,sans-serif;color:#f2e5ca;border:1px solid #90714c;background:#282329;border-radius:8px;padding:12px 20px;cursor:pointer;min-height:44px;box-shadow:0 3px 0 #0b0b10}
#arrival-intro button:hover{background:#393039}#arrival-intro button:focus-visible{outline:3px solid #d0b783;outline-offset:3px}
#arrival-intro button[aria-pressed="true"]{background:#4c3940;border-color:#e3bf7d}
#arrival-intro [hidden]{display:none!important}
.arrival-error{font-size:14px;color:#f0b3a6;margin:8px auto 0;max-width:400px}
.arrival-bubble{position:absolute;transform:translate(-50%,-100%);width:max-content;max-width:min(330px,86vw);padding:14px 17px;box-sizing:border-box;background:#ede4d0;color:#29232b;border-radius:14px;font-size:clamp(14px,1.4vw,17px);line-height:1.45;box-shadow:0 5px 18px #0008;z-index:2}
.arrival-bubble:after{content:'';position:absolute;left:calc(var(--bubble-tail,50%) - 8px);bottom:-10px;border-width:11px 8px 0;border-style:solid;border-color:#ede4d0 transparent transparent}
.arrival-phone-overlay{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:#060910ad;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));box-sizing:border-box}
.arrival-phone{width:min(300px,78vw);height:min(550px,70dvh);border-radius:40px;background:#141922;border:7px solid #62636c;box-shadow:0 0 0 2px #111,0 20px 80px #0009;overflow:hidden;display:flex;flex-direction:column;color:#f5f6fa;position:relative}
.phone-status{height:38px;flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 20px;font:bold 11px Arial;background:#11161e}.phone-status i{width:85px;height:22px;background:#030405;border-radius:20px}
.phone-content{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;align-items:center;padding:35px 22px;background:radial-gradient(ellipse at top,#203e6b,#111821 70%)}
.phone-pl{background:#2369e7;display:grid;place-items:center;width:65px;height:65px;border-radius:18px;font:bold 30px Arial;box-shadow:0 8px 20px #0005}
.phone-delivery{font-size:20px;font-weight:500;line-height:1.5;margin-top:35px}.phone-home{height:5px;width:90px;background:#dedee2;border-radius:6px;margin:10px auto;flex:none}
.phone-content.phone-telegram{padding:0;align-items:stretch;background:#0d1620}.phone-telegram header{display:flex;flex:none;gap:10px;align-items:center;padding:12px;background:#1b2633}.phone-telegram header img{height:40px;width:40px;object-fit:cover;border-radius:50%}.phone-telegram header strong,.phone-telegram header small{display:block}.phone-telegram small{font-size:11px;color:#a3b4c7;margin-top:4px}
.phone-messages{flex:1;padding:12px;overflow:auto;display:flex;align-items:flex-end;flex-direction:column;gap:10px}.phone-message{background:#30567b;border-radius:13px 13px 3px 13px;padding:13px;margin:0;font-size:16px;animation:phone-send .3s ease-out}.phone-location{width:90%;padding:6px;background:#30567b;border-radius:12px;animation:phone-send .3s ease-out}.phone-location strong,.phone-location small{display:block;padding:3px 6px}.phone-map{height:110px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(30deg,transparent 44%,#5c6576 44% 50%,transparent 50%),linear-gradient(120deg,#233d40 37%,#58666c 37% 42%,#263b44 42% 72%,#486277 72% 80%,#28383a 80%)}.phone-map span{width:25px;height:25px;color:#fff;border:4px solid #fff;border-radius:50%;text-align:center;background:#4094e4;box-shadow:0 0 0 13px #4094e43a}.phone-compose{margin:6px 10px;padding:13px;border-radius:20px;background:#1e2b39;color:#7e91a4;font-size:13px}
.character-choice{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);box-sizing:border-box;width:min(500px,calc(100vw - 24px));max-height:90dvh;overflow:auto;padding:22px;background:linear-gradient(#25222b,#14171f);border:1px solid #a68b5d;border-radius:16px;box-shadow:0 18px 100px #000c;text-align:center;scrollbar-color:#a68b5d #20212a}
.character-choice h1{font-size:23px;margin:0 0 16px}.character-genders,.character-modes{display:flex;gap:8px;justify-content:center}.character-genders button{flex:1}.character-main{display:flex;align-items:center;justify-content:center;gap:12px}.character-main canvas{height:230px;width:auto;image-rendering:pixelated}.character-main button{font-size:28px!important;padding:4px 15px!important}.character-angles{display:flex;justify-content:center;gap:8px;margin:6px 0 12px}.character-angles button{padding:2px 8px!important;background:#181b24!important}.character-angles canvas{height:65px;width:auto;display:block;image-rendering:pixelated}.character-modes button{padding:8px 12px!important;font-size:13px!important}.character-confirm{width:100%;margin-top:16px;background:#674334!important}.character-note{font-size:13px;line-height:1.5;color:#b9afa4;margin:12px 5px 0}
@keyframes phone-send{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
@media(max-width:700px){.character-choice{max-height:70dvh;padding:16px}.character-choice h1{font-size:20px;margin-bottom:12px}.character-main canvas{height:clamp(105px,22dvh,185px)}.character-angles canvas{height:42px}.character-angles{margin:4px 0 8px;gap:6px}.character-genders button{padding:10px!important;font-size:14px!important}.character-confirm{margin-top:12px}.character-note{font-size:12px;margin-top:9px}}
@media(max-height:500px){.arrival-phone-overlay{flex-direction:row}.arrival-phone{height:90dvh;width:240px}.phone-content{padding:15px}.phone-delivery{font-size:16px;margin-top:15px}.phone-pl{width:45px;height:45px;font-size:23px}.phone-map{height:65px}.character-choice{max-height:88dvh}.character-main canvas{height:130px}}
@media(prefers-reduced-motion:reduce){.phone-message,.phone-location{animation:none}}
@media(max-width:450px) and (max-height:650px){.character-choice{padding:12px}.character-choice h1{font-size:18px;margin-bottom:8px}.character-main canvas{height:100px}.character-angles canvas{height:36px}.character-angles{margin-block:2px 5px}.character-confirm{margin-top:8px}.character-note{font-size:11px;margin-top:7px;line-height:1.4}}
/* Both the message and its location card must fit before the automatic cut. */
@media(max-height:650px){.phone-map{height:72px}.phone-messages{gap:8px;padding:10px}.phone-location{flex:none}.phone-message{flex:none}.phone-compose{flex:none}.phone-delivery{font-size:18px;margin-top:24px}.phone-content:not(.phone-telegram){padding:24px 18px}}
@media(max-height:430px){.arrival-phone{box-sizing:border-box;height:calc(100dvh - 24px);max-height:100%;width:240px;border-width:5px;border-radius:28px}.phone-status{height:25px;padding-inline:14px}.phone-status i{height:16px;width:64px}.phone-home{height:3px;margin:5px auto}.phone-content:not(.phone-telegram){padding:15px 18px}.phone-pl{width:38px;height:38px;font-size:21px;flex:none}.phone-delivery{font-size:16px;line-height:1.4;margin:14px 0 0}.phone-telegram header{padding:6px 10px;gap:8px}.phone-telegram header img{width:28px;height:28px}.phone-telegram header strong{font-size:14px}.phone-telegram small{font-size:10px;margin-top:2px}.phone-messages{padding:7px 9px;gap:6px}.phone-message{padding:7px 10px;font-size:14px}.phone-map{height:44px}.phone-location{padding:4px}.phone-location strong{font-size:12px;padding-block:2px}.phone-location small{font-size:10px;padding-block:1px}.phone-compose{margin:3px 9px;padding:7px 10px;font-size:11px}}
/* Landscape uses the available width instead of hiding the primary action. */
@media(min-width:500px) and (max-height:450px){.character-choice{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px 12px;width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:12px}.character-choice h1{grid-column:1;grid-row:1;font-size:18px;margin:0;align-self:center}.character-genders{grid-column:1;grid-row:2}.character-main{grid-column:2;grid-row:1 / span 3;gap:4px;min-width:0}.character-main canvas{height:140px;max-width:calc(100% - 96px);object-fit:contain}.character-main button{padding:4px 12px!important;min-width:44px}.character-angles{grid-column:1;grid-row:3;margin:0;gap:5px}.character-angles canvas{height:36px}.character-angles button{padding-inline:7px!important}.character-modes{grid-column:1;grid-row:4}.character-confirm{grid-column:2;grid-row:4;margin:0;align-self:stretch}.character-note{grid-column:1 / -1;grid-row:5;margin:2px 0 0;font-size:11px;line-height:1.4}.character-genders button{padding:8px!important;font-size:13px!important}.character-modes button{padding:6px 10px!important}}

body.arrival-loading>#game-hud,body.arrival-loading>#admin-button{visibility:hidden}

#quest-toggle[hidden],#admin-quests[hidden]{display:none!important}