/* Copyright (c) 2026 印广云。适用根 LICENSE。 */
[hidden], #webNativeCompatibility { display: none !important; }
.web-export-format { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #665d50; }
.web-export-format select { padding: 5px; border-radius: 6px; border: 1px solid #ddd2c4; background: white; }
body[data-runtime="web"] .titlebar { -webkit-app-region: no-drag; }

/* Static swatches remain external under the production self-only CSP. */
[data-web-swatch="#fff"] { --swatch: #fff; }
[data-web-swatch="#E60012"] { --swatch: #E60012; }
[data-web-swatch="#438BDE"] { --swatch: #438BDE; }
[data-web-ai-color="#FFFFFF"] { --ai-color: #FFFFFF; }
[data-web-ai-color="#E60012"] { --ai-color: #E60012; }
[data-web-ai-color="#438BDE"] { --ai-color: #438BDE; }
[data-web-swatch="#000000"] { --swatch: #000000; }
[data-web-swatch="#FF0000"] { --swatch: #FF0000; }
[data-web-swatch="#2563EB"] { --swatch: #2563EB; }
[data-web-swatch="#8B5CF6"] { --swatch: #8B5CF6; }
[data-web-swatch="#999999"] { --swatch: #999999; }
[data-web-swatch="#111827"] { --swatch: #111827; }
/* Account controls stay available while the image workspace is connecting. */
body[data-runtime="web"] .titlebar { display:flex; align-items:center; gap:10px; min-height:52px; padding:8px 24px; box-sizing:border-box; background:#fff; border-bottom:1px solid #e9edf3; z-index:30; }
.web-account-controls { margin-left:auto; display:flex; align-items:center; gap:16px; position:relative; }
#webGuestLabel { font-size:12px; color:#8691a3; }
.web-account-button { display:flex; align-items:center; gap:9px; padding:5px 12px 5px 5px; border:1px solid #e8edf3; border-radius:24px; background:#fff; color:#23324b; font:inherit; font-size:13px; cursor:pointer; }
.web-account-button:hover { border-color:#ffad98; background:#fff8f5; }
.web-account-avatar { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#fff0e9; color:#ed6847; font-size:12px; font-weight:700; }
#webAccountLabel { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.web-account-menu { position:absolute; right:0; top:calc(100% + 10px); width:156px; padding:6px; border:1px solid #e8edf3; border-radius:12px; background:#fff; box-shadow:0 10px 30px #21304716; }
.web-account-menu button { display:block; width:100%; padding:11px 12px; text-align:left; border:0; background:transparent; border-radius:7px; color:#34435b; cursor:pointer; }
.web-account-menu button:hover { background:#fff4ed; color:#df5738; }
.web-login-dialog { box-sizing:border-box; width:min(440px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; border:1px solid #edf0f4; border-radius:22px; padding:36px; color:#192c47; background:#fff; box-shadow:0 24px 90px #13223e28; }
.web-login-dialog::backdrop { background:#16233e55; backdrop-filter:blur(3px); }
.web-login-close { position:absolute; top:12px; right:14px; width:32px; height:32px; border:0; border-radius:50%; background:transparent; color:#7d8899; font-size:24px; cursor:pointer; }
.web-login-close:hover { background:#f4f6f9; }
.web-login-brand { display:flex; align-items:center; gap:10px; margin-bottom:28px; font-size:18px; font-weight:750; }
.web-login-brand img { width:40px; height:40px; object-fit:contain; }
.web-login-brand span span { display:block; margin-top:2px; font-size:11px; letter-spacing:2px; font-weight:400; color:#8a96a8; }
.web-login-dialog h2 { margin:0 0 9px; font-size:26px; letter-spacing:-.5px; }
.web-login-description { margin:0 0 25px; color:#8490a3; font-size:13px; line-height:1.8; }
#webLoginForm label { display:block; margin-top:16px; font-size:13px; font-weight:600; }
#webLoginForm input { box-sizing:border-box; width:100%; height:46px; margin-top:8px; padding:0 13px; border:1px solid #dfe5ed; border-radius:9px; background:#fafbfc; font:inherit; font-weight:400; color:#192c47; }
#webLoginForm input:focus { outline:2px solid #ffceb9; border-color:#fb906f; background:#fff; }
.web-login-help,.web-login-options { display:flex; justify-content:space-between; align-items:center; gap:8px; color:#8993a3; font-size:12px; }
.web-login-help { margin:12px 0 22px; }
.web-login-help button,.web-login-options button { border:0; padding:0; background:transparent; font:inherit; color:#df6648; cursor:pointer; }
.web-login-submit { width:100%; height:46px; border:0; border-radius:10px; background:#ff704f; color:white; font:inherit; font-weight:650; cursor:pointer; }
.web-login-submit:hover { background:#f36443; }
.web-login-submit:disabled { opacity:.65; cursor:wait; }
.web-login-options { margin:18px 0 24px; }
.web-login-options span button { margin-left:5px; }
.web-login-continue { width:100%; border:0; border-top:1px solid #eef1f5; padding:20px 0 0; background:transparent; color:#8792a3; font:inherit; font-size:12px; cursor:pointer; }
.web-account-error { margin:8px 0 14px; font-size:12px; line-height:1.6; color:#ce4c36; }
@media(max-width:640px) { body[data-runtime="web"] .titlebar { padding:8px 12px; } #webGuestLabel { display:none; } .titlebar-name { font-size:13px; } .web-login-dialog { padding:28px; } }
