:root{
  --brand:#ffb300;--brand-dark:#e09b00;--brand-soft:#fff7e6;--brand-ink:#a15f00;
  --brand-edge:#f0a800;--on-brand:#3a2a00;--focus:#ffe1a3;
  --ink:#1b1f24;--ink-2:#33404d;--muted:#66727f;
  --line:#e2e6ea;--line-2:#eef1f4;--bg:#f4f6f8;--card:#fff;--danger:#c62828;--ok:#2e7d32;
  --radius:6px;
  /* 深色区。真实值由 /theme.css 按后台设置下发, 这里是兜底 */
  --dark:#14181d;--dark-2:#22262b;--on-dark:#ffffff;--on-dark-2:#c2cbd4;--on-dark-accent:var(--brand);
}
/* 亮金黄主题: 换主题只改这一组变量。 */
[data-theme="gold"]{
  --brand:#ffd700;
  --brand-dark:#e8c000;
  --brand-soft:#fff8d6;
  --brand-ink:#8a5a00;
  --brand-edge:#e6b800;
  --on-brand:#241c00;
  --focus:#ffe9a3;
  --bg-soft:#fffdf3;
}
*{box-sizing:border-box}
/* hidden 属性必须能压住作者样式: 本文件里 .login-wrap/.mask 等都带 display:flex,
   浏览器默认的 [hidden]{display:none} 会被它们压掉, 于是 JS 里 el.hidden=true 失效
   —— 登录后登录框不消失、改口令弹层一直盖在页面上(截图复查时发现)。 */
[hidden]{display:none !important}
body.adm{
  margin:0;background:var(--bg);color:var(--ink);
  font:13px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Arial,sans-serif;
}
h1,h2{margin:0;font-weight:600}
p{margin:0}
a{color:inherit;text-decoration:none}
.hint{font-size:12px;color:var(--muted)}
.path{font-size:12px;color:var(--muted);word-break:break-all;margin-top:6px}
.msg{margin-top:8px;font-size:12.5px;color:var(--danger);min-height:0}
.msg.ok{color:var(--ok)}
.spacer{flex:1}

.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--radius);
  border:1px solid transparent;font-size:13px;font-weight:600;cursor:pointer;background:#fff}
.btn-primary{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.btn-primary:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn-line{border-color:var(--line);color:var(--ink-2)}
.btn-line:hover{border-color:var(--brand-edge);color:var(--brand-ink)}
.btn-sm{padding:5px 10px;font-size:12.5px;font-weight:500}
.btn-block{width:100%;justify-content:center}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- 登录 ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background:linear-gradient(135deg,var(--dark),var(--dark-2))}
.login-card{width:340px;background:#fff;border-radius:8px;padding:24px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.login-card h1{font-size:18px;margin-bottom:6px}
.login-card .hint{margin-bottom:16px}

.fld{display:block;margin-bottom:12px}
.fld>span{display:block;font-size:12.5px;color:var(--muted);margin-bottom:4px}
input[type=text],input[type=password],input:not([type]),textarea,select{
  width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:4px;font-size:13px;
  font-family:inherit;color:var(--ink);background:#fff}
input:focus,textarea:focus,select:focus{outline:2px solid var(--focus);border-color:var(--brand)}
textarea{resize:vertical;line-height:1.7}

/* ---------- 顶栏 ---------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;
  height:48px;padding:0 16px;background:var(--dark);color:var(--on-dark)}
.topbar .meta{font-size:12px;color:var(--on-dark-2)}
.topbar .btn-line{background:transparent;border-color:rgba(255,255,255,.28);color:var(--on-dark)}
.topbar .btn-line:hover{border-color:var(--on-dark-accent);color:var(--on-dark-accent)}
.topbar .btn-primary{background:var(--brand);color:var(--on-brand)}

/* ---------- 主区 ---------- */
.adm-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:16px;padding:16px;align-items:start}
.form{display:flex;flex-direction:column;gap:14px;min-width:0}
.fs{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px 6px}
.fs h2{font-size:14px;margin-bottom:12px;padding-left:9px;position:relative}
.fs h2::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:3px;background:var(--brand);border-radius:2px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
/* 深色区底色选择器: 色板 + "用主题默认"开关 */
input[type=color]{height:36px;padding:3px 4px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;cursor:pointer}
input[type=color]:disabled{opacity:.45;cursor:not-allowed}
.chk{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-2);padding:9px 0;cursor:pointer}
.chk input{width:15px;height:15px;accent-color:var(--brand)}
@media (max-width:640px){.row{grid-template-columns:1fr}}

.img-fld{display:flex;gap:14px;align-items:flex-start;margin-bottom:14px}
.img-box{width:96px;height:96px;flex:0 0 96px;border:1px solid var(--line);border-radius:var(--radius);
  background:#fbfcfd;display:flex;align-items:center;justify-content:center;overflow:hidden}
.img-box img{max-width:88px;max-height:88px;object-fit:contain}
.img-act{flex:1;min-width:0}
.img-act .hint{margin-bottom:8px}

.svc-list{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.svc-row{display:grid;grid-template-columns:104px minmax(0,1fr) 34px;gap:8px;border:1px solid var(--line);
  border-radius:var(--radius);padding:10px;background:#fbfcfd}
.svc-row .svc-desc{grid-column:1/3}
.svc-row select,.svc-row input,.svc-row textarea{margin:0}
.svc-del{border:1px solid var(--line);background:#fff;border-radius:4px;cursor:pointer;color:var(--danger);font-size:15px;line-height:1}
.svc-del:hover{border-color:var(--danger)}

.savebar{position:sticky;bottom:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;display:flex;align-items:center;gap:12px;box-shadow:0 -4px 14px rgba(20,24,29,.05);flex-wrap:wrap}

/* ---------- 预览 ---------- */
.preview{position:sticky;top:64px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.preview-head{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-bottom:1px solid var(--line-2)}
.preview iframe{width:100%;height:calc(100vh - 130px);border:0;background:#fff}
@media (max-width:1100px){
  .adm-grid{grid-template-columns:1fr}
  .preview{position:static}
  .preview iframe{height:520px}
}

/* ---------- 遮罩 / 提示 ---------- */
.mask{position:fixed;inset:0;background:rgba(20,24,29,.45);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.modal{width:340px;background:#fff;border-radius:8px;padding:20px;box-shadow:0 18px 50px rgba(0,0,0,.3)}
.modal h2{font-size:16px;margin-bottom:14px}
.toast{position:fixed;right:18px;bottom:18px;z-index:60;background:var(--dark);color:var(--on-dark);padding:10px 16px;
  border-radius:var(--radius);font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.bad{background:var(--danger)}