/* Z Pass local web preview: quiet, crisp, functional chat UI */
:root {
  --zp-bg: #f5f7fb;
  --zp-surface: #fff;
  --zp-soft: #f0f3f8;
  --zp-ink: #172235;
  --zp-muted: #78869a;
  --zp-line: #e5eaf1;
  --zp-accent: #3978f6;
  --zp-shadow: 0 18px 50px rgba(20, 35, 60, .08);
  color-scheme: light;
}
html, body { width:100%; height:100%; min-height:100%; margin:0; background:#f5f7fb!important; color:#172235!important; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important; letter-spacing:-.012em; }
body { padding:0!important; overflow:hidden!important; display:block!important; }
body > .blob { display:none!important; }
#login-wrap { display:none!important; }
#app-shell { inset:12px!important; overflow:hidden!important; border:1px solid #e7ebf2!important; border-radius:22px!important; background:#fff!important; box-shadow:var(--zp-shadow)!important; }
#app-shell, #app-shell * { backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
#app-shell .shell, #app-shell .glass-panel, #app-shell .liquid-glass { background:#fff!important; border-color:#e7ebf2!important; box-shadow:none!important; }
#app-shell .app-topbar { min-height:62px!important; height:62px!important; background:#fff!important; border-bottom:1px solid #e8edf4!important; }
#app-shell button { transition:background-color .16s ease,color .16s ease,border-color .16s ease,transform .16s ease!important; }
#app-shell button:hover { transform:translateY(-1px); }
#view-chats { background:#f7f9fc!important; }
#view-chats > div:first-child { background:#fff!important; border-right:1px solid #e8edf4!important; }
#view-chats .chat-row, #view-chats [data-chat-id] { border-radius:12px!important; }
#view-chats .chat-row:hover, #view-chats [data-chat-id]:hover { background:#f4f7fb!important; }
#view-chats .chat-row.active, #view-chats [data-chat-id].active { background:#edf4ff!important; }
#view-chats .message-input, #view-chats textarea, #view-chats input { border:1px solid #e4eaf2!important; background:#fff!important; color:#172235!important; box-shadow:none!important; }
#view-chats .bub-me { background:#3978f6!important; color:#fff!important; border-radius:18px 18px 5px 18px!important; box-shadow:none!important; }
#view-chats .bub-ot { background:#fff!important; color:#26354a!important; border:1px solid #e9edf3!important; border-radius:18px 18px 18px 5px!important; box-shadow:0 3px 12px rgba(25,45,75,.04)!important; }
#profile-panel { background:#fff!important; border-left:1px solid #e8edf4!important; }
.zp-shared-tabs { background:#f1f4f8!important; border:0!important; border-radius:12px!important; padding:4px!important; gap:2px!important; }
.zp-shared-tabs button { border-radius:9px!important; color:#66758a!important; }
.zp-shared-tabs button[aria-selected=true] { background:#fff!important; color:#3978f6!important; box-shadow:0 1px 3px rgba(25,45,75,.1)!important; }
.zp-design-note { border-radius:12px!important; box-shadow:0 6px 24px rgba(20,35,60,.08)!important; }
.zp-wallpaper-dialog { border:1px solid #e5eaf1!important; border-radius:18px!important; box-shadow:0 24px 80px rgba(15,30,55,.18)!important; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline:3px solid rgba(57,120,246,.28)!important; outline-offset:2px!important; }
@media(max-width:760px) {
  #app-shell { inset:0!important; border-radius:0!important; border:0!important; }
  #app-shell .app-topbar { height:56px!important; min-height:56px!important; }
  .zp-design-note { left:10px!important; right:10px!important; bottom:10px!important; max-width:none!important; }
  body:has(#profile-panel:not(.hidden)) .zp-design-note { display:none!important; }
}
@media(prefers-reduced-motion:reduce) { #app-shell *,#app-shell *::before,#app-shell *::after { transition:none!important; animation:none!important; } }
/* Read-only account device list: no coordinates or session actions on web. */
.device-session-list{display:grid;gap:10px;margin-top:14px}
.device-session-row{display:grid;gap:4px;padding:13px 15px;border:1px solid var(--line,#e7edf5);border-radius:14px;background:var(--surface,#fff)}
.device-session-row strong{font-size:14px;color:var(--ink,#182c45)}
.device-session-row span{font-size:12px;color:var(--muted,#708096);line-height:1.5}
.device-sessions-panel{margin-top:16px}