:root {
  --brand:#285f4d;
  --brand-strong:#174437;
  --accent:#c85f42;
  --info:#356d91;
  --warn:#b7791f;
  --bg:#f5f7f5;
  --surface:#ffffff;
  --surface-soft:#f9fbf8;
  --line:#dce5df;
  --line-strong:#c8d6ce;
  --ink:#17211d;
  --muted:#69756f;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
button,input,select,textarea { font:inherit; }
button { min-height:38px; border:0; border-radius:8px; padding:9px 14px; background:var(--brand); color:#fff; cursor:pointer; font-weight:700; }
button:hover { background:var(--brand-strong); }
button.ghost { background:#eef4f0; color:var(--brand); border:1px solid var(--line); }
button.ghost:hover { background:#e5eee9; }
input,select,textarea { width:100%; min-height:38px; border:1px solid var(--line); border-radius:8px; padding:9px 10px; background:#fff; color:var(--ink); }
textarea { min-height:84px; resize:vertical; }
.inline-select { width:min(100%, 180px); min-width:132px; }
h2,h3,p { margin:0; }
.shell { display:grid; grid-template-columns:248px minmax(0,1fr); min-height:100vh; }
aside { position:sticky; top:0; height:100vh; overflow:auto; background:#153b32; color:#fff; padding:22px 18px; }
.brand-block { padding:6px 8px 18px; border-bottom:1px solid rgba(255,255,255,.12); margin-bottom:18px; }
.brand-block h1 { margin:0; font-size:23px; line-height:30px; }
.brand-block p { margin-top:6px; color:rgba(255,255,255,.66); font-size:13px; }
.nav-group { margin-bottom:18px; }
.nav-title { padding:0 8px 7px; color:rgba(255,255,255,.54); font-size:12px; font-weight:800; letter-spacing:.04em; }
.nav { position:relative; width:100%; min-height:40px; margin:0 0 7px; background:transparent; color:rgba(255,255,255,.82); text-align:left; font-weight:800; }
.nav:hover { background:rgba(255,255,255,.1); }
.nav.active { background:#fff; color:var(--brand); box-shadow:0 8px 20px rgba(0,0,0,.14); }
.nav.active::before { content:""; position:absolute; left:-7px; top:10px; width:3px; height:20px; border-radius:999px; background:#e7a65f; }
.content { min-width:0; padding:24px; overflow:auto; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; }
.topbar-kicker { color:var(--muted); font-size:13px; font-weight:800; }
.topbar-title { margin-top:4px; font-size:22px; font-weight:900; color:var(--ink); }
.status-bar { min-height:34px; display:flex; align-items:center; padding:0 12px; border-radius:8px; background:#eef4f0; color:var(--brand); font-size:13px; font-weight:700; }
.status-bar.error { background:#fff0eb; color:var(--accent); }
.panel { background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:18px; margin-bottom:18px; box-shadow:0 10px 24px rgba(31,45,42,.04); }
.hidden { display:none !important; }
.section-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; }
.section-header h2 { font-size:24px; line-height:32px; font-weight:900; }
.section-header p { margin-top:4px; color:var(--muted); font-size:14px; }
.panel-head,.toolbar,.row { display:flex; gap:12px; align-items:center; justify-content:space-between; margin-bottom:14px; }
.panel-head h3,.panel h3 { font-size:16px; font-weight:900; }
.toolbar-actions { display:flex; gap:12px; align-items:center; }
.toolbar-actions select { min-width:120px; }
.grid { display:grid; grid-template-columns:repeat(2,minmax(180px,1fr)); gap:12px; }
.grid textarea { grid-column:1/-1; }
.management-layout { display:grid; grid-template-columns:minmax(320px,.62fr) minmax(0,1.38fr); gap:18px; align-items:start; }
.product-layout { grid-template-columns:minmax(340px,.58fr) minmax(0,1.42fr); }
.form-panel { position:sticky; top:24px; }
.table-panel { min-width:0; overflow:auto; }
.category-row { justify-content:flex-start; }
.category-row input { max-width:320px; }
.editor-form,.product-editor-form { max-width:860px; }
.form-actions { grid-column:1/-1; display:flex; gap:12px; align-items:center; justify-content:flex-start; }
.product-store-tools { display:grid; gap:14px; }
.product-filter-row { display:flex; gap:12px; align-items:center; justify-content:flex-start; }
.product-filter-row select { max-width:280px; }
.store-action-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px; }
.store-chip { display:flex; gap:10px; align-items:center; justify-content:space-between; border:1px solid var(--line); border-radius:8px; padding:12px; background:var(--surface-soft); }
.store-chip.off { background:#f8f5f0; }
.store-chip strong,.store-chip span { display:block; }
.store-chip .muted { margin-top:3px; font-size:12px; }
.store-group-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px; }
.store-group-head h3 { font-size:18px; line-height:26px; }
.store-category-manager { display:grid; gap:12px; margin:0 0 14px; padding:12px; background:var(--surface-soft); border:1px solid var(--line); border-radius:8px; }
.category-manager-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.category-manager-head strong,.category-manager-head span { display:block; }
.category-manager-head .muted { margin-top:3px; font-size:12px; }
.category-list { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-height:28px; }
.category-filter { min-height:30px; display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line); border-radius:999px; padding:5px 10px; background:#edf4f0; color:var(--brand); font-size:13px; font-weight:800; }
.category-filter:hover { background:#e3eee8; }
.category-filter.active { background:var(--brand); color:#fff; border-color:var(--brand); box-shadow:0 6px 14px rgba(23,68,55,.16); }
.category-filter span { min-width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:0 6px; background:rgba(255,255,255,.74); color:var(--brand); font-size:12px; }
.category-filter.active span { background:rgba(255,255,255,.18); color:#fff; }
.category-create-row { display:grid; grid-template-columns:minmax(180px,320px) auto; gap:10px; justify-content:start; align-items:center; }
.fixed-category-note { display:block; color:var(--muted); font-size:13px; font-weight:700; }
.product-store-group .table-panel { overflow:auto; }
.order-filter { padding:12px; }
.order-filter input { max-width:560px; }
.color-field { display:flex; align-items:center; justify-content:space-between; gap:12px; border:1px solid var(--line); border-radius:8px; padding:8px 10px; background:#fff; color:var(--muted); }
.color-field input { width:52px; height:34px; min-height:34px; padding:0; border:0; background:transparent; }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr); gap:18px; align-items:start; }
.dashboard-main,.dashboard-side { min-width:0; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; margin-bottom:18px; }
.metric { background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:16px; box-shadow:0 10px 24px rgba(31,45,42,.04); }
.metric strong { display:block; margin-top:8px; font-size:27px; line-height:34px; color:var(--brand); }
.metric:nth-child(3) strong { color:var(--accent); }
.metric:nth-child(4) strong { color:var(--info); }
.quick-actions { display:grid; gap:10px; }
.quick-actions button { width:100%; text-align:left; background:#f4f8f5; color:var(--brand); border:1px solid var(--line); }
.quick-actions button:hover { background:#eaf2ed; }
.analytics-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; }
.advice-list { display:grid; gap:10px; }
.advice-item { border:1px solid var(--line); border-radius:8px; padding:12px; background:var(--surface-soft); }
.advice-item strong { color:var(--brand); }
.advice-item p { margin-top:5px; color:#2f3d37; line-height:1.55; }
.dashboard-order,.inventory-line { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
.dashboard-order:last-child,.inventory-line:last-child { border-bottom:0; }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--brand); display:inline-block; margin-right:7px; }
.status-dot.warn { background:var(--warn); }
table { width:100%; border-collapse:collapse; font-size:14px; }
td,th { border-bottom:1px solid var(--line); padding:10px; text-align:left; vertical-align:top; }
th { color:var(--muted); font-size:12px; font-weight:900; background:#fbfcfb; }
tr:hover td { background:#fbfcfb; }
.record { background:#fff; border:1px solid var(--line); border-radius:8px; padding:16px; margin-bottom:12px; box-shadow:0 8px 20px rgba(31,45,42,.035); }
.muted { color:var(--muted); }
.danger { background:#fff1ee; color:var(--accent); border:1px solid #f3c9bd; }
.danger:hover { background:#ffe5dd; color:#a94731; }
.badge { display:inline-flex; align-items:center; border-radius:999px; padding:4px 9px; background:#e8f0ed; color:var(--brand); font-size:12px; font-weight:800; white-space:nowrap; }
.badge.off { background:#f3f0eb; color:#8a6b45; }
.count { display:inline-flex; align-items:center; justify-content:center; min-width:24px; height:24px; padding:0 8px; border-radius:999px; background:#e8f0ed; color:var(--brand); font-size:13px; }
.empty { color:var(--muted); background:#fff; border:1px dashed var(--line-strong); border-radius:8px; padding:22px; text-align:center; }
.stars { letter-spacing:0; }
.star-on { color:#ff8a00; }
.star-off { color:#c8d0cc; }
.review-images { display:flex; flex-wrap:wrap; gap:10px; margin:10px 0; }
.review-images img { width:92px; height:92px; object-fit:cover; border-radius:8px; border:1px solid var(--line); }
@media (max-width:1100px) {
  .metric-grid { grid-template-columns:repeat(2,minmax(150px,1fr)); }
  .dashboard-grid,.analytics-grid,.management-layout,.product-layout { grid-template-columns:1fr; }
  .form-panel { position:relative; top:auto; }
}
@media (max-width:900px) {
  .shell { grid-template-columns:1fr; }
  aside { position:relative; height:auto; }
  .content { padding:16px; }
  .grid,.metric-grid { grid-template-columns:1fr; }
  .category-create-row { grid-template-columns:1fr; }
  .topbar,.section-header,.panel-head,.toolbar,.row,.product-filter-row,.store-group-head,.category-manager-head { align-items:stretch; flex-direction:column; }
}
