.bottom-nav .join-nav span{font-size:calc(1vh*1.55);font-size:calc(var(--vh,1vh)*1.55);font-size:clamp(10px,calc(1vh*1.55),16px);font-size:clamp(10px,calc(var(--vh,1vh)*1.55),16px);white-space:nowrap}
.bottom-nav .join-nav svg{width:100%;height:100%}
#idleMusicHint{position:absolute;left:50%;top:9.6%;transform:translateX(-50%);white-space:nowrap;z-index:8;padding:8px 14px;border:1px solid #fff5db;border-radius:20px;background:#fff9ea;color:#82644f;box-shadow:0 2px 7px rgba(73,127,119,0.141);font-size:calc(1vh*1.3);font-size:calc(var(--vh,1vh)*1.3);font-size:clamp(10px,calc(1vh*1.3),13px);font-size:clamp(10px,calc(var(--vh,1vh)*1.3),13px)}
#idleMusicHint[hidden]{display:none}
#menu:has(#idleMusicHint:not([hidden]))>.journey{visibility:hidden}
#joinDialog{width:88vw;width:88vw;width:min(88vw,420px);max-height:calc(1vh*86);max-height:calc(var(--vh,1vh)*86);overflow:auto;border:3px solid #fffdf4;border-radius:28px;padding:0;color:#715a49;background:#fff8eb;box-shadow:0 18px 70px rgba(36,79,98,0.439);font-family:inherit}
#joinDialog::backdrop{background:rgba(36,77,94,0.502);backdrop-filter:blur(5px)}
.join-cover{position:relative;padding:28px 24px 23px;text-align:center;background:linear-gradient(145deg,#87e3da,#43bcca);border-bottom:3px solid #3ca6b0;color:#fffefa}
.join-cover>svg{width:58px;height:58px;margin:0 auto;filter:drop-shadow(0 3px 0 rgba(52,142,148,0.169))}
.join-cover h2{font-size:26px;margin:8px 0 4px;letter-spacing:2px;text-shadow:0 2px #329eaa}
.join-cover p{font-size:13px;margin:0;line-height:1.7}
.join-close{position:absolute;top:11px;right:12px;width:34px;height:34px;border:1px solid rgba(255,255,255,0.612);border-radius:50%;background:rgba(255,255,255,0.208);color:white;font-size:25px;line-height:1}
.join-content{padding:22px 20px 14px}.join-content>p{margin:0 0 17px;font-size:13px;line-height:1.8;text-align:center;color:#9a8067}
.contact-card{border:1px solid #ead6b9;border-radius:17px;background:#fffefa;padding:14px 13px;margin-bottom:12px;display:grid;grid-template-columns:1fr auto;align-items:center;grid-gap:8px;gap:8px}
.contact-card small{display:block;font-size:11px;color:#a58a70;margin-bottom:6px}.contact-card a{display:block;color:#725742;font-size:3.6vw;font-size:3.6vw;font-size:clamp(14px,3.6vw,19px);font-weight:700;text-decoration:none;user-select:text;overflow-wrap:anywhere}
.contact-card button{padding:9px 11px;border-radius:12px;border:1px solid #a3dcd1;background:#e2f7ef;color:#438a7e;font-size:12px;white-space:nowrap}
.join-footer{margin:16px 0 0;padding:11px 0 0;border-top:1px dashed #e4d5bb;text-align:center;font-size:11px;line-height:1.7;color:#a48a72}
#contactCopyStatus{min-height:20px;text-align:center;font-size:12px;color:#388f7f;margin:8px 0 0}
#joinDialog button:focus-visible,#joinDialog a:focus-visible{outline:3px solid #238b98;outline-offset:3px}
@media(max-height:580px){.join-cover{padding:13px}.join-cover>svg{display:none}.join-cover h2{margin:2px 0}.join-content{padding:12px}.contact-card{padding:10px}}
#devDialog{width:88vw;width:88vw;width:min(88vw,380px);max-height:calc(1vh*80);max-height:calc(var(--vh,1vh)*80);overflow:auto;border:3px solid #fffdf4;border-radius:24px;padding:0;color:#715a49;background:#fff8eb;box-shadow:0 18px 70px rgba(36,79,98,0.439);font-family:inherit}
#devDialog::backdrop{background:rgba(36,77,94,0.502);backdrop-filter:blur(5px)}
#devDialog .dev-cover{position:relative;padding:26px 22px 20px;text-align:center;background:linear-gradient(145deg,#2f4a7a,#17233d);border-bottom:3px solid #0e1930;color:#eaf3ff}
#devDialog .dev-cover h2{font-size:23px;margin:6px 0 4px;letter-spacing:2px;text-shadow:0 2px #0b1729}
#devDialog .dev-cover p{font-size:12px;margin:0;opacity:.85}
#devDialog .dev-body{padding:20px 20px 14px}
#devDialog .dev-body label{display:block;font-size:12px;color:#a58a70;margin-bottom:6px}
#devDialog input{box-sizing:border-box;width:100%;padding:11px;border:1px solid #e0cdb1;border-radius:10px;background:#fffefa;color:#3f4b5c;font:inherit;letter-spacing:1px}
#devDialog .dev-actions{display:flex;grid-gap:8px;gap:8px;margin-top:12px}
#devDialog .dev-actions button{flex:1;cursor:pointer;border:0;border-radius:10px;padding:10px 12px;font:inherit;font-weight:700;background:#e2f7ef;color:#2f6d63}
#devDialog #devExit{background:#f0e6d8;color:#8a705a}
#devStatus{min-height:20px;margin:10px 0 0;text-align:center;font-size:12px;color:#c0563f}
#devDialog .dev-note{margin:10px 0 0;font-size:11px;line-height:1.7;color:#a48a72;text-align:center}
#devDialog button:focus-visible,#devDialog input:focus-visible{outline:3px solid #238b98;outline-offset:3px}
