:root{--bg:#f4f5f7;--card:#fff;--line:#d9dde3;--ink:#1c2430;--mute:#667085;--brand:#0b5fff;--brand2:#e8f0ff;--warn:#b54708;--ok:#067647;--bad:#b42318;font:13px/1.35 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink)}
#app{height:100%;display:flex;flex-direction:column}
button,select,input{font:inherit}
.btn{border:1px solid var(--line);background:#fff;border-radius:6px;padding:5px 10px;cursor:pointer;color:var(--ink)}
.btn:hover{background:#f0f2f5}.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}.btn.primary:hover{background:#094fd6}
.btn:disabled{opacity:.5;cursor:not-allowed}
.top{display:flex;align-items:center;gap:8px;padding:6px 12px;background:#0f1b2d;color:#fff;flex-wrap:wrap}
.top .logo{font-weight:800;font-size:16px;letter-spacing:.2px;margin-right:8px}.top .logo b{color:#5ea0ff}
.top .sp{flex:1}.top .who{opacity:.85}.badge{background:#25374f;border-radius:10px;padding:1px 8px;font-size:11px;text-transform:uppercase;letter-spacing:.4px}
.top .btn{background:#1c2c44;border-color:#2c4160;color:#fff}.top .btn:hover{background:#27405f}
.banner{background:#fff4e5;color:#7a3e00;border-bottom:1px solid #ffd8a8;padding:5px 12px;font-size:12px}
.tools{display:flex;gap:8px;align-items:center;padding:7px 12px;background:var(--card);border-bottom:1px solid var(--line);flex-wrap:wrap}
.tools input[type=search],.tools select{border:1px solid var(--line);border-radius:6px;padding:5px 8px;background:#fff}
.tools input[type=search]{width:220px}
.chip{border:1px solid var(--line);border-radius:14px;padding:3px 10px;background:#fff;cursor:pointer;user-select:none}
.chip.on{background:var(--brand2);border-color:var(--brand);color:var(--brand);font-weight:600}
.count{color:var(--mute);margin-left:auto}
.gridwrap{flex:1;min-height:0;display:flex;position:relative}
.scroller{flex:1;overflow:auto;background:#fff;position:relative}
.hdr{position:sticky;top:0;z-index:5;display:flex;background:#eef1f5;border-bottom:1px solid var(--line);height:30px}
.hc{position:relative;flex:none;padding:0 8px;line-height:30px;font-weight:600;border-right:1px solid var(--line);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;background:#eef1f5}
.hc .rz{position:absolute;right:0;top:0;bottom:0;width:6px;cursor:col-resize}.hc .rz:hover{background:var(--brand)}
.hc.pin,.cell.pin{position:sticky;z-index:4}
.rows{position:relative}
.row{position:absolute;left:0;display:flex;height:28px;border-bottom:1px solid #eceff3;background:#fff}
.row:hover .cell{background:#f6f9ff}.row.sel .cell{background:var(--brand2)}.row.cur .cell{background:#dce8ff}
.cell{flex:none;padding:0 8px;line-height:27px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #f0f2f5;background:inherit}
.row .cell.pin{background:#fff}.row:hover .cell.pin{background:#f6f9ff}.row.sel .cell.pin{background:var(--brand2)}
.cell a{color:var(--brand);text-decoration:none}.cell a:hover{text-decoration:underline}
.cell.note{cursor:text;color:#344054}.cell.note.empty{color:#98a2b3}
.cell.note input{width:100%;height:24px;margin-top:1px;border:1px solid var(--brand);border-radius:4px;padding:0 6px}
.tag{display:inline-block;border-radius:10px;padding:0 8px;font-size:11px;line-height:18px;font-weight:600}
.tag.yes{background:#dcfae6;color:var(--ok)}.tag.dnd{background:#fee4e2;color:var(--bad)}.tag.stage{background:#eef4ff;color:#3538cd}.tag.un{background:#f2f4f7;color:var(--mute)}
.panel{width:380px;max-width:100%;border-left:1px solid var(--line);background:#fff;display:flex;flex-direction:column;overflow:hidden}
.panel h3{margin:0;padding:10px 12px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.panel .body{overflow:auto;padding:10px 12px;flex:1}
.panel dl{display:grid;grid-template-columns:110px 1fr;gap:3px 8px;margin:0 0 12px}.panel dt{color:var(--mute)}.panel dd{margin:0;word-break:break-word}
.panel textarea{width:100%;min-height:64px;border:1px solid var(--line);border-radius:6px;padding:6px;font:inherit}
.nt{border-top:1px solid #eceff3;padding:6px 0}.nt small{color:var(--mute)}.nt .ghl{color:#7a5af8;font-weight:600}
.pop{position:absolute;z-index:20;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(16,24,40,.15);padding:8px;max-height:60vh;overflow:auto;min-width:220px}
.pop label{display:flex;gap:6px;padding:2px 0;align-items:center}
.modal{position:fixed;inset:0;background:rgba(15,27,45,.45);z-index:50;display:flex;align-items:center;justify-content:center;padding:12px}
.modal .box{background:#fff;border-radius:10px;padding:16px;width:min(560px,100%);max-height:90vh;overflow:auto}
.modal h2{margin:0 0 8px;font-size:16px}.modal .row2{display:flex;gap:8px;margin-top:12px;justify-content:flex-end}
.login{margin:auto;background:#fff;padding:24px;border-radius:12px;width:min(340px,92vw);box-shadow:0 8px 30px rgba(16,24,40,.12)}
.login h1{margin:0 0 4px;font-size:22px}.login h1 b{color:var(--brand)}.login label{display:block;margin:10px 0 3px;color:var(--mute)}
.login input{width:100%;padding:8px;border:1px solid var(--line);border-radius:6px}.err{color:var(--bad);margin-top:8px}
table.t{border-collapse:collapse;width:100%}table.t td,table.t th{border-bottom:1px solid #eceff3;padding:4px 6px;text-align:left}
.toast{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);background:#101828;color:#fff;padding:8px 14px;border-radius:8px;z-index:99}
@media(max-width:700px){.panel{position:absolute;right:0;top:0;bottom:0;width:100%;z-index:8}.tools input[type=search]{width:140px}}
@media(max-width:700px){.tools{flex-wrap:nowrap;overflow-x:auto;white-space:nowrap}.tools>*{flex:none}.top{padding:4px 8px}.top .who{display:none}.banner{display:none}.count{margin-left:8px}}