:root {
  --ink:#2a2825;
  --muted:#746d66;
  --line:#e3ddd5;
  --paper:#fffdfa;
  --ground:#f6f3ee;
  --orange:#e96f16;
  --orange-soft:#fff0e5;
  --green:#49694b;
  --green-soft:#e8f1e5;
  --blue:#456a88;
  --blue-soft:#e8eff5;
  --shadow:0 8px 24px rgba(50,40,31,.055);
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { min-width:320px; }
body { margin:0; color:var(--ink); background:var(--ground); font-family:"PingFang SC","Microsoft YaHei",sans-serif; font-size:14px; line-height:1.5; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.55; }

.topbar { position:sticky; z-index:3; top:0; height:62px; display:flex; align-items:center; justify-content:space-between; padding:0 30px; color:#fff; background:#302d29; box-shadow:0 1px 0 rgba(255,255,255,.06); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; font-size:17px; }
.brand-mark { display:grid; place-items:center; width:29px; height:29px; border-radius:6px; color:#472d12; background:#ff9a48; }
.brand small,.operator { color:#c7c0b9; font-weight:400; font-size:13px; }
.operator { display:flex; align-items:center; gap:12px; }
.logout-button { min-height:32px; padding:0 11px; border:1px solid #5a554f; border-radius:4px; color:#eee8e1; background:#3b3733; }
.logout-button:hover { background:#4a4540; }
.password-dialog { width:min(430px,calc(100vw - 32px)); padding:0; border:1px solid var(--line); border-radius:6px; color:var(--ink); background:var(--paper); box-shadow:0 22px 70px rgba(30,24,18,.22); }
.password-dialog::backdrop { background:rgba(28,24,20,.45); }
.password-dialog form { padding:26px; }
.dialog-head { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:22px; }
.dialog-head h2 { margin:4px 0 0; font-size:22px; }
.password-dialog label { display:flex; flex-direction:column; gap:7px; margin-top:14px; color:var(--muted); font-size:13px; }
.password-dialog input { min-height:42px; padding:9px 11px; border:1px solid #d5cec7; border-radius:4px; outline:none; font-size:15px; }
.password-dialog input:focus { border-color:#e7a06c; box-shadow:0 0 0 3px rgba(233,111,22,.09); }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }

.login-view { min-height:100vh; display:grid; grid-template-rows:auto 1fr auto; align-items:center; justify-items:center; padding:34px 20px 24px; background:#f3f0eb; }
.login-brand { display:flex; align-items:center; gap:10px; justify-self:start; color:#3d3833; font-size:18px; font-weight:700; }
.login-panel { width:min(420px,100%); padding:34px; border:1px solid var(--line); border-top:3px solid var(--orange); border-radius:6px; background:var(--paper); box-shadow:0 18px 50px rgba(50,40,31,.1); }
.login-panel h1 { margin:5px 0 28px; font-size:28px; line-height:1.3; }
.login-panel label { display:flex; flex-direction:column; gap:7px; margin-top:16px; color:var(--muted); font-size:13px; }
.login-panel input { width:100%; min-height:46px; padding:10px 12px; border:1px solid #d5cec7; border-radius:4px; outline:none; color:var(--ink); background:#fff; font-size:16px; }
.login-panel input:focus { border-color:#e7a06c; box-shadow:0 0 0 3px rgba(233,111,22,.09); }
.login-panel .primary { width:100%; min-height:46px; margin-top:10px; font-size:16px; }
.login-error { min-height:21px; margin:10px 0 0; color:#b34827; font-size:13px; }
.login-footer { align-self:end; margin:0; color:#8a8178; font-size:12px; }

.admin-layout { display:flex; min-height:calc(100vh - 62px); }
.sidebar { position:sticky; top:62px; align-self:flex-start; flex:0 0 220px; height:calc(100vh - 62px); overflow-y:auto; padding:22px 14px 34px; border-right:1px solid #ded8d0; background:#eeebe6; }
.sidebar p { margin:19px 12px 8px; color:#817970; font-size:12px; }
.sidebar p:first-child { margin-top:0; }
.nav-item { display:block; width:100%; min-height:40px; padding:10px 13px; border:0; border-radius:5px; color:#514a44; background:transparent; text-align:left; white-space:nowrap; }
.nav-item:hover { background:#e3ded8; }
.nav-item.active { color:#8f4109; background:#ffe5d0; box-shadow:inset 3px 0 0 var(--orange); font-weight:700; }

.shell { width:100%; min-width:0; max-width:1580px; margin:0 auto; padding:38px 42px 64px; }
.page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:28px; }
.page-head h1 { margin:4px 0 0; font-size:30px; line-height:1.25; }
.page-head > p { max-width:520px; margin:0; color:var(--muted); text-align:right; }
.eyebrow { margin:0; color:var(--orange); font-size:12px; font-weight:700; }

.stats { display:grid; grid-template-columns:repeat(5,1fr); margin-bottom:26px; overflow:hidden; border:1px solid var(--line); border-radius:6px; background:var(--paper); box-shadow:var(--shadow); }
.stats div { min-height:100px; padding:19px 22px; border-right:1px solid var(--line); }
.stats div:last-child { border:0; }
.stats span { display:block; color:var(--muted); }
.stats strong { display:block; margin-top:7px; font-size:28px; line-height:1.2; }
.section-head { display:flex; align-items:center; justify-content:space-between; margin:28px 0 12px; }
.section-head h2 { margin:0; font-size:17px; }
.section-head p { margin:0; color:var(--muted); }

.primary,.secondary,.text-button { min-height:38px; padding:0 15px; border-radius:4px; font-weight:700; white-space:nowrap; }
.primary { min-width:88px; border:0; color:#fff; background:var(--orange); box-shadow:0 4px 10px rgba(233,111,22,.16); }
.primary:hover { background:#d96311; }
.secondary { border:1px solid #d9cfc6; color:#554d46; background:#fff; }
.text-button { min-width:0; min-height:0; padding:0; border:0; color:var(--orange); background:transparent; box-shadow:none; }
.text-button.danger { color:#a43c2e; }
.row-actions { display:flex; align-items:center; gap:12px; min-width:max-content; }

.toolbar { display:flex; align-items:flex-end; gap:12px; padding:18px 20px; border:1px solid var(--line); border-bottom:0; border-radius:6px 6px 0 0; background:#fbfaf8; }
.toolbar label,.form-grid label { display:flex; flex-direction:column; gap:7px; min-width:0; color:var(--muted); font-size:12px; }
.toolbar input,.toolbar select,.form-grid input,.form-grid select,.form-grid textarea { width:220px; min-height:38px; padding:8px 10px; border:1px solid #d5cec7; border-radius:4px; outline:none; color:var(--ink); background:#fff; transition:border-color .15s,box-shadow .15s; }
.toolbar input:focus,.toolbar select:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color:#e7a06c; box-shadow:0 0 0 3px rgba(233,111,22,.09); }
.toolbar select { width:150px; }
.toolbar .primary { min-height:38px; }

.table-wrap { min-width:0; overflow:auto; border:1px solid var(--line); border-radius:6px; background:var(--paper); box-shadow:var(--shadow); scrollbar-color:#c9c0b7 transparent; scrollbar-width:thin; }
.toolbar + .table-wrap { border-radius:0 0 6px 6px; }
table { width:100%; min-width:860px; border-collapse:collapse; }
th,td { padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { position:sticky; z-index:1; top:0; color:var(--muted); background:#fbfaf8; font-size:12px; font-weight:600; }
td { font-size:14px; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#fff8f2; }
.click-row { cursor:pointer; }
.loading { height:120px; color:var(--muted); text-align:center; }
.status { display:inline-block; padding:4px 8px; border-radius:3px; color:#76521e; background:#fff0d9; font-size:12px; white-space:nowrap; }
.status.confirmed,.status.enabled,.status.used { color:var(--green); background:var(--green-soft); }
.status.rejected { color:#9f3428; background:#f9e3df; }
.status.disabled { color:#76635c; background:#ece9e6; }
.status.review { color:var(--blue); background:var(--blue-soft); }
.view { color:var(--orange); font-weight:700; }

.dashboard-stack { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; }
.dashboard-stack > section { min-width:0; }
.dashboard-stack .section-head { margin-bottom:12px; }
.dashboard-stack section + section .section-head { margin-top:0; }

.split-grid { display:grid; grid-template-columns:minmax(560px,1.65fr) minmax(350px,.75fr); align-items:start; gap:24px; }
.split-grid > * { min-width:0; }
.form-panel { align-self:start; padding:22px; border:1px solid var(--line); border-radius:6px; background:var(--paper); box-shadow:var(--shadow); }
.split-grid > .form-panel { position:sticky; top:86px; }
.form-panel h2 { margin:0 0 19px; font-size:18px; }
.form-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:15px 14px; }
.form-grid label.full { grid-column:1/-1; }
.form-grid input,.form-grid select,.form-grid textarea { width:100%; }
.form-grid textarea { min-height:82px; resize:vertical; }
.form-actions { display:flex; align-items:flex-start; gap:12px; margin-top:20px; }
.form-actions .primary,.form-actions .secondary { flex:0 0 auto; }
.form-help { flex:1; min-width:0; padding-top:2px; color:var(--muted); font-size:12px; line-height:1.55; }
.preview { display:block; width:100%; max-height:180px; object-fit:cover; margin-top:10px; border:1px solid var(--line); border-radius:4px; }
.empty { padding:32px; color:var(--muted); text-align:center; }

.detail-panel { position:fixed; z-index:5; top:0; right:0; width:min(640px,100vw); height:100vh; transform:translateX(100%); overflow-y:auto; background:var(--paper); box-shadow:-14px 0 42px rgba(35,29,23,.18); transition:transform .22s; }
.detail-panel.open { transform:translateX(0); }
.detail-panel.open + .scrim { visibility:visible; opacity:1; }
.scrim { position:fixed; z-index:4; inset:0; visibility:hidden; opacity:0; background:rgba(28,24,20,.34); transition:opacity .2s; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; padding:30px 32px 22px; border-bottom:1px solid var(--line); }
.panel-head h2 { margin:4px 0 0; font-size:24px; }
.icon-button { width:36px; height:36px; border:1px solid #d6cec5; border-radius:4px; background:#fff; font-size:24px; line-height:26px; }
.panel-content { padding:24px 32px 46px; }
.section-title { margin:28px 0 12px; font-size:16px; }
.section-title:first-child { margin-top:0; }
.facts { display:grid; grid-template-columns:1fr 1fr; overflow:hidden; margin:0; border:1px solid var(--line); border-radius:5px; }
.facts div { min-width:0; padding:12px 14px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.facts div:nth-child(2n) { border-right:0; }
.facts dt { color:var(--muted); font-size:12px; }
.facts dd { overflow-wrap:anywhere; margin:5px 0 0; font-weight:600; }
.photos { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.photos img { display:block; width:100%; aspect-ratio:1; object-fit:cover; border:1px solid var(--line); border-radius:4px; }
.photo-label { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.followups { margin:0; padding:0; list-style:none; }
.followups li { padding:12px 0; border-bottom:1px solid var(--line); }
.followups time { display:block; margin-top:5px; color:var(--muted); font-size:12px; }
.update-form { display:grid; gap:10px; }
.update-form label { display:grid; gap:6px; color:var(--muted); font-size:12px; }
.update-form input,.update-form select,.update-form textarea { width:100%; min-height:38px; padding:9px; border:1px solid #d5cec7; border-radius:4px; background:#fff; }
.update-form textarea { min-height:84px; resize:vertical; }
.update-form button { justify-self:start; padding:9px 16px; border:0; border-radius:4px; color:#fff; background:var(--orange); font-weight:700; }
.update-form .danger-button { border:1px solid #d9a79f; color:#9c3326; background:#fff; }
.qr-block { display:grid; justify-items:center; gap:8px; padding:18px; border:1px solid var(--line); border-radius:5px; background:#fff8f2; text-align:center; }
.qr-block img { width:210px; height:210px; }
.qr-block strong { letter-spacing:2px; font-size:22px; }
.qr-block span { color:var(--muted); font-size:12px; }
.button-link { display:inline-flex; align-items:center; justify-content:center; min-height:42px; margin-top:16px; padding:0 18px; border:1px solid #e56f1a; border-radius:4px; color:#b9530c; background:#fff8f2; font-weight:650; text-decoration:none; }

@media (max-width:1180px) {
  .shell { padding-left:30px; padding-right:30px; }
  .split-grid { grid-template-columns:1fr; }
  .split-grid > .form-panel { position:static; }
  .stats { grid-template-columns:repeat(3,1fr); }
  .stats div { border-bottom:1px solid var(--line); }
}
@media (max-width:820px) {
  .topbar { padding:0 18px; }
  .brand small,.operator span { display:none; }
  .sidebar { flex-basis:78px; padding:12px 7px; }
  .sidebar p { display:none; }
  .nav-item { overflow:hidden; padding:10px 5px; font-size:11px; text-align:center; white-space:normal; }
  .nav-item.active { box-shadow:inset 0 -3px 0 var(--orange); }
  .shell { padding:26px 16px 48px; }
  .page-head { display:block; }
  .page-head > p { margin-top:10px; text-align:left; }
  .stats { grid-template-columns:1fr 1fr; }
  .stats div { border-bottom:1px solid var(--line); }
  .toolbar { align-items:stretch; flex-wrap:wrap; }
  .toolbar label { flex:1 1 180px; }
  .toolbar input,.toolbar select { width:100%; }
  .toolbar .primary { width:100%; }
  .form-grid { grid-template-columns:1fr; }
  .form-grid label.full { grid-column:auto; }
  .form-actions { flex-wrap:wrap; }
  .form-help { flex-basis:100%; }
  .panel-content,.panel-head { padding-left:20px; padding-right:20px; }
  .login-view { padding:24px 16px 20px; }
  .login-panel { padding:28px 22px; }
}