:root{--bg:#f6f6f7;--surface:#fff;--surface-2:#f1f1f3;--text:#18181b;--text-2:#63636e;--text-3:#a1a1aa;--border:#e6e6ea;--accent:#18181b;--accent-text:#fff;--danger:#e5484d;--radius:12px;--shadow-sm:0 1px 2px #1010140a, 0 1px 1px #10101408;--shadow-md:0 4px 14px #10101414, 0 1px 3px #1010140d;font-feature-settings:"tnum";letter-spacing:-.01em;word-break:keep-all;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Malgun Gothic,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#0f0f11;--surface:#18181b;--surface-2:#232327;--text:#f4f4f5;--text-2:#a1a1aa;--text-3:#6b6b74;--border:#2a2a2f;--accent:#f4f4f5;--accent-text:#18181b;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 6px 18px #0006, 0 1px 3px #0000004d}}*{box-sizing:border-box}body{background:var(--bg);margin:0}button{font:inherit;color:inherit;cursor:pointer}textarea,input{font:inherit;color:var(--text)}.qbadge{white-space:nowrap;background:color-mix(in srgb, var(--q) 10%, transparent);color:var(--text-2);border-radius:999px;align-items:center;gap:5px;padding:2px 8px 2px 7px;font-size:12px;font-weight:600;display:inline-flex}.qbadge:before{content:"";background:var(--q);border-radius:50%;width:6px;height:6px}.qbadge.unsorted{--q:var(--text-3)}.sync-button{-webkit-app-region:no-drag;border:1px solid var(--border);background:var(--surface);height:28px;box-shadow:var(--shadow-sm);color:var(--text-2);white-space:nowrap;border-radius:999px;flex-shrink:0;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:600;display:inline-flex}.sync-button:hover{color:var(--text)}.sync-dot{background:#8b8d98;border-radius:50%;width:8px;height:8px}.sync-dot[data-state=connecting]{background:#f5a524}.sync-dot[data-state=synced]{background:#30a46c}.sync-dot[data-state=offline]{background:var(--danger)}.connect-dialog{border:1px solid var(--border);background:var(--surface);width:min(420px,100vw - 32px);max-height:calc(100dvh - 32px);box-shadow:var(--shadow-md);color:var(--text);border-radius:16px;padding:20px}.connect-dialog::backdrop{background:#0006}.connect-close{float:right;color:var(--text-2);background:0 0;border:0;font-size:16px}.connect-body{flex-direction:column;gap:10px;display:flex}.connect-body h2{margin:0;font-size:18px}.connect-body h3{margin:0;font-size:14px}.connect-body p{margin:0;font-size:14px;line-height:1.5}.connect-body .hint{color:var(--text-2);font-size:13px}.connect-body .error{color:var(--danger);font-size:13px}.connect-body .error:empty{display:none}.connect-option{border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:8px;padding:12px;display:flex}.code-box{background:var(--surface-2);letter-spacing:.5px;-webkit-user-select:all;user-select:all;overflow-wrap:anywhere;border-radius:8px;padding:10px 12px;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:15px;display:block}.connect-body input{border:1px solid var(--border);background:var(--bg);border-radius:8px;height:40px;padding:0 12px;font-size:16px}.connect-body .row{gap:8px;display:flex}.connect-body .row>*{flex:1}.connect-body button.primary,.connect-body button.secondary,.connect-body button.danger{border-radius:8px;height:40px;font-weight:600}.connect-body button.primary{background:var(--accent);color:var(--accent-text);border:0}.connect-body button.secondary{border:1px solid var(--border);background:var(--surface)}.connect-body button.danger{border:1px solid var(--border);color:var(--danger);background:0 0}.connect-body button:disabled{opacity:.5}
