*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"PingFang SC","Microsoft YaHei",sans-serif;background:#F1EEE8;color:#221E1B;font-size:14px;line-height:1.7}
a{color:inherit;text-decoration:none}
.admin-wrap{display:flex;min-height:100vh}

/* ===== 侧栏 ===== */
.admin-side{width:236px;flex:none;background:#1D1917;color:#F3EEE6;padding:20px 0 26px;position:sticky;top:0;height:100vh;overflow-y:auto}
.admin-brand{display:flex;align-items:center;gap:10px;padding:0 18px 16px;border-bottom:1px solid #3A322B;margin-bottom:10px}
.brand-mark{position:relative;width:34px;height:34px;flex:none}
.brand-mark i{position:absolute;inset:5px;border:1px solid #C9A063;transform:rotate(45deg)}
.brand-mark b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;color:#C9A063;font-family:"Songti SC",serif}
.admin-brand b{display:block;font-size:16px;letter-spacing:2px;line-height:1.3}
.admin-brand span{font-size:10.5px;color:#A89F93}
.admin-side nav a{display:flex;align-items:center;gap:8px;padding:8px 18px;font-size:13px;color:#CFC7BA;transition:all .15s;position:relative}
.admin-side nav a:hover{color:#fff;background:#2A2420}
.admin-side nav a.on{color:#fff;background:#A21E26}
.admin-side nav a .no{font-style:normal;font-size:10px;color:#8A8177;width:18px;flex:none}
.admin-side nav a.on .no{color:#F3DCD4}
.badge{margin-left:auto;background:#C9A063;color:#1D1917;font-size:10.5px;font-style:normal;font-weight:700;padding:1px 7px;border-radius:9px}
.side-label{padding:16px 18px 5px;font-size:10.5px;color:#7A7166;letter-spacing:1.5px}
.side-logout{margin-top:16px;color:#A89F93}

/* ===== 主区 ===== */
.admin-main{flex:1;padding:26px 30px;min-width:0}
h1{font-size:21px;margin-bottom:18px}
h2{font-size:15px;margin:26px 0 12px}

/* 工作台 */
.dash-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1000px}
.dash-card{background:#fff;padding:18px;border-radius:8px}
.dash-card b{display:block;font-size:27px;color:#A21E26}
.dash-card span{font-size:12px;color:#6E6862}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1000px}
.quick{background:#fff;border-radius:8px;padding:16px 18px;border:1px solid #E8E2D8;transition:all .15s}
.quick:hover{border-color:#C9A063;box-shadow:0 4px 14px rgba(30,20,10,.08)}
.quick b{display:block;font-size:14px;margin-bottom:4px}
.quick span{font-size:12px;color:#8A8177;line-height:1.5;display:block}

/* 表格 */
.tbl{width:100%;max-width:1000px;border-collapse:collapse;background:#fff;border-radius:8px;overflow:hidden}
.tbl th{background:#E9E3D9;text-align:left;font-size:12px;padding:10px 12px;font-weight:500}
.tbl td{padding:10px 12px;border-top:1px solid #F0EBE3;font-size:13px;vertical-align:middle}
.tbl-empty{text-align:center;color:#9C948A;padding:26px}
.tbl-thumb{width:58px;height:42px;object-fit:cover;border-radius:4px}
.tbl-dim{color:#6E6862;font-size:12px}
.tag-feat{font-size:10px;background:#C9A063;color:#fff;padding:1px 6px;border-radius:3px}

/* 按钮 */
.abtn{display:inline-block;background:#A21E26;color:#fff;padding:9px 18px;border-radius:5px;font-size:13px;border:none;cursor:pointer}
.abtn:hover{background:#7E151C}
.abtn-line{display:inline-block;border:1px solid #C9B8A0;color:#221E1B;padding:6px 14px;border-radius:5px;font-size:12px;background:#fff;cursor:pointer}
.abtn-danger{border:none;background:none;color:#A21E26;font-size:12px;cursor:pointer;padding:5px 8px}
.inline-del{display:inline}
.list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;max-width:1000px}
.list-head h1{margin:0}

/* ===== 分屏编辑器 ===== */
.editor-split{display:grid;grid-template-columns:minmax(400px,530px) minmax(480px,1fr);gap:22px;align-items:start}
.editor-form-col{min-width:0}
.editor-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.editor-head h1{margin:0}
.dirty-dot{width:9px;height:9px;border-radius:50%;background:#E0A800;display:none}
.dirty-dot.show{display:block;animation:pulse 1.4s ease infinite}
@keyframes pulse{50%{opacity:.35}}

.sec-form{background:#fff;padding:22px;border-radius:10px;display:flex;flex-direction:column;gap:16px;border:1px solid #E8E2D8}
.fld{display:flex;flex-direction:column;gap:6px}
.fld>span{font-size:12px;color:#6E6862;font-weight:500}
.fld-note{font-size:11px;color:#B0A79A}
.fld input[type=text],.fld input:not([type]),.fld input[type=number],.fld input[type=password],.fld textarea,.pass-form input{border:1.5px solid #DDD5C9;border-radius:6px;padding:10px 12px;font-size:13.5px;font-family:inherit;outline:none;width:100%;transition:border-color .15s;background:#FDFCFA}
.fld input:focus,.fld textarea:focus,.list-tbl input:focus,.list-tbl textarea:focus{border-color:#C9A063}
.fld-row{display:flex;gap:20px;align-items:flex-end}

.img-fld{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.img-fld.small{gap:6px}
.img-preview{width:92px;height:64px;object-fit:cover;border-radius:5px;border:1px solid #E4DED4}
.img-fld.small .img-preview{width:64px;height:46px}
.img-none{font-size:12px;color:#9C948A}
.file-btn{display:inline-block;border:1.5px dashed #C9B8A0;color:#8A6F45;padding:8px 14px;border-radius:6px;font-size:12px;cursor:pointer;background:#FBF8F3;transition:all .15s}
.file-btn:hover{border-color:#C9A063;background:#F7F1E6}
.file-btn.sm{padding:5px 9px;font-size:11px}
.file-btn.picked{border-style:solid;border-color:#2E7D32;color:#2E7D32;background:#F0F7F0}
.chk,.chk-row{font-size:12.5px;color:#6E6862;display:flex;align-items:center;gap:6px}

.list-tbl{width:100%;border-collapse:collapse}
.list-tbl th{font-size:11px;color:#6E6862;text-align:left;padding:4px 6px;font-weight:400}
.list-tbl td{padding:5px 6px;vertical-align:top}
.list-tbl input,.list-tbl textarea{border:1.5px solid #DDD5C9;border-radius:5px;padding:7px 9px;font-size:12.5px;width:100%;font-family:inherit;outline:none;background:#FDFCFA}
.row-del{border:none;background:none;color:#A21E26;cursor:pointer;font-size:13px;padding:8px 4px}
.row-add{margin-top:8px;align-self:flex-start}

.save-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;bottom:0;background:#fff;padding:14px 0 2px;border-top:1px solid #F0EBE3;margin-top:4px}
.save-hint{font-size:11.5px;color:#9C948A}
.save-btn{background:#A21E26;color:#fff;border:none;padding:12px 26px;font-size:14px;border-radius:6px;cursor:pointer;flex:none}
.save-btn:hover{background:#7E151C}
.save-toast{display:none;background:#EAF6EC;border:1px solid #BCE0C2;color:#2E7D32;padding:10px 14px;border-radius:6px;margin-bottom:14px;font-size:13px}
.save-toast.show{display:block}

/* ===== 预览面板 ===== */
.preview-col{position:sticky;top:16px;display:flex;flex-direction:column;height:calc(100vh - 32px);min-width:0}
.preview-bar{display:flex;align-items:center;gap:10px;background:#221E1B;color:#F3EEE6;border-radius:10px 10px 0 0;padding:9px 14px;flex-wrap:wrap}
.preview-title{font-size:12px;color:#7CC97F;letter-spacing:1px;flex:none}
.seg{display:flex;background:#3A322B;border-radius:6px;overflow:hidden}
.seg button{border:none;background:none;color:#CFC7BA;font-size:12px;padding:6px 12px;cursor:pointer;transition:all .15s}
.seg button.on{background:#C9A063;color:#1D1917;font-weight:600}
.pv-btn{border:1px solid #4A4139;background:none;color:#CFC7BA;font-size:12px;padding:5px 11px;border-radius:6px;cursor:pointer}
.pv-btn:hover{color:#fff;border-color:#C9A063}
.preview-stage{flex:1;background:#3A342E;border-radius:0 0 10px 10px;overflow:auto;display:flex;justify-content:center;padding:0}
.preview-stage iframe{width:100%;height:100%;border:none;background:#F4F1EC;display:block}
.preview-stage.mobile{padding:18px}
.preview-stage.mobile iframe{width:390px;height:100%;border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.4);flex:none}

/* 案例图集 */
.case-imgs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.case-img-item{display:flex;flex-direction:column;gap:4px;font-size:11px;color:#6E6862;align-items:center}
.case-img-item img{width:92px;height:64px;object-fit:cover;border-radius:5px}
.case-img-item span{display:flex;align-items:center;gap:4px}
.status-form select{border:1.5px solid #DDD5C9;border-radius:5px;padding:6px 8px;font-size:12px;background:#fff}
.pass-form{display:flex;gap:10px;max-width:560px}
.pass-form button{background:#221E1B;color:#fff;border:none;border-radius:5px;padding:0 18px;cursor:pointer;flex:none}
.dash-note{background:#FFF9EF;border:1px solid #EAD9B8;border-radius:8px;padding:16px 18px;margin-top:28px;font-size:12.5px;color:#6E6862;max-width:1000px}
.dash-note b{display:block;color:#221E1B;margin-bottom:6px}
.dash-note code{background:#F0EBE3;padding:1px 6px;border-radius:3px}

/* 登录 */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#1D1917}
.login-card{background:#fff;border-radius:10px;padding:38px 34px;width:350px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.login-mark{position:relative;width:52px;height:52px;margin:0 auto 4px}
.login-mark i{position:absolute;inset:7px;border:1.2px solid #C9A063;transform:rotate(45deg)}
.login-mark b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px;color:#C9A063;font-family:"Songti SC",serif}
.login-logo{font-size:20px;letter-spacing:4px;text-align:center}
.login-sub{font-size:12px;color:#9C948A;text-align:center;margin-bottom:8px}
.login-card input{border:1.5px solid #DDD5C9;border-radius:6px;padding:12px;font-size:14px;outline:none}
.login-card input:focus{border-color:#C9A063}
.login-card button{background:#A21E26;color:#fff;border:none;border-radius:6px;padding:13px;font-size:14px;cursor:pointer;letter-spacing:4px}
.login-err{background:#FBEAEA;color:#A21E26;font-size:12px;padding:8px 10px;border-radius:5px;text-align:center}

/* 响应式 */
@media (max-width:1180px){
  .editor-split{grid-template-columns:1fr}
  .preview-col{position:static;height:70vh}
}
@media (max-width:860px){
  .admin-wrap{flex-direction:column}
  .admin-side{width:100%;height:auto;position:static;padding:10px}
  .admin-side nav{display:flex;flex-wrap:wrap}
  .admin-brand{border:none;padding:6px 12px;margin:0}
  .side-label{display:none}
  .admin-side nav a{padding:7px 10px;font-size:12px}
  .admin-side nav a .no{display:none}
  .admin-main{padding:16px 12px}
  .dash-cards,.quick-grid{grid-template-columns:1fr 1fr}
  .fld-row{flex-direction:column;align-items:stretch}
}
.brand-mark-img{width:34px;height:auto;flex:none}
.login-mark-img{width:56px;height:auto;margin:0 auto 4px;display:block}
