.conn-notice{position:fixed;top:calc(10px + env(safe-area-inset-top));left:50%;z-index:80;display:flex;align-items:center;gap:10px;width:max-content;max-width:min(440px,calc(100vw - 32px));padding:8px 8px 8px 12px;border:1px solid #2f4553;border-radius:14px;background:#1a2c38f5;box-shadow:0 10px 30px #0006;color:#b1bad3;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:12px;line-height:1.35;transform:translate(-50%);animation:connIn .28s cubic-bezier(.22,1,.36,1)}.conn-notice[data-state=recovered]{padding-right:14px;animation:connIn .28s cubic-bezier(.22,1,.36,1),connOut .4s ease-in 1.8s forwards}@keyframes connIn{0%{opacity:0;transform:translate(-50%,-8px)}}@keyframes connOut{to{opacity:0;transform:translate(-50%,-6px)}}.conn-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#f59e0b;box-shadow:0 0 #f59e0b80;animation:connPulse 1.6s ease-out infinite}.conn-notice[data-state=noIc] .conn-dot{background:#ef6b5b;box-shadow:0 0 #ef6b5b80}.conn-notice[data-state=recovered] .conn-dot{background:#1fff7a;animation:none}@keyframes connPulse{70%{box-shadow:0 0 0 7px #0000}to{box-shadow:0 0 #0000}}.conn-text{display:grid;gap:1px;min-width:0}.conn-text strong{color:#fff;font-size:13px;font-weight:700}.conn-retry{flex:none;min-height:30px;padding:0 12px;border:1px solid #2f4553;border-radius:9px;background:#213743;color:#fff;font:inherit;font-weight:700;cursor:pointer;transition:background-color .24s ease,border-color .24s ease}.conn-retry:hover,.conn-retry:focus-visible{border-color:#3d5a6c;background:#2a4554}@media(prefers-reduced-motion:reduce){.conn-notice,.conn-dot{animation:none}.conn-notice[data-state=recovered]{animation:connOut .01s linear 1.8s forwards}}.gate{position:fixed;inset:0;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:0 16px;background:#0f212e;color:#b1bad3;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px}.gate-panel,.gate-form{display:flex;flex-direction:column;align-items:stretch;gap:12px;width:min(280px,100%)}.gate-invite{display:flex;justify-content:space-between;gap:12px;margin:0;padding:10px 12px;border:1px solid #2f4553;border-radius:6px}.gate-invite span{flex-shrink:0;white-space:nowrap}.gate-invite code{min-width:0;overflow:hidden;color:#fff;text-overflow:ellipsis;white-space:nowrap}.gate-input{box-sizing:border-box;width:100%;padding:10px 12px;border:1px solid #2f4553;border-radius:6px;background:#0b1822;color:#fff;font:inherit;outline:none}.gate-input:focus{border-color:#557086}.gate-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;border:0;border-radius:6px;background:#2f4553;color:#fff;font:inherit;cursor:pointer;transition:background-color .28s ease,opacity .28s ease}.gate-button-icon{flex:0 0 auto;width:18px;height:18px;margin-left:-4px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.gate-button:hover:not(:disabled){background:#3d5564}.gate-button:disabled{opacity:.6;cursor:default}.gate-link{align-self:center;padding:4px;border:0;background:none;color:#7a8fa0;font:inherit;cursor:pointer;transition:color .24s ease}.gate-link:hover:not(:disabled){color:#b1bad3}.gate-note{margin:0;color:#8ea1b1;font-size:13px;line-height:18px;text-align:center}.gate-status{min-height:18px;margin:2px 0 0;color:#c4a0a4;font-size:13px;line-height:18px;text-align:center;opacity:0;transition:opacity .32s ease}.gate-status[data-shown=true]{opacity:1}.gate-panel>*{animation:gate-fade-in .32s ease both}@keyframes gate-fade-in{0%{opacity:0;transform:translateY(4px)}}.gate-spinner{justify-self:center;width:20px;height:20px;margin:0 auto;border:2px solid #2f4553;border-top-color:#b1bad3;border-radius:50%;animation:gate-spin .8s linear infinite}@media(prefers-reduced-motion:reduce){.gate-panel>*{animation:none}}@keyframes gate-spin{to{transform:rotate(360deg)}}.gate-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 0;font-size:13px}.gate-links>.gate-link+.gate-link:before{content:"·";margin-right:8px;color:#3d5564}.gate-link:disabled{opacity:.6;cursor:default}
