.mobile-connection-trigger { flex-shrink:0; white-space:nowrap; }
.mobile-connection-trigger svg { flex-shrink:0; }
.mobile-connection-dialog.el-dialog { width:min(640px, calc(100vw - 24px)); margin:6vh auto 24px; border-radius:12px; --el-dialog-padding-primary:24px; }
.mobile-connection-dialog .el-dialog__body { padding-top:8px; color:var(--text, #253c52); line-height:1.65; }
.mobile-connection-intro { margin:0 0 18px; }
.mobile-connection-status { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px; background:#f1f6fc; border:1px solid #dbe7f5; border-radius:9px; }
.mobile-connection-status strong { color:#194d79; font-size:16px; }
.mobile-connection-status p { margin:4px 0 0; color:#657a92; font-size:13px; }
.mobile-connection-status .el-switch { flex-shrink:0; }
.mobile-connection-details { display:grid; grid-template-columns:196px minmax(0, 1fr); gap:22px; padding:22px 0 16px; align-items:center; }
.mobile-connection-code { min-width:0; text-align:center; color:#657a92; font-size:12px; }
.mobile-connection-qr { width:196px; height:196px; padding:10px; box-sizing:border-box; margin:0 auto 8px; background:white; border:1px solid #e1eaf4; border-radius:8px; }
.mobile-connection-qr img, .mobile-connection-qr canvas { width:176px; height:176px; max-width:100%; }
.mobile-connection-address { min-width:0; }
.mobile-connection-address label, .mobile-connection-adapter-label { display:block; color:#657a92; font-size:13px; margin-bottom:7px; overflow-wrap:anywhere; }
.mobile-connection-adapter { width:100%; }
.mobile-connection-url { display:block; margin:12px 0; padding:10px 12px; background:#f7f9fc; border:1px solid #e4ebf4; border-radius:6px; color:#214c76; font:13px/1.6 Consolas, monospace; overflow-wrap:anywhere; user-select:text; }
.mobile-connection-warning { margin:16px 0 10px; padding:10px 12px; border:1px solid #f1dfb8; border-radius:6px; background:#fffbf3; color:#896224; font-size:13px; }
.mobile-connection-note, .mobile-connection-help, .mobile-connection-hint { color:#657a92; font-size:13px; margin:10px 0 0; }
.mobile-connection-help { line-height:1.7; }
.mobile-connection-install { margin-top:16px; padding-top:12px; border-top:1px solid #e4ebf4; font-size:13px; }
.mobile-connection-install strong { color:#315775; font-weight:600; }
.mobile-connection-install p { margin:5px 0 0; }
.mobile-connection-message { margin:14px 0; color:#576f89; }
.mobile-connection-message.needs-attention { padding:10px 12px; border:1px solid #f1dfb8; border-radius:6px; background:#fffbf3; color:#896224; }
.mobile-connection-error { margin:12px 0 0; color:#b73838; overflow-wrap:anywhere; font-size:13px; }
.mobile-connection-copy-result { margin:8px 0 0; color:#21694b; font-size:13px; }
.mobile-connection-qr-error { padding:18px; border:1px dashed #d5e1ef; border-radius:8px; color:#657a92; }
.mobile-connection-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.mobile-connection-actions > .el-button + .el-button { margin-left:0; }
@media (max-width:480px) {
  .mobile-connection-dialog.el-dialog { margin-top:12px; --el-dialog-padding-primary:16px; }
  .mobile-connection-dialog .el-dialog__header { padding-right:28px; }
  .mobile-connection-status { gap:12px; padding:12px; }
  .mobile-connection-details { grid-template-columns:1fr; gap:16px; padding-top:18px; }
  .mobile-connection-address { width:100%; }
  .mobile-connection-actions { gap:8px; }
  .mobile-connection-actions > .el-button { padding-inline:12px; }
}

.app-sidebar .mobile-connection-trigger { width:100%; border:0; background:transparent; text-align:left; font:inherit; cursor:pointer; }
.app-sidebar .mobile-connection-trigger svg { margin-right:10px; }
