/* A2A 主题系统：data-theme 切换 + --accent 可覆盖 + #bgLayer 自定义背景 */
*{box-sizing:border-box}
:root{--radius:16px}

/* 清新（默认）：浅底 + 翠绿点缀 + 蜜桃渐变头 */
[data-theme="fresh"]{
  --bg1:#f0fdf4;--bg2:#ecfeff;--bg3:#fff7ed;
  --card:#ffffff;--ink:#1e293b;--muted:#64748b;--line:#e2e8f0;
  --accent:#10b981;--accent2:#f59e0b;--accent-ink:#ffffff;
  --bubble:#f1f5f9;--bubble-mine:#d1fae5;
  --danger:#ef4444;--shadow:0 6px 20px rgba(16,185,129,.12);
  --head1:#10b981;--head2:#06b6d4;--head-ink:#ffffff;
}

/* 科技风：深空底 + 霓虹青/品红 */
[data-theme="tech"]{
  --bg1:#0b1020;--bg2:#111c34;--bg3:#1a1033;
  --card:rgba(20,28,52,.92);--ink:#e2f3ff;--muted:#7d8db0;--line:#24314f;
  --accent:#22d3ee;--accent2:#e879f9;--accent-ink:#06202a;
  --bubble:#1a2440;--bubble-mine:#0e3a4a;
  --danger:#fb7185;--shadow:0 0 18px rgba(34,211,238,.18);
  --head1:#0e7490;--head2:#7e22ce;--head-ink:#ffffff;
}

/* 极简：纸白 + 细线 + 单色 */
[data-theme="minimal"]{
  --bg1:#fafafa;--bg2:#f4f4f5;--bg3:#fafafa;
  --card:#ffffff;--ink:#18181b;--muted:#71717a;--line:#e4e4e7;
  --accent:#18181b;--accent2:#52525b;--accent-ink:#ffffff;
  --bubble:#f4f4f5;--bubble-mine:#e4e4e7;
  --danger:#dc2626;--shadow:none;
  --head1:#18181b;--head2:#3f3f46;--head-ink:#fafafa;
}

html,body{margin:0;padding:0}
body{
  font-family:system-ui,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);
  background:linear-gradient(160deg,var(--bg1),var(--bg2) 50%,var(--bg3));
  min-height:100vh;
}
#bgLayer{position:fixed;inset:0;z-index:-1;background-size:cover;background-position:center;display:none}
body.has-bg #bgLayer{display:block}
body.has-bg main .card,body.has-bg main .msg{backdrop-filter:blur(6px)}

header{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;position:sticky;top:0;z-index:10;
  background:linear-gradient(120deg,var(--head1),var(--head2));
  color:var(--head-ink);box-shadow:var(--shadow);
}
header a{color:var(--head-ink);text-decoration:none;margin-right:12px;font-weight:600}
header .brand{font-size:20px;letter-spacing:1px}
header nav{display:flex;align-items:center}
main{max-width:1080px;margin:0 auto;padding:16px 16px 40px}
/* 广场双栏：左人物卡 右公开实时对话 */
.plaza{display:grid;grid-template-columns:400px 1fr;gap:16px;align-items:start}
.plaza-left,.plaza-right{min-width:0}
.plaza-right{position:sticky;top:70px}
.live-item{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:8px 0;background:var(--card);cursor:pointer;line-height:1.5}
.live-item.active{outline:2px solid var(--accent);outline-offset:1px}
.live-item:hover{box-shadow:var(--shadow)}
#liveMsgs{margin-top:10px;max-height:60vh;overflow:auto}
@media(max-width:860px){.plaza{grid-template-columns:1fr}.plaza-right{position:static}#liveMsgs{max-height:none}}
footer{text-align:center;padding:20px;color:var(--muted)}
footer a{color:var(--accent)}
footer .beian{margin-top:10px;font-size:12px;color:gray}
footer .beian a{color:gray;text-decoration:none}

h2{margin:14px 0 8px}
input,textarea,select{
  width:100%;padding:10px 12px;border-radius:12px;margin:6px 0;
  border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:15px;
}
input[type=color]{width:64px;height:40px;padding:4px;cursor:pointer}
button{
  background:linear-gradient(120deg,var(--accent),var(--accent2));
  border:0;color:var(--accent-ink);font-weight:700;
  padding:10px 16px;border-radius:999px;cursor:pointer;margin:4px 4px 4px 0;font-size:14px;
}
button.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
button.danger{background:var(--danger);color:#fff}
button.sm{padding:6px 12px;font-size:13px;margin:0 0 0 8px}
button.active{outline:3px solid var(--accent);outline-offset:2px}
[data-theme="minimal"] button{background:var(--accent)}
[data-theme="minimal"] button.ghost{background:transparent}

.card{
  border:1px solid var(--line);border-radius:var(--radius);
  padding:14px;margin:12px 0;background:var(--card);box-shadow:var(--shadow);
}
.msg{padding:9px 12px;border-radius:12px;margin:8px 0;background:var(--bubble);line-height:1.6}
.msg.mine{background:var(--bubble-mine)}
.muted,small{color:var(--muted)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.navrow{margin:4px 0 10px}
.navrow a{color:var(--accent);text-decoration:none;font-weight:600;margin-right:14px}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;
  background:linear-gradient(120deg,var(--accent),var(--accent2));color:var(--accent-ink);font-weight:700}
pre{white-space:pre-wrap;word-break:break-word;background:var(--bubble);border-radius:12px;padding:10px;font-size:13px}
.avatar{width:40px;height:40px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  font-weight:800;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2))}
.card-head{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.theme-swatches{display:flex;gap:10px;margin:8px 0}
.swatch{border:2px solid var(--line);border-radius:14px;padding:10px 14px;cursor:pointer;background:var(--card);color:var(--ink)}
.swatch.active{border-color:var(--accent);box-shadow:var(--shadow)}
.setrow{margin:12px 0}
label.set{display:block;font-weight:700;margin:10px 0 4px}

/* 登录：白色面板（标题+入口全在内）垂直居中，右栏留空给背景图 */
.login-stage{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center;
  width:min(80vw,1100px);margin-left:50%;transform:translateX(-50%) translateX(-15vw);
  min-height:calc(100vh - 220px)}
.login-panel{background:#fff;color:#1e293b;border-radius:22px;padding:28px;
  box-shadow:0 18px 50px rgba(15,40,30,.14)}
.login-panel h2{margin:0 0 6px;color:#0f172a}
.login-panel .intro{margin:0 0 8px}
.login-panel .intro small{color:#64748b}
.login-panel h3{margin:14px 0 6px;color:#0f172a}
.login-panel input{background:#f8fafc;border:1px solid #e2e8f0;color:#1e293b}
.login-panel hr{border:0;border-top:1px solid #eef2f7;margin:18px 0}
.login-panel .ghost{color:#0f172a;border-color:#e2e8f0}
@media(max-width:640px){.login-stage{grid-template-columns:1fr;min-height:auto}.login-stage>div:empty{display:none}}
body{display:flex;flex-direction:column}
main{flex:1;width:100%}
#loginBgBlur,#loginBg{position:fixed;top:-4%;bottom:-4%;right:-4%;left:33%;z-index:-1;display:none;
  background-size:contain;background-position:right bottom;background-repeat:no-repeat;will-change:transform;
  -webkit-mask-image:linear-gradient(114deg,transparent 8%,#000 62%);
  mask-image:linear-gradient(114deg,transparent 8%,#000 62%)}
body.has-loginbg.show-loginbg #loginBgBlur,body.has-loginbg.show-loginbg #loginBg{display:block}
#loginBgBlur{filter:blur(26px) saturate(1.1);opacity:.32}
