:root {
  --bg: #0e0e12; --panel: #17171f; --panel2: #1e1e28;
  --text: #e6e6ea; --muted: #8a8a99; --accent: #b06dff; --accent2:#d76d77;
  --user: #2a2440; --ai: #1b1b24; --border:#2a2a36;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; } /* 覆盖 .work-view{display:flex} / .gallery{display:grid} 对 hidden 的优先级 */
body { margin:0; font-family:"Segoe UI","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--text); }
#topbar { display:flex; align-items:baseline; gap:12px; padding:14px 22px; border-bottom:1px solid var(--border); background:var(--panel); }
.brand { font-size:18px; font-weight:700; color:var(--accent); cursor:pointer; }
.sub { color:var(--muted); font-size:13px; }

.category-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:18px 24px 0; }
.category-tab { background:var(--panel2); color:var(--muted); border:1px solid var(--border); border-radius:8px; padding:8px 14px; cursor:pointer; font:inherit; }
.category-tab:hover, .category-tab.active { color:var(--text); border-color:var(--accent); background:rgba(176,109,255,.14); }

.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; padding:24px; }
.card { border-radius:14px; overflow:hidden; background:var(--panel); border:1px solid var(--border); cursor:pointer; transition:transform .12s,border-color .12s; }
.card:hover { transform:translateY(-4px); border-color:var(--accent); }
.card .cover { height:120px; position:relative; background:var(--cover-fallback); overflow:hidden; }
.card .cover-image { width:100%; height:100%; display:block; object-fit:cover; transition:opacity .2s ease; }
.card .cover-fallback { background:var(--cover-fallback); }
.card .body { padding:14px; }
.card .title { font-size:16px; font-weight:700; margin:0 0 6px; }
.card .intro { color:var(--muted); font-size:13px; line-height:1.5; margin:0 0 10px; }
.tags { display:flex; flex-wrap:wrap; gap:6px; }
.tag { font-size:11px; color:var(--accent); background:rgba(176,109,255,.12); padding:2px 8px; border-radius:10px; }
.tag.category { color:#d6c1ff; border:1px solid rgba(176,109,255,.36); }
.tag.adult { color:#ffb4c4; background:rgba(215,109,119,.18); }

.work-view { display:block; min-height:calc(100vh - 51px); }
.status-panel { background:var(--panel); padding:18px; }
.status-drawer { margin:12px 22px 0; border:1px solid var(--border); border-radius:14px; background:rgba(23,23,31,.94); box-shadow:0 12px 34px rgba(0,0,0,.24); }
.status-title { font-weight:700; color:var(--accent); }
.status-body { background:var(--panel2); border-radius:10px; padding:12px; font-size:13px; line-height:1.9; white-space:pre-wrap; min-height:0; }

/* 权威状态卡：阶段徽章 + 数值条 + 风味行 + 记忆 */
.stage-badge { display:inline-block; background:rgba(176,109,255,.16); color:var(--accent); border:1px solid var(--accent); border-radius:20px; padding:3px 12px; font-size:12px; font-weight:700; margin-bottom:12px; }
.stat { margin-bottom:12px; }
.stat-head { display:flex; justify-content:space-between; font-size:12px; color:var(--muted); margin-bottom:4px; }
.stat-num { color:var(--text); font-weight:700; }
.stat-track { height:8px; background:#101018; border-radius:6px; overflow:hidden; }
.stat-fill { height:100%; background:linear-gradient(90deg,var(--accent2),var(--accent)); border-radius:6px; transition:width .35s ease; }
.stat-flavor { margin-top:8px; padding-top:10px; border-top:1px solid var(--border); font-size:12px; color:var(--muted); white-space:pre-wrap; line-height:1.7; }
.stat-memory { margin-top:10px; padding-top:10px; border-top:1px solid var(--border); }
.stat-memory .mem-title { font-size:11px; color:var(--accent); font-weight:700; margin-bottom:4px; }
.stat-memory .mem-item { font-size:12px; color:var(--muted); line-height:1.6; }
.model-switch { display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--muted); }
.model-switch.compact { flex-direction:row; align-items:center; gap:8px; }
.model-switch select { background:var(--panel2); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:8px; }
.model-help { color:var(--muted); font-size:11px; line-height:1.55; }
.tool-btn { background:transparent; color:var(--muted); border:1px solid var(--border); border-radius:8px; padding:9px 12px; cursor:pointer; font:inherit; }
.tool-btn:hover, .tool-btn[aria-expanded="true"], .tool-btn[aria-pressed="true"] { color:var(--text); border-color:var(--accent); background:rgba(176,109,255,.14); }
.game-fav[aria-pressed="true"] { color:#fff; border-color:var(--accent); background:linear-gradient(135deg,rgba(176,109,255,.34),rgba(215,109,119,.24)); }
.work-back-btn {
  position:sticky;
  top:10px;
  z-index:9;
  width:max-content;
  margin:12px 22px 0;
  background:rgba(23,23,31,.9);
  backdrop-filter:blur(10px);
}

.chat-area { --scene-image:none; position:relative; min-width:0; min-height:calc(100vh - 51px); display:block; padding-bottom:24px; background-image:linear-gradient(rgba(14,14,18,.9),rgba(14,14,18,.96)),var(--scene-image); background-size:cover; background-position:center; background-attachment:fixed; transition:background-image .25s ease; }
.launch-panel { margin:16px 22px 0; border:1px solid var(--border); border-radius:18px; background:rgba(18,18,25,.96); box-shadow:0 18px 50px rgba(0,0,0,.28); }
.launch-hero { position:relative; min-height:220px; overflow:hidden; display:flex; align-items:flex-end; }
.launch-scene-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.launch-hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,7,12,.93) 0%,rgba(7,7,12,.58) 58%,rgba(7,7,12,.18) 100%),linear-gradient(0deg,rgba(7,7,12,.85),transparent 70%); }
.launch-hero-content { position:relative; z-index:1; max-width:760px; padding:26px 28px; }
.launch-badges { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
.launch-badge { border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:4px 9px; color:#f0e8ff; background:rgba(15,13,25,.48); font-size:11px; }
.launch-location { color:#d8baff; font-size:12px; font-weight:700; letter-spacing:.04em; }
.launch-title { margin:6px 0 8px; font-size:30px; line-height:1.15; }
.launch-conflict { max-width:720px; margin:0; color:#fff; font-size:15px; line-height:1.65; }
.launch-content { padding:20px 24px 24px; }
.launch-section { margin-bottom:20px; }
.launch-section-label { margin-bottom:10px; color:var(--accent); font-size:12px; font-weight:800; letter-spacing:.12em; }
.launch-background { margin:0; padding:13px 15px; border-left:3px solid var(--accent); background:var(--panel2); color:#d8d8df; line-height:1.7; }
.launch-roster { display:grid; grid-template-columns:minmax(210px,.8fr) minmax(0,2fr); gap:12px; }
.cast-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.persona-card { min-width:0; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--panel2); }
.persona-card.player-card { border-color:rgba(176,109,255,.65); background:linear-gradient(145deg,rgba(176,109,255,.16),var(--panel2)); }
.persona-eyebrow { margin-bottom:7px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.persona-name { color:#fff; font-size:15px; font-weight:800; }
.persona-role { min-height:36px; margin:4px 0 9px; color:#cdbbe3; font-size:12px; line-height:1.5; }
.persona-detail { margin-top:5px; color:#d8d8df; font-size:11px; line-height:1.55; }
.persona-muted { color:var(--muted); }
.launch-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.launch-action { position:relative; display:grid; grid-template-columns:auto 1fr; gap:3px 10px; min-height:92px; padding:13px; text-align:left; color:var(--text); border:1px solid var(--border); border-radius:12px; background:linear-gradient(145deg,var(--panel2),#191723); cursor:pointer; }
.launch-action:hover { border-color:var(--accent); transform:translateY(-2px); }
.launch-action-index { grid-row:1 / span 2; color:var(--accent); font-size:11px; font-weight:800; }
.launch-action-label { font-size:14px; font-weight:800; }
.launch-action-desc { color:var(--muted); font-size:11px; line-height:1.5; }
.customization-panel { border-top:1px solid var(--border); padding-top:14px; color:var(--muted); }
.customization-panel summary { width:max-content; color:#cdbbe3; font-size:12px; cursor:pointer; }
.customization-hint { margin:9px 0; font-size:11px; }
.customization-fields { display:grid; grid-template-columns:1fr 1.5fr auto; gap:10px; align-items:end; }
.customization-fields label { display:flex; flex-direction:column; gap:5px; font-size:11px; }
.customization-fields input { min-width:0; padding:9px 10px; border:1px solid var(--border); border-radius:8px; background:#111118; color:var(--text); }
.customization-fields button { height:36px; padding:0 14px; border:1px solid var(--accent); border-radius:8px; background:rgba(176,109,255,.15); color:#eadbff; cursor:pointer; }
.launch-panel:not([hidden]) ~ .chat-log { padding-top:14px; padding-bottom:10px; }
.scene-panel { margin:16px 22px 0; border:1px solid var(--border); border-radius:14px; overflow:hidden; background:rgba(23,23,31,.86); backdrop-filter:blur(10px); }
.scene-toolbar { display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid var(--border); font-size:12px; }
.scene-title { color:var(--accent); font-weight:700; }
.scene-toggle { margin-left:auto; color:var(--muted); display:flex; align-items:center; gap:5px; }
.scene-toolbar button { background:transparent; color:var(--muted); border:1px solid var(--border); border-radius:7px; padding:4px 8px; cursor:pointer; }
.scene-toolbar button:hover { color:var(--text); border-color:var(--accent); }
.scene-status { color:var(--muted); min-width:92px; text-align:right; }
.scene-image { width:100%; max-height:260px; display:block; object-fit:cover; }
.scene-caption { padding:8px 12px; color:var(--muted); font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-log { min-height:180px; padding:22px; display:flex; flex-direction:column; gap:14px; }
.msg { max-width:min(1120px,92%); padding:12px 15px; border-radius:12px; line-height:1.7; white-space:pre-wrap; word-break:break-word; }
.msg.user { align-self:flex-end; background:var(--user); }
.msg.ai { align-self:flex-start; background:var(--ai); border:1px solid var(--border); }
.msg.error { align-self:flex-start; background:#3a1c1c; border:1px solid #5a2a2a; color:#ffb4b4; }

.greeting-bar { padding:14px 22px; display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--border); }
.greeting-bar .g-title { color:var(--muted); font-size:13px; }
.greeting-opt { text-align:left; background:var(--panel2); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:12px; cursor:pointer; line-height:1.6; }
.greeting-opt:hover { border-color:var(--accent); }

.composer-shell { position:sticky; bottom:0; z-index:8; padding:10px 22px 16px; border-top:1px solid var(--border); background:linear-gradient(180deg,rgba(14,14,18,.7),var(--panel) 30%); backdrop-filter:blur(12px); }
.game-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:10px; }
.game-toolbar .model-help { flex:1 1 260px; min-width:220px; }
.composer-shell .status-drawer { margin:0 0 10px; padding:12px; max-height:min(360px,42vh); overflow:auto; box-shadow:none; }
.composer-shell .status-title { margin-bottom:8px; }
.input-form { display:flex; gap:10px; }
.input-form textarea { flex:1; resize:none; background:var(--panel2); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:12px; font-family:inherit; font-size:14px; }
.input-form button { background:var(--accent); color:#fff; border:none; border-radius:10px; padding:0 22px; font-weight:700; cursor:pointer; }
.input-form button:disabled { opacity:.5; cursor:not-allowed; }

@media (max-width: 980px) {
  .launch-roster { grid-template-columns:1fr; }
  .cast-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .launch-actions { grid-template-columns:1fr; }
}

@media (max-width: 720px) {
  .work-view { min-height:calc(100vh - 51px); }
  .status-drawer { margin:10px 10px 0; padding:12px; }
  .chat-area { min-height:calc(100vh - 51px); }
  .launch-panel { margin:10px 10px 0; }
  .launch-hero { min-height:190px; }
  .launch-hero-content { padding:20px; }
  .launch-title { font-size:24px; }
  .launch-content { padding:16px; }
  .cast-grid { grid-template-columns:1fr; }
  .customization-fields { grid-template-columns:1fr; }
  .scene-panel { margin:10px 10px 0; }
  .chat-log { padding:14px 10px; }
  .msg { max-width:96%; }
  .work-back-btn { top:8px; margin:10px 10px 0; }
  .composer-shell { padding:10px; }
  .game-toolbar { gap:8px; }
  .game-toolbar .model-help { flex-basis:100%; min-width:0; }
  .model-switch.compact { flex:1 1 140px; }
  .input-form { align-items:stretch; }
}