:root{
  --bg:#0f1420; --panel:#171e2e; --panel2:#1e2740; --line:#2b3550;
  --ink:#e6ebf5; --dim:#9aa7c2; --acc:#4f8cff; --good:#38c172; --warn:#e0a800; --bad:#e3524f;
  --left-panel-width:230px; --right-panel-width:42%;
}
*{box-sizing:border-box}
body{margin:0;font:14px/1.5 -apple-system,"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--ink)}
header{display:flex;align-items:center;gap:8px;padding:9px 18px;background:var(--panel);border-bottom:1px solid var(--line)}
header h1{margin:0;font-size:18px;color:var(--acc)}
header .sub{color:var(--dim);font-size:13px}
.badge{font-size:12px;color:var(--dim);background:var(--panel2);padding:3px 10px;border-radius:20px;border:1px solid var(--line)}
.header-spacer{flex:1}
.layout{display:grid;grid-template-columns:var(--left-panel-width) 7px minmax(340px,1fr) 7px var(--right-panel-width);height:calc(100vh - 50px);overflow:hidden}
.sidebar,.center,.pdfpane{overflow:auto;padding:14px}
.sidebar{background:var(--panel)}
.pdfpane{background:var(--panel);display:flex;flex-direction:column;padding:10px}
.panel-resizer{position:relative;z-index:4;width:7px;cursor:col-resize;touch-action:none;background:var(--bg);outline:none}
.panel-resizer::after{content:"";position:absolute;top:0;bottom:0;left:3px;width:1px;background:var(--line);transition:width .12s,left .12s,background .12s}
.panel-resizer:hover::after,.panel-resizer:focus-visible::after,.panel-resizer.dragging::after{left:1px;width:5px;background:var(--acc)}
body.resizing-panels{cursor:col-resize;user-select:none}
body.resizing-panels iframe{pointer-events:none}
.row{display:flex;gap:6px;align-items:center;margin-bottom:10px}
input,select,button{font:inherit;color:var(--ink);background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:6px 9px}
input:disabled{opacity:.7;cursor:not-allowed}
input[type=file]{padding:3px;font-size:12px}
button{cursor:pointer;background:var(--acc);border-color:var(--acc);color:#fff}
button:hover{filter:brightness(1.1)}
button.secondary{background:var(--panel2);border-color:var(--line);color:var(--ink)}
button.danger{background:var(--bad);border-color:var(--bad)}
button.small{padding:3px 8px;font-size:12px;white-space:nowrap}
button.wide{width:100%;padding:9px;margin-top:6px}
button.tab{background:var(--panel2);color:var(--dim);border-color:var(--line)}
button.tab.active{background:var(--acc);color:#fff;border-color:var(--acc)}
.proj-list{list-style:none;margin:0;padding:0}
.proj-list li{padding:8px 10px;border-radius:6px;cursor:pointer;color:var(--dim);border:1px solid transparent}
.proj-list li:hover{background:var(--panel2)}
.proj-list li.active{background:var(--panel2);color:var(--ink);border-color:var(--acc)}
.proj-list li small{display:block;color:#66738f;font-size:11px}
.hidden{display:none}
.uploads{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
.up{font-size:12px;color:var(--dim);display:flex;flex-direction:column;gap:3px}
.status{color:var(--dim);min-height:20px}
.status.err{color:var(--bad)} .status.busy{color:var(--warn)}
iframe#pdf{flex:1;width:100%;border:1px solid var(--line);border-radius:6px;background:#fff}
.hint{color:#66738f;font-size:11px;margin-left:auto}
h2{font-size:16px;margin:6px 0} h3{font-size:14px;color:var(--acc);margin:18px 0 6px}
.cards{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
.card{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 14px;min-width:110px}
.card .k{color:var(--dim);font-size:12px} .card .v{font-size:20px;font-weight:600}
table{width:100%;border-collapse:collapse;margin:6px 0;font-size:13px}
th,td{border:1px solid var(--line);padding:5px 8px;text-align:left}
th{background:var(--panel2);color:var(--dim);font-weight:500}
td.num,th.num{text-align:right}
.pill{display:inline-block;padding:1px 7px;border-radius:10px;font-size:12px}
.pill.red{background:rgba(227,82,79,.2);color:#ff8f8c} .pill.yellow{background:rgba(224,168,0,.2);color:#f0c040}
.pill.blue{background:rgba(79,140,255,.2);color:#8fb4ff} .pill.ok{background:rgba(56,193,114,.2);color:#6fe0a0}
.pg{color:var(--acc);cursor:pointer;text-decoration:underline dotted}
.pg:hover{color:#8fb4ff}
.heat{font-variant-numeric:tabular-nums}
details{margin:4px 0} summary{cursor:pointer;color:var(--dim)}
.dl{margin-top:10px;display:flex;gap:8px}
.muted{color:var(--dim)}

/* 登录、个人信息与管理员 */
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 15%,#1b2c50 0,var(--bg) 48%)}
.auth-shell.hidden{display:none}
.auth-card{width:min(420px,100%);background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:30px;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.auth-brand{font-size:26px;font-weight:700;color:var(--acc)}
.auth-card h2{font-size:18px;margin:22px 0 12px}
.auth-card label,.modal-card label{display:flex;flex-direction:column;gap:5px;margin:11px 0;color:var(--dim)}
.auth-card input,.modal-card input{width:100%;padding:9px;color:var(--ink)}
.auth-switch{text-align:center;color:var(--dim);margin:16px 0 0}
a{color:var(--acc)}
.modal{position:fixed;inset:0;z-index:20;background:rgba(5,8,14,.78);display:grid;place-items:center;padding:24px}
.modal.hidden{display:none}
.modal-card{width:min(920px,96vw);max-height:90vh;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;box-shadow:0 25px 90px rgba(0,0,0,.55)}
.modal-card.narrow{width:min(520px,96vw)}
.modal-card.admin-card{width:min(1220px,96vw)}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.modal-head h2{margin:0}
.modal-head p{margin:4px 0 0}
.modal-head .close{font-size:22px;line-height:1;padding:3px 9px}
.modal-card hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.table-scroll{overflow:auto}
#userTable td:first-child small{display:block;color:var(--dim);white-space:nowrap}
#userTable td{vertical-align:middle}
.admin-tabs{display:flex;gap:8px;margin:18px 0 10px;border-bottom:1px solid var(--line);padding-bottom:10px}
.login-log-filters{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:4px 0 10px}
.login-log-filters label{margin:0;min-width:180px;flex:1}
.login-log-filters label:nth-child(2){min-width:240px;flex:1.4}
.login-log-filters select,.login-log-filters input{width:100%;min-height:34px}
.login-log-filters button{min-height:34px}
#loginLogTable{min-width:980px}
#loginLogTable td{vertical-align:top}
#loginLogTable td:first-child{white-space:nowrap}
.login-user small{display:block;color:var(--dim);white-space:nowrap}
.login-ip{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.login-device{max-width:280px;color:var(--dim);font-size:12px;word-break:break-word}
.login-log-actions{display:flex;align-items:center;gap:12px;margin-top:10px}
.login-log-actions .muted{font-size:12px}

@media (max-width:1000px){
  .layout{grid-template-columns:210px 1fr;height:auto;min-height:calc(100vh - 50px)}
  .panel-resizer{display:none}
  .pdfpane{grid-column:1/-1;height:70vh;border-left:0;border-top:1px solid var(--line)}
  header .sub,#backend{display:none}
  .login-log-filters label,.login-log-filters label:nth-child(2){min-width:100%;flex-basis:100%}
}

/* 逐步测试 */
.trace-bar { margin: 8px 0; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.trace-bar button { padding: 4px 10px; }
#trace { margin-top: 10px; border-top: 1px dashed var(--border, #ccc); padding-top: 10px; }
#trace h4 { margin: 12px 0 4px; font-size: 13px; }
.trace-bar button.primary { background: var(--acc, #4f8cff); color: #fff; font-weight: 600; }
.trace-bar button.big { padding: 8px 18px; font-size: 15px; border-radius: 8px; }
.trace-bar .dbg { display: inline-block; margin-left: 12px; }
.trace-bar .dbg > summary { cursor: pointer; color: var(--dim); font-size: 12px; list-style: none; }
.trace-bar .dbg[open] > summary { margin-bottom: 6px; }
.trace-bar .dbg button { margin: 2px 4px 2px 0; padding: 3px 8px; font-size: 12px; }
#traceStatus { position: sticky; top: 0; background: var(--panel, #14161c); padding: 6px 0; z-index: 2; font-weight: 600; }
.trace-step { border-top: 2px solid var(--acc, #4f8cff); margin-top: 14px; padding-top: 6px; }
.trace-step h3 { font-size: 14px; margin: 4px 0; }
.step-name { font-size: 14px; margin: 14px 0 2px; color: var(--acc, #4f8cff); }
.err { color: #c0392b; }

/* 右侧 LLM 对话原始记录 */
#logpane { flex: 1; overflow: auto; border: 1px solid var(--line); border-radius: 6px; padding: 10px; font-size: 12px; }
.llm-item { border-top: 2px solid var(--acc, #4f8cff); margin-top: 12px; padding-top: 6px; }
.llm-h { font-size: 13px; margin-bottom: 4px; }
.llm-sub { color: var(--dim); margin: 8px 0 2px; font-weight: 600; }
#logpane pre { white-space: pre-wrap; word-break: break-word; background: var(--panel2, #1b1e26); border: 1px solid var(--line); border-radius: 5px; padding: 8px; margin: 0; max-height: 340px; overflow: auto; }
