/* 沐辞存储 · 基础样式（变量/按钮/弹窗/表单） */

:root{
  --bg:#F3F6FB; --panel:#FFFFFF; --line:#E5EAF2; --line2:#EFF2F7;
  --text:#1B2436; --text2:#5B6577; --text3:#9AA4B5;
  --brand:#2468F2; --brand2:#1C4FD8; --brand-soft:#E9F0FE; --brand-soft2:#DCE9FD;
  --ok:#16A34A; --ok-soft:#E7F6EC; --warn:#D97706; --warn-soft:#FCF3E3;
  --danger:#E03E3E; --danger-soft:#FCEBEB;
  --radius:10px; --radius-s:8px;
  --shadow:0 1px 2px rgba(15,23,42,.05),0 6px 20px rgba(15,23,42,.06);
  --shadow-lg:0 12px 40px rgba(15,23,42,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Segoe UI",system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:14px;color:var(--text)}
a{color:var(--brand);text-decoration:none}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#C9D2E0;border-radius:6px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#AEB9CB}
::selection{background:var(--brand-soft2)}
.icon{width:18px;height:18px;flex:none;display:inline-block;vertical-align:-3px}
.icon-sm{width:15px;height:15px}
.icon-lg{width:22px;height:22px}
[hidden]{display:none!important}

/* ===== 通用按钮 ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 16px;border-radius:var(--radius-s);font-size:14px;font-weight:500;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand2)}
.btn-ghost{background:transparent;color:var(--text2)}
.btn-ghost:hover{background:var(--line2);color:var(--text)}
.btn-soft{background:var(--brand-soft);color:var(--brand)}
.btn-soft:hover{background:var(--brand-soft2)}
.btn-line{border:1px solid var(--line);background:var(--panel);color:var(--text)}
.btn-line:hover{border-color:#C9D2E0;background:var(--line2)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{background:#C62F2F}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-sm{height:30px;padding:0 11px;font-size:13px;border-radius:7px}

/* ===== Toast ===== */
#toastWrap{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:3000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:#202B3D;color:#fff;padding:9px 18px;border-radius:20px;font-size:13.5px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:8px;animation:toastIn .22s ease;max-width:80vw}
.toast.ok svg{stroke:#5BD58B}.toast.warn svg{stroke:#FFC76A}.toast.err svg{stroke:#FF8A8A}
@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ===== 弹窗 ===== */
.modal-mask{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .18s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:var(--panel);border-radius:14px;width:100%;max-width:420px;box-shadow:var(--shadow-lg);animation:popIn .2s ease;max-height:88vh;display:flex;flex-direction:column}
@keyframes popIn{from{opacity:0;transform:scale(.96) translateY(6px)}to{opacity:1;transform:none}}
.modal-lg{max-width:640px}
.modal-head{padding:18px 22px 0;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:space-between}
.modal-head .x{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text3)}
.modal-head .x:hover{background:var(--line2);color:var(--text)}
.modal-body{padding:18px 22px;overflow:auto}
.modal-foot{padding:14px 22px 18px;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line2)}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;color:var(--text2);margin-bottom:6px;font-weight:500}
.field input,.field select,.field textarea{width:100%;height:38px;border:1px solid var(--line);border-radius:var(--radius-s);padding:0 12px;outline:none;background:#FBFCFE;transition:border-color .15s,box-shadow .15s}
.field textarea{height:auto;padding:10px 12px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.field .hint{font-size:12px;color:var(--text3);margin-top:5px}