:root{
  --bg:#0b1117;--panel:#101821;--panel2:#131e28;--line:#263544;--line2:#1d2a35;
  --text:#e7edf3;--muted:#8fa2b4;--blue:#1497e7;--blue2:#0c76b8;--green:#33d17a;
  --red:#ef5b66;--amber:#f5c451;--shadow:0 18px 50px rgba(0,0,0,.32);
  font-family:"Segoe UI","Microsoft YaHei",Arial,sans-serif;color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg);color:var(--text);font:14px/1.45 "Segoe UI","Microsoft YaHei",Arial,sans-serif;overflow:hidden}
button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.app{height:100%;display:grid;grid-template-rows:64px 48px 1fr;background:linear-gradient(145deg,#0b1117,#0d151d)}
.topbar{display:grid;grid-template-columns:280px minmax(320px,720px) 1fr;gap:18px;align-items:center;padding:0 20px;border-bottom:1px solid var(--line2);background:#0d151d}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.brand .logo{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#0e80c6,#16b3e8);box-shadow:0 6px 18px rgba(20,151,231,.23)}
.searchbox{position:relative}.searchbox input{width:100%;height:38px;padding:0 42px 0 38px;border:1px solid var(--line);border-radius:10px;background:#111b24;color:var(--text);outline:none}.searchbox input:focus{border-color:#1c88ca;box-shadow:0 0 0 3px rgba(20,151,231,.12)}.searchbox .mag{position:absolute;left:13px;top:9px;color:#91a6b8}.searchbox .kbd{position:absolute;right:10px;top:8px;color:#6d8193;font-size:12px;border:1px solid #324351;border-radius:5px;padding:2px 6px}
.top-actions{justify-self:end;display:flex;align-items:center;gap:12px;color:var(--muted)}.auto-lock{display:flex;align-items:center;gap:7px;color:#7bdc9d;font-size:13px}.iconbtn{width:34px;height:34px;border:1px solid transparent;border-radius:9px;background:transparent;color:#a8b8c7;display:grid;place-items:center}.iconbtn:hover{background:#16222c;border-color:#273846;color:#fff}
.toolbar{display:flex;align-items:center;gap:8px;padding:6px 20px;border-bottom:1px solid var(--line2);background:#0f171f}.btn{height:34px;padding:0 13px;border:1px solid var(--line);border-radius:8px;background:#15212b;color:#dbe5ee;display:inline-flex;gap:7px;align-items:center;justify-content:center}.btn:hover{background:#1a2a36}.btn.primary{background:linear-gradient(#179fe9,#0d85cb);border-color:#1b9adf;color:#fff;font-weight:600}.btn.danger{color:#ff9aa1}.btn.small{height:30px;padding:0 10px;font-size:13px}
.workspace{min-height:0;display:grid;grid-template-columns:205px 350px 1fr}.sidebar,.records,.detail{min-width:0;min-height:0}.sidebar{border-right:1px solid var(--line2);background:#0d151d;padding:16px 10px;overflow:auto}.side-title{padding:6px 10px;color:#6f8496;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px}.navitem{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:#b9c7d2;margin:2px 0;user-select:none}.navitem:hover,.navitem.active{background:#152430;color:#fff}.navitem .count{margin-left:auto;color:#718597;font-size:12px}.tagdot{width:9px;height:9px;border-radius:50%;background:#27c07d;box-shadow:0 0 0 3px rgba(39,192,125,.09)}.sidebar-foot{margin-top:20px;padding:10px;color:#6d8090;font-size:12px}
.records{border-right:1px solid var(--line2);background:#101820;display:grid;grid-template-rows:42px 1fr 35px}.list-head{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--line2);font-weight:650}.list{overflow:auto}.record{padding:12px 13px;border-bottom:1px solid #18242e;display:grid;grid-template-columns:38px 1fr auto;gap:10px;cursor:pointer}.record:hover{background:#13212b}.record.active{background:linear-gradient(90deg,#15334a,#132b3b)}.record-icon{width:36px;height:36px;border-radius:11px;background:#162a38;border:1px solid #244255;display:grid;place-items:center;color:#57b9f0}.record-title{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.record-sub{font-size:12px;color:#8498a9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.badge{display:inline-block;margin-left:7px;padding:1px 7px;border-radius:999px;background:#173126;color:#66d79a;font-size:11px;border:1px solid #285040}.record-time{color:#6f8496;font-size:11px;text-align:right;line-height:1.4}.list-foot{display:flex;align-items:center;padding:0 14px;color:#718494;border-top:1px solid var(--line2);font-size:12px}
.detail{background:#111922;overflow:auto;padding:25px 30px 60px}.empty{height:100%;display:grid;place-items:center;color:#6f8394;text-align:center}.empty .big{font-size:54px;opacity:.35}.detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--line2)}.detail-title{display:flex;align-items:center;gap:9px;font-size:24px;font-weight:700}.star{border:0;background:transparent;color:#6d8191;font-size:23px;padding:0}.star.on{color:#f6c54f}.meta{font-size:11px;color:#738696;text-align:right}.form{max-width:920px;padding-top:18px}.field{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;margin:13px 0;align-items:start}.label{color:#9aabba;padding-top:9px}.value-wrap{position:relative}.input,.textarea{width:100%;border:1px solid #2a3947;background:#0e171f;color:#edf3f7;border-radius:8px;outline:none}.input{height:39px;padding:0 12px}.textarea{padding:10px 12px;min-height:112px;resize:vertical}.input:focus,.textarea:focus{border-color:#178dd2;box-shadow:0 0 0 3px rgba(20,151,231,.1)}.inline{display:flex;gap:8px;align-items:center}.inline .input{flex:1}.readonly .input,.readonly .textarea{background:#101820;border-color:#22313d}.password-row{display:flex;gap:8px}.password-row .input{flex:1}.strength{display:flex;align-items:center;gap:9px;margin-top:7px;color:#7f94a6;font-size:12px}.strengthbar{height:4px;width:160px;background:#26333e;border-radius:99px;overflow:hidden}.strengthbar i{display:block;height:100%;width:0;background:#33d17a;transition:.2s}.tags{min-height:39px;display:flex;gap:7px;align-items:center;flex-wrap:wrap;border:1px solid #2a3947;background:#0e171f;border-radius:8px;padding:6px 8px}.tag{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:999px;background:#173126;color:#6ddd9e;border:1px solid #285040;font-size:12px}.tag x{opacity:.7;cursor:pointer}.section{margin-top:25px;border-top:1px solid var(--line2);padding-top:15px}.section-title{font-weight:700;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.history{width:100%;border-collapse:collapse;font-size:12px}.history th,.history td{padding:9px 10px;border-bottom:1px solid #22303b;text-align:left}.history th{color:#8fa2b4;font-weight:600}.history td{color:#c7d3dc}.muted{color:#7d91a2}
.login-layer{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#152433 0,#0a1016 55%,#070b0f 100%)}.login-card{width:min(430px,calc(100vw - 36px));padding:30px;border:1px solid #263846;border-radius:18px;background:rgba(15,24,32,.96);box-shadow:var(--shadow)}.login-logo{width:58px;height:58px;border-radius:16px;margin:0 auto 15px;display:grid;place-items:center;font-size:27px;background:linear-gradient(135deg,#0e80c6,#16b3e8);box-shadow:0 10px 30px rgba(20,151,231,.25)}.login-card h1{font-size:22px;text-align:center;margin:0}.login-card p{color:#8398aa;text-align:center;margin:8px 0 22px}.login-card .input{height:44px;margin:6px 0}.login-card .btn{width:100%;height:44px;justify-content:center;margin-top:10px}.error{min-height:21px;color:#ff7e87;font-size:12px;margin-top:6px}.hint{color:#6f8495;font-size:11px;margin-top:11px;text-align:center}
.modal-back{position:fixed;inset:0;z-index:30;background:rgba(0,0,0,.58);display:grid;place-items:center}.modal{width:min(620px,calc(100vw - 34px));max-height:84vh;overflow:auto;background:#111b24;border:1px solid #2b3d4b;border-radius:15px;box-shadow:var(--shadow);padding:22px}.modal h2{margin:0 0 16px;font-size:19px}.modal .field{grid-template-columns:120px 1fr}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.toast{position:fixed;right:22px;bottom:22px;z-index:50;padding:11px 15px;border:1px solid #2b4354;border-radius:10px;background:#152430;color:#e9f3f8;box-shadow:var(--shadow);transform:translateY(20px);opacity:0;pointer-events:none;transition:.22s}.toast.show{transform:none;opacity:1}.accountline{color:#7f94a6;font-size:12px;padding-top:8px}.warning{color:#f2c46c;font-size:12px;line-height:1.55}
@media(max-width:980px){.workspace{grid-template-columns:165px 310px 1fr}.topbar{grid-template-columns:250px 1fr auto}.auto-lock{display:none}}
@media(max-width:760px){body{overflow:auto}.app{height:auto;min-height:100vh;grid-template-rows:auto auto auto}.topbar{grid-template-columns:1fr;padding:12px}.top-actions{display:none}.workspace{display:block}.sidebar{display:none}.records{height:42vh;border-right:0}.detail{min-height:58vh;padding:20px}.toolbar{overflow:auto}.field{grid-template-columns:1fr;gap:4px}.label{padding-top:0}.brand{font-size:17px}.searchbox{grid-row:2}.toolbar{padding-left:12px;padding-right:12px}}