/* Sign in screen and small additions for the hosted version. Same look as the app: black on white. */
#gate{position:fixed;inset:0;z-index:100;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:16px}
.gate-card{width:100%;max-width:400px;border:1px solid var(--line);border-radius:22px;padding:28px 24px;background:#fff}
.gate-card .brand{display:flex;gap:10px;align-items:center;margin-bottom:22px}
.gate-card .brand svg{width:30px;height:30px;flex:none}
.gate-card .brand b{font-family:var(--display);font-size:22px;letter-spacing:.06em;line-height:.9;display:block;font-weight:400}
.gate-card .brand span{font-size:9.5px;letter-spacing:.16em;color:var(--mute);text-transform:uppercase}
.gate-card h1{margin-bottom:6px}
.gate-card p{font-size:13px;margin:0 0 14px}
.gate-card .small{font-size:12px;margin:10px 0 0;min-height:1em}
.gate-card .big{width:100%;justify-content:center;padding:12px 14px;font-size:13.5px}
.gate-card .or{display:flex;align-items:center;gap:10px;margin:18px 0 12px;font-size:11.5px;color:var(--mute)}
.gate-card .or:before,.gate-card .or:after{content:"";flex:1;height:1px;background:var(--line)}
.gate-card form{display:flex;gap:8px}
.gate-card input{flex:1;min-width:0;border:1px solid var(--line2);border-radius:999px;padding:8px 14px;font-size:13px}
.gate-card form.stack{flex-direction:column;gap:10px}
.gate-card form.stack input{flex:none;padding:11px 16px;font-size:16px}
.gate-card form.stack .big{margin-top:4px}
.gate-card .row{display:flex}
.island .foot span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.island .foot .btn{padding:3px 8px;font-size:11px}
#mout{display:none}
@media (max-width:860px){#mout:not([hidden]){display:inline-flex;float:right;margin:-8px -6px 0 8px}}
.addbtn[hidden]{display:none!important}