:root {
  --bg: #f7f7f5;
  --panel: #ffffff;
  --panel-soft: #fafaf8;
  --ink: #1f2925;
  --muted: #6f7773;
  --line: rgba(41, 55, 49, 0.1);
  --accent: #087f78;
  --accent-soft: #e9f5f3;
  --warm: #9a6b25;
  --warm-soft: #fff5df;
  --danger: #b64237;
  --sidebar: #17231f;
  --shadow: 0 10px 30px rgba(27, 42, 36, 0.06);
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; color: var(--ink); background: var(--bg); }
button, input, select, textarea { font: inherit; }
button, a { cursor: pointer; }
a { color: var(--accent); text-decoration: none; }
h1, h2, h3, p { margin: 0; }
button { min-height: 38px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); }
button:hover { border-color: rgba(8, 127, 120, 0.35); }
input, select, textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 11px;
  color: var(--ink);
  background: #fff;
  outline: none;
}
input:focus, select:focus, textarea:focus { border-color: rgba(8, 127, 120, 0.55); box-shadow: 0 0 0 3px rgba(8, 127, 120, 0.08); }
label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; }
.hidden { display: none !important; }
.check-row { display: flex; align-items: center; gap: 8px; color: var(--ink); }
.check-row input { width: auto; min-height: 0; }

/* Login */
.login-view {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
  background: radial-gradient(circle at 75% 10%, rgba(8,127,120,.12), transparent 32%), #eef1ee;
}
.login-card {
  width: min(440px, 100%);
  display: grid;
  gap: 16px;
  padding: 32px;
  background: rgba(255,255,255,.96);
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(24,39,32,.14);
}
.login-card > img { width: 190px; max-width: 100%; }
.login-copy { display: grid; gap: 7px; }
.login-copy > span, .eyebrow { color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.login-copy h1 { font-size: 27px; }
.login-copy p, #loginError { color: var(--muted); }
#loginButton { min-height: 46px; border: 0; color: #fff; background: var(--accent); font-weight: 700; }
#loginError { min-height: 18px; color: var(--danger); font-weight: 700; }

/* Layout */
.dashboard-view { min-height: 100vh; }
.admin-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;
  width: 248px;
  display: flex;
  flex-direction: column;
  padding: 20px 14px 16px;
  color: #eaf1ee;
  background: var(--sidebar);
}
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 6px 8px 20px; }
.sidebar-brand img { width: 96px; height: 31px; object-fit: contain; filter: invert(1); }
.sidebar-brand div, .sidebar-footer div:last-child { min-width: 0; display: grid; gap: 3px; }
.sidebar-brand strong { font-size: 14px; }
.sidebar-brand span, .sidebar-footer span { color: #96aaa1; font-size: 11px; }
.admin-nav { flex: 1; overflow-y: auto; padding-right: 3px; }
.admin-nav { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.16) transparent; }
.admin-nav::-webkit-scrollbar { width: 5px; }
.admin-nav::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(255,255,255,.16); }
.nav-group-label { display: block; padding: 18px 12px 7px; color: #71877d; font-size: 10px; font-weight: 700; }
.admin-nav button {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 2px 0;
  padding: 8px 10px;
  border: 0;
  color: #bdcbc5;
  background: transparent;
  text-align: left;
}
.admin-nav button:hover { color: #fff; background: rgba(255,255,255,.06); }
.admin-nav button.active { color: #fff; background: rgba(31,184,166,.16); }
.nav-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; color: #a9bcb3; background: rgba(255,255,255,.07); font-size: 10px; font-weight: 800; }
.admin-nav button.active .nav-icon { color: #96eee4; background: rgba(31,184,166,.16); }
.nav-tag { margin-left: auto; color: #8ca098; font-size: 9px; }
.nav-count { min-width: 23px; margin-left: auto; padding: 2px 6px; border-radius: 20px; color: #c8d5d0; background: rgba(255,255,255,.08); font-size: 10px; text-align: center; }
.sidebar-footer { display: flex; align-items: center; gap: 10px; padding: 15px 9px 2px; border-top: 1px solid rgba(255,255,255,.08); }
.sidebar-user-avatar { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: #fff; background: var(--accent); font-weight: 800; }
.sidebar-footer strong { font-size: 12px; }
.admin-workspace { min-width: 0; margin-left: 248px; }
.admin-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 28px;
  border-bottom: 1px solid var(--line);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(16px);
}
.topbar-title { display: flex; align-items: center; gap: 12px; }
.topbar-title > div { display: grid; gap: 2px; }
.topbar-title span { color: var(--muted); font-size: 11px; }
.topbar-title h1 { font-size: 19px; }
.sidebar-toggle { display: none; width: 40px; padding: 0; }
.top-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.top-actions a, .top-actions button { min-height: 36px; display: grid; place-items: center; padding: 8px 11px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 12px; }
.admin-content { width: min(100%, 1680px); margin: 0 auto; padding: 24px 28px 42px; }
.admin-page { display: none; }
.admin-page.active { display: block; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin: 0 0 20px; }
.page-heading > div:first-child { display: grid; gap: 6px; }
.page-heading h2 { font-size: 25px; }
.page-heading p { color: var(--muted); font-size: 13px; }
.date-chip { padding: 9px 13px; border-radius: 10px; color: var(--muted); background: #fff; box-shadow: var(--shadow); font-size: 12px; }

/* Dashboard */
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr)); gap: 14px; margin-bottom: 16px; }
.stats-grid article { min-height: 126px; display: grid; align-content: space-between; padding: 18px; border-radius: 16px; background: var(--panel); box-shadow: var(--shadow); }
.stats-grid article.attention { background: var(--warm-soft); }
.stats-grid span, .stats-grid small { color: var(--muted); font-size: 12px; }
.stats-grid strong { font-size: 29px; line-height: 1; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr); gap: 16px; margin-bottom: 16px; }
.dashboard-section, .data-section, .orders-panel, .payment-health, .future-module, .settings-panel {
  margin-bottom: 16px;
  padding: 20px;
  border-radius: 16px;
  background: var(--panel);
  box-shadow: var(--shadow);
}
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 17px; }
.section-heading > div { display: grid; gap: 4px; }
.section-heading h3 { font-size: 16px; }
.section-heading p, .section-heading small { color: var(--muted); font-size: 11px; }
.section-heading > span { color: var(--muted); font-size: 11px; }
.sales-trend { min-height: 190px; display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; align-items: end; padding-top: 12px; border-bottom: 1px solid var(--line); }
.trend-day { min-width: 0; height: 100%; display: grid; grid-template-rows: 1fr auto auto; align-items: end; gap: 5px; text-align: center; }
.trend-value { color: var(--muted); font-size: 10px; }
.trend-bar-wrap { height: 126px; display: flex; align-items: end; justify-content: center; }
.trend-bar { width: min(28px, 58%); min-height: 4px; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, #28b7aa, var(--accent)); }
.trend-label { padding-bottom: 7px; color: var(--muted); font-size: 10px; }
.status-overview { display: grid; gap: 8px; }
.status-overview button { min-height: 45px; display: flex; align-items: center; justify-content: space-between; padding: 10px 13px; border: 0; background: var(--panel-soft); }
.status-overview span { color: var(--muted); font-size: 12px; }
.status-overview strong { font-size: 18px; }
.funnel-grid { display: grid; grid-template-columns: 1fr 18px 1fr 18px 1fr 18px 1fr 18px 1fr 18px 1fr; align-items: center; gap: 5px; }
.funnel-grid div { min-height: 75px; display: grid; place-items: center; align-content: center; gap: 7px; border-radius: 12px; background: var(--panel-soft); }
.funnel-grid span { color: var(--muted); font-size: 11px; }
.funnel-grid strong { font-size: 18px; }
.funnel-grid i { width: 0; height: 0; justify-self: center; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 7px solid #bdc7c2; }
.recent-orders { display: grid; }
.recent-order { display: grid; grid-template-columns: minmax(140px, 1.2fr) 1fr .8fr .6fr; gap: 15px; align-items: center; padding: 12px 4px; border-top: 1px solid var(--line); font-size: 12px; }
.recent-order:first-child { border-top: 0; }
.recent-order span { color: var(--muted); }

/* Product and config modules */
.settings-panel { display: grid; gap: 14px; }
.product-settings { display: grid; gap: 22px; }
.product-group { display: grid; gap: 12px; }
.product-group-title { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.product-group-title h4 { margin: 0; font-size: 14px; }
.product-group-title p { color: var(--muted); font-size: 11px; }
.product-card-grid, .service-card-grid { display: grid; grid-template-columns: repeat(2, minmax(260px, 1fr)); gap: 12px; }
.product-card, .service-card { display: grid; gap: 13px; padding: 17px; border-radius: 14px; background: var(--panel-soft); }
.product-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.product-card-title { display: grid; gap: 4px; }
.product-card-title strong { font-size: 15px; }
.product-card-title span, .sku-chip { color: var(--muted); font-size: 10px; }
.sku-chip { padding: 4px 7px; border-radius: 6px; background: #eef1ee; }
.product-card-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.product-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.margin-value { font-size: 12px; color: var(--accent); font-weight: 700; }
#saveSettingsButton, #saveCouponsButton, #savePaymentButton, #saveGalleryButton, #saveStickerButton { padding: 0 15px; border-color: var(--accent); color: #fff; background: var(--accent); font-weight: 700; }
#settingsResult, #couponSettingsResult, #paymentResult, #galleryResult, #stickerResult, #aiFeatureResult { color: var(--muted); font-size: 12px; }
.coupon-admin-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-top: 16px; padding-top: 20px; border-top: 1px solid var(--line); }
.coupon-admin-head h3 { margin: 0 0 5px; font-size: 16px; }
.coupon-admin-head p { color: var(--muted); font-size: 11px; }
.coupon-settings { display: grid; gap: 10px; }
.coupon-setting-item { display: grid; grid-template-columns: minmax(170px,1.4fr) minmax(135px,1fr) repeat(3,minmax(100px,.75fr)) auto; gap: 10px; align-items: end; padding: 16px; border-radius: 14px; background: var(--panel-soft); }
.coupon-enabled { display: flex; align-items: center; gap: 7px; min-height: 40px; }
.coupon-enabled input { width: auto; min-height: 0; }
.coupon-admin-actions, .gallery-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.coupon-admin-actions { margin-top: 10px; }
.coupon-list { margin-top: 18px; }
.coupon-table-wrap { overflow-x: auto; border-radius: 14px; background: #fff; }
.coupon-table { width: 100%; min-width: 1120px; border-collapse: collapse; }
.coupon-table th { padding: 11px 12px; color: var(--muted); background: #f5f6f4; font-size: 10px; text-align: left; white-space: nowrap; }
.coupon-table td { padding: 13px 12px; border-top: 1px solid var(--line); font-size: 11px; vertical-align: middle; }
.coupon-table code { color: #52625b; font-size: 10px; }
.coupon-status { display: inline-flex; padding: 4px 8px; border-radius: 20px; font-size: 10px; font-weight: 700; }
.coupon-status.enabled { color: #167452; background: #e7f5ee; }
.coupon-status.disabled { color: #786f69; background: #eeefed; }
.coupon-row-actions { display: flex; gap: 5px; white-space: nowrap; }
.coupon-row-actions button { min-height: 30px; padding: 0 9px; font-size: 10px; }
.coupon-row-actions .danger { color: #a43b31; }
.coupon-empty { padding: 22px; border-radius: 14px; color: var(--muted); background: var(--panel-soft); text-align: center; }
#saveCouponsButton:disabled { opacity: .6; cursor: wait; }

/* Payment */
.payment-health { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; background: transparent; box-shadow: none; padding: 0; }
.health-card { min-height: 110px; display: grid; align-content: space-between; gap: 8px; padding: 17px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.health-card span, .health-card small { color: var(--muted); font-size: 11px; }
.health-card strong { font-size: 16px; }
.health-status { justify-self: start; padding: 4px 8px; border-radius: 20px; color: var(--accent); background: var(--accent-soft); font-size: 10px; }
.payment-config { display: grid; grid-template-columns: 122px minmax(160px,.7fr) minmax(250px,1.2fr) minmax(250px,1fr); gap: 13px; align-items: end; }
.qr-preview { width: 112px; height: 112px; display: grid; place-items: center; border-radius: 12px; background: var(--panel-soft); color: var(--muted); font-size: 11px; text-align: center; overflow: hidden; }
.qr-preview img { width: 100%; height: 100%; object-fit: contain; }
.payment-config textarea { min-height: 82px; }
.payment-mode-row { grid-column: 2 / -1; display: flex; gap: 9px; align-items: center; }

/* Tables and operations */
.filters { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 14px; }
.segmented { display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: #ebecea; }
.segmented button, .ai-admin-tabs button { border: 0; background: transparent; }
.segmented button.active, .ai-admin-tabs button.active { color: var(--accent); background: #fff; box-shadow: 0 3px 9px rgba(31,43,37,.06); }
#searchInput { max-width: 310px; }
.orders-panel { padding: 0; overflow: auto; }
.orders-panel table, .data-table, .ai-admin-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.orders-panel table { min-width: 1480px; }
.order-checkbox-cell { width: 42px; text-align: center; }
.order-checkbox-cell input { width: 17px; height: 17px; accent-color: var(--accent); cursor: pointer; }
.order-batch-bar { position: sticky; top: 12px; z-index: 8; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding: 13px 16px; border: 1px solid rgba(8,127,120,.2); border-radius: 14px; background: rgba(239,248,245,.96); box-shadow: 0 10px 28px rgba(19,45,38,.09); backdrop-filter: blur(12px); }
.order-batch-bar > div:first-child { display: grid; gap: 3px; }
.order-batch-bar strong { color: #113b35; font-size: 13px; }
.order-batch-bar span { color: var(--muted); font-size: 11px; }
.order-batch-actions { display: flex; gap: 8px; }
.order-batch-actions button { min-height: 36px; padding: 0 13px; white-space: nowrap; }
.order-batch-actions .primary { color: #fff; border-color: var(--accent); background: var(--accent); }
.production-download-state { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 18px; color: #8b641f; background: #fff3d7; font-size: 10px; white-space: nowrap; }
.production-download-state.downloaded { color: var(--accent); background: var(--accent-soft); }
th { padding: 13px 12px; color: var(--muted); background: #fafaf8; text-align: left; font-size: 11px; white-space: nowrap; }
td { padding: 13px 12px; border-top: 1px solid var(--line); vertical-align: top; }
td > strong, td > span { display: block; }
td > span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.table-wrap, .ai-admin-table-wrap { overflow: auto; }
.status-badge { display: inline-block; padding: 5px 8px; border-radius: 20px; font-size: 10px; white-space: nowrap; }
.order-source-badge { display: inline-block; min-width: 56px; padding: 5px 8px; border-radius: 20px; color: #176fa3; background: #e8f4fb; font-size: 10px; text-align: center; white-space: nowrap; }
.order-source-h5 { color: #8a5b17; background: #fbf0dc; }
.order-source-wechat_mini_program { color: #087f78; background: #e4f4ef; }
.order-source-admin { color: #74531d; background: #f7efd9; }
.order-source-unknown { color: #5d6670; background: #eff1f2; }
.status-pending, .status-pending_payment, .status-pending_production { color: #9c6314; background: #fff2d7; }
.status-making, .status-producing { color: #176fa3; background: #e8f4fb; }
.status-done, .status-pending_shipment { color: var(--accent); background: var(--accent-soft); }
.status-shipped, .status-completed, .status-cancelled, .status-closed { color: #5d6670; background: #eff1f2; }
.order-note-preview { display: block; max-width: 170px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.row-actions { width: 116px; display: grid; gap: 6px; }
.row-actions button { min-height: 34px; padding: 0 10px; font-size: 11px; white-space: nowrap; }
.row-actions .order-primary-action { border-color: rgba(8, 127, 120, .28); color: var(--accent); background: var(--accent-soft); font-weight: 700; }

/* Order detail workflow */
body.order-detail-open { overflow: hidden; }
.order-detail-modal { position: fixed; inset: 0; z-index: 100; display: grid; grid-template-columns: minmax(0, 1fr) minmax(640px, 820px); }
.order-detail-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 0; background: rgba(19, 28, 24, .46); backdrop-filter: blur(3px); }
.order-detail-dialog { position: relative; grid-column: 2; min-width: 0; height: 100vh; overflow: auto; background: var(--bg); box-shadow: -18px 0 60px rgba(14, 27, 22, .18); }
.order-detail-header { position: sticky; top: 0; z-index: 4; display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); backdrop-filter: blur(14px); }
.order-detail-header > div { display: grid; gap: 4px; }
.order-detail-header span { color: var(--accent); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.order-detail-header h2 { font-size: 22px; }
.order-detail-close { width: 40px; min-height: 40px; border-radius: 50%; font-size: 24px; line-height: 1; }
.order-detail-content { display: grid; gap: 14px; padding: 20px 24px 36px; }
.order-detail-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-radius: 16px; background: linear-gradient(135deg, #163a34, #087f78); color: #fff; box-shadow: var(--shadow); }
.order-detail-summary > div { display: grid; gap: 5px; }
.order-detail-summary > div span { color: rgba(255,255,255,.68); font-size: 11px; }
.order-detail-summary > div strong { font-size: 18px; }
.order-detail-summary .status-badge { color: #fff; background: rgba(255,255,255,.14); }
.order-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.order-detail-card { display: grid; gap: 16px; padding: 18px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.order-detail-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.order-detail-card header > div { display: grid; gap: 4px; }
.order-detail-card h3 { font-size: 15px; }
.order-detail-card header p { color: var(--muted); font-size: 11px; }
.order-product-card { grid-column: 1 / -1; }
.order-detail-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; margin: 0; }
.order-detail-card dl > div { min-width: 0; display: grid; gap: 4px; }
.order-detail-card dl .wide { grid-column: 1 / -1; }
.order-detail-card dt { color: var(--muted); font-size: 11px; }
.order-detail-card dd { margin: 0; overflow-wrap: anywhere; font-size: 13px; font-weight: 700; }
.production-file-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.production-file-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--panel-soft); }
.production-file-preview { position: relative; min-height: 230px; display: grid; place-items: center; padding: 12px; overflow: hidden; background: #eef1ee; }
.production-file-preview img { width: 100%; height: 230px; object-fit: contain; }
.production-file-preview span { color: var(--muted); font-size: 12px; }
.production-file-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; background: #fff; }
.production-file-meta > div { min-width: 0; display: grid; gap: 3px; }
.production-file-meta span { color: var(--muted); font-size: 10px; }
.production-file-meta strong { font-size: 12px; }
.production-file-meta button { flex: 0 0 auto; min-height: 34px; padding: 0 12px; color: var(--accent); }
.integration-reserved { flex: 0 0 auto; padding: 5px 8px; border-radius: 999px; color: var(--warm); background: var(--warm-soft); font-size: 10px; }
.shipping-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) auto; align-items: end; gap: 10px; }
.shipping-submit { min-height: 40px; padding: 0 16px; border-color: var(--accent); color: #fff; background: var(--accent); font-weight: 700; }
.order-note-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.order-note-form textarea { min-height: 82px; resize: vertical; }
.order-note-form button { min-width: 100px; }
.detail-form-result { min-height: 16px; color: var(--accent); font-size: 11px; }
.creative-points-dialog { max-width: 900px; }
.creative-points-content { display: grid; gap: 18px; }
.creative-points-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.creative-points-summary article { display: grid; gap: 6px; padding: 18px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.creative-points-summary span { color: var(--muted); font-size: 11px; }
.creative-points-summary strong { color: var(--accent); font-size: 26px; }
.creative-points-adjust-form { display: grid; grid-template-columns: minmax(140px, .6fr) minmax(260px, 1.4fr) auto; align-items: end; gap: 12px; }
.creative-points-submit { min-height: 40px; padding: 0 16px; border-color: var(--accent); color: #fff; background: var(--accent); font-weight: 700; }
.creative-points-ledger { width: 100%; min-width: 720px; border-collapse: collapse; }
.creative-points-ledger th, .creative-points-ledger td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; font-size: 11px; }
.creative-points-ledger th { color: var(--muted); font-weight: 700; }
.creative-points-ledger .points-positive { color: var(--accent); font-weight: 800; }
.creative-points-ledger .points-negative { color: #b14a3b; font-weight: 800; }

@media (max-width: 900px) {
  .order-detail-modal { grid-template-columns: 1fr; }
  .order-detail-dialog { grid-column: 1; }
}
@media (max-width: 640px) {
  .order-detail-header, .order-detail-content { padding-left: 14px; padding-right: 14px; }
  .order-detail-grid, .production-file-grid { grid-template-columns: 1fr; }
  .order-product-card { grid-column: auto; }
  .shipping-form, .order-note-form { grid-template-columns: 1fr; }
  .shipping-submit, .order-note-form button { width: 100%; }
  .creative-points-summary, .creative-points-adjust-form { grid-template-columns: 1fr; }
  .creative-points-submit { width: 100%; }
}
.empty-state { padding: 30px; color: var(--muted); text-align: center; }
.production-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.production-column { min-height: 260px; padding: 17px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.production-column h3 { display: flex; justify-content: space-between; font-size: 15px; }
.production-column h3 span { color: var(--muted); }
.production-order { display: grid; gap: 4px; margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--panel-soft); font-size: 11px; }
.production-order span { color: var(--muted); }

/* AI operations */
.ai-control-shell { display: grid; gap: 16px; }
.ai-admin-tabs { display: flex; gap: 4px; padding: 5px; overflow-x: auto; border-radius: 12px; background: #ebecea; scrollbar-width: thin; }
.ai-admin-tabs button { flex: 0 0 auto; padding: 0 14px; white-space: nowrap; }
.ai-admin-view-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 2px 2px 0; }
.ai-admin-view-heading > div { display: grid; gap: 5px; }
.ai-admin-view-heading h3 { font-size: 18px; }
.ai-admin-view-heading p { color: var(--muted); font-size: 11px; }
.ai-admin-panel { min-height: 360px; }
.admin-loading { min-height: 280px; display: grid; place-items: center; color: var(--muted); background: #fff; border-radius: 16px; box-shadow: var(--shadow); }
.ai-metrics-grid { display: grid; grid-template-columns: repeat(6, minmax(135px, 1fr)); gap: 12px; margin-bottom: 14px; }
.ai-metric-card { min-height: 126px; display: grid; align-content: space-between; gap: 9px; padding: 17px; border-radius: 14px; background: #fff; box-shadow: var(--shadow); }
.ai-metric-card span, .ai-metric-card small { color: var(--muted); font-size: 11px; }
.ai-metric-card strong { font-size: 25px; line-height: 1; }
.ai-metric-card.accent { color: var(--accent); background: linear-gradient(145deg, #fff, var(--accent-soft)); }
.ai-metric-card.warm { color: var(--warm); background: linear-gradient(145deg, #fff, var(--warm-soft)); }
.ai-metric-card.success strong { color: #16845f; }
.ai-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, .7fr); gap: 14px; margin-bottom: 14px; }
.ai-insight-card { margin-bottom: 14px; padding: 19px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.ai-insight-card > header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.ai-insight-card h4 { margin: 0 0 4px; font-size: 15px; }
.ai-insight-card p { color: var(--muted); font-size: 11px; }
.ai-trend-chart { height: 156px; display: grid; grid-template-columns: repeat(7, 1fr); align-items: end; gap: 9px; border-bottom: 1px solid var(--line); }
.ai-trend-chart > div { height: 100%; display: grid; grid-template-rows: 22px 1fr 24px; align-items: end; justify-items: center; }
.ai-trend-chart span, .ai-trend-chart small { color: var(--muted); font-size: 10px; }
.ai-trend-chart i { width: min(30px, 60%); min-height: 8px; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, #31b9ae, var(--accent)); }
.ai-status-list { display: grid; gap: 5px; }
.ai-status-list > div { min-height: 41px; display: flex; align-items: center; justify-content: space-between; padding: 9px 11px; border-radius: 9px; background: var(--panel-soft); }
.ai-status-list span { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }
.ai-status-list i { width: 7px; height: 7px; border-radius: 50%; background: #d49a35; }
.ai-status-list i.success { background: #1c9a70; }
.ai-status-list i.danger { background: var(--danger); }
.ai-config-grid, .ai-provider-grid { display: grid; grid-template-columns: repeat(2, minmax(300px, 1fr)); gap: 14px; }
.ai-config-card, .ai-provider-card { display: grid; gap: 15px; padding: 18px; border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
.ai-config-card > header, .ai-provider-card > header { display: flex; align-items: flex-start; gap: 11px; }
.ai-config-card > header > div, .ai-provider-card > header > div:not(.provider-mark) { min-width: 0; display: grid; gap: 3px; }
.ai-config-card header span, .ai-provider-card header span { color: var(--muted); font-size: 10px; overflow: hidden; text-overflow: ellipsis; }
.ai-config-status, .provider-health { margin-left: auto; padding: 5px 8px; border-radius: 20px; color: var(--muted); background: #eff1ef; font-size: 10px; font-style: normal; white-space: nowrap; }
.ai-config-status.enabled, .provider-health.ready { color: #137f5b; background: #e8f7f0; }
.ai-config-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; align-items: end; }
.ai-margin { min-height: 64px; display: grid; align-content: center; gap: 3px; padding: 10px 12px; border-radius: 10px; background: var(--panel-soft); }
.ai-margin span { color: var(--muted); font-size: 10px; }
.ai-config-card > footer, .ai-provider-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 13px; border-top: 1px solid var(--line); }
.ai-config-card footer span, .ai-provider-card footer span { color: var(--muted); font-size: 10px; }
.ai-config-card footer button { padding: 0 14px; border-color: var(--accent); color: #fff; background: var(--accent); }
.provider-mark { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(145deg, #1d3341, var(--accent)); font-size: 11px; font-weight: 800; }
.ai-provider-card dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin: 0; }
.ai-provider-card dl div { min-width: 0; padding: 10px 11px; border-radius: 9px; background: var(--panel-soft); }
.ai-provider-card dt { color: var(--muted); font-size: 10px; }
.ai-provider-card dd { margin: 4px 0 0; font-size: 12px; overflow-wrap: anywhere; }
.ai-status { display: inline-flex; padding: 4px 7px; border-radius: 20px; color: #8b641e; background: #fff3d8; font-size: 10px; white-space: nowrap; }
.ai-status.success { color: #137f5b; background: #e7f7ef; }
.ai-status.danger { color: var(--danger); background: #faecea; }
.ai-empty-state, .ai-db-error { min-height: 210px; display: grid; place-items: center; align-content: center; gap: 8px; color: var(--muted); text-align: center; background: #fff; border-radius: 16px; box-shadow: var(--shadow); }
.ai-empty-state span, .ai-db-error span { font-size: 11px; }
.ai-db-error strong { color: var(--danger); font-size: 16px; }
.ai-db-error button { margin-top: 6px; padding: 0 15px; }
.ai-feature-bars { display: grid; gap: 15px; }
.ai-feature-bars > div { display: grid; gap: 6px; }
.ai-feature-bars > div > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 11px; }
.ai-feature-bars > div > div span, .ai-feature-bars small { color: var(--muted); font-size: 10px; }
.ai-feature-bars em { height: 7px; border-radius: 10px; background: #edf0ee; overflow: hidden; }
.ai-feature-bars em i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), #34bcb0); }
.ai-number-stack { display: grid; gap: 8px; }
.ai-number-stack > div { display: flex; align-items: center; justify-content: space-between; padding: 13px; border-radius: 10px; background: var(--panel-soft); }
.ai-number-stack span { color: var(--muted); font-size: 11px; }
.ai-number-stack strong { font-size: 19px; }
.ai-wallet-section { grid-column: 1 / -1; margin-top: 2px; }
.ai-wallet-actions { display: flex; flex-wrap: wrap; gap: 6px; min-width: 150px; }
.ai-wallet-actions button { white-space: nowrap; }
.ai-wallet-actions button.secondary { background: #fff; color: #506078; border: 1px solid #dbe2ea; }
.ai-theme-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding: 16px 18px; border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
.ai-theme-toolbar > div { display: grid; gap: 4px; }
.ai-theme-toolbar span { color: var(--muted); font-size: 11px; }
.ai-theme-toolbar button { border-color: var(--accent); color: #fff; background: var(--accent); }
.ai-theme-config-grid { display: grid; grid-template-columns: repeat(2, minmax(320px, 1fr)); gap: 14px; }
.ai-theme-config-card { display: grid; gap: 15px; padding: 18px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.ai-theme-config-card > header { display: flex; align-items: flex-start; gap: 12px; }
.ai-theme-config-card > header > div { min-width: 0; display: grid; gap: 3px; }
.ai-theme-config-card header span { color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.ai-theme-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ai-theme-fields .ai-theme-toggle { display: flex; min-height: 44px; align-items: center; flex-direction: row; gap: 10px; }
.ai-theme-fields .ai-theme-toggle input { width: 18px; height: 18px; margin: 0; }
.ai-theme-fields label > small { color: var(--muted); font-size: 9px; font-weight: 400; }
.ai-theme-fields .wide { grid-column: 1 / -1; }
.ai-theme-fields textarea { min-height: 74px; resize: vertical; }
.ai-prompt-detail { scroll-margin-top: 20px; }
.ai-prompt-detail > header button { white-space: nowrap; }
.ai-prompt-detail-actions, .ai-prompt-editor-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.ai-prompt-editor { scroll-margin-top: 20px; }
.ai-prompt-editor textarea, .ai-prompt-editor input, .ai-prompt-editor select { width: 100%; }
.ai-prompt-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-bottom: 12px; }
.ai-prompt-meta span { min-width: 0; display: grid; gap: 4px; padding: 10px 12px; border-radius: 10px; background: var(--panel-soft); overflow-wrap: anywhere; }
.ai-prompt-meta span.wide { grid-column: span 2; }
.ai-prompt-meta b { color: var(--muted); font-size: 10px; font-weight: 500; }
.ai-prompt-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ai-prompt-content article { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 12px; }
.ai-prompt-content h5 { margin: 0 0 8px; font-size: 12px; }
.ai-prompt-content pre { max-height: 240px; margin: 0; overflow: auto; color: #4e5a64; font: 11px/1.65 Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.ai-theme-config-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 13px; border-top: 1px solid var(--line); }
.ai-theme-config-card footer span { color: var(--muted); font-size: 10px; }
.ai-theme-config-card footer [data-theme-save-status].error { color: #b84332; font-weight: 600; }
.ai-theme-config-card footer button { border-color: var(--accent); color: #fff; background: var(--accent); }
.ai-theme-config-card footer button.secondary { border-color: var(--line); color: var(--ink); background: #fff; }
.ai-theme-pricing-panel { padding: 16px; border: 1px solid rgba(13,133,124,.18); border-radius: 14px; background: linear-gradient(135deg,rgba(239,250,248,.9),rgba(255,255,255,.96)); }
.ai-theme-pricing-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.ai-theme-pricing-panel > header div { display: flex; flex-direction: column; gap: 3px; }
.ai-theme-pricing-panel > header span { color: var(--muted); font-size: 10px; }
.ai-theme-pricing-panel > header i { padding: 5px 9px; border-radius: 999px; background: #dff3ef; color: #087e73; font-size: 10px; font-style: normal; }
.ai-theme-price-mode { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 14px; }
.ai-theme-price-mode label { display: flex; align-items: center; gap: 7px; color: #27413d; font-size: 11px; font-weight: 700; }
.ai-theme-price-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.ai-theme-price-fields label { display: flex; flex-direction: column; gap: 6px; color: #58706c; font-size: 10px; }
.ai-theme-price-fields input { width: 100%; box-sizing: border-box; padding: 10px 11px; border: 1px solid #d9e5e2; border-radius: 10px; background: #fff; color: #18312d; }
.ai-theme-pricing-panel > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; }
.ai-theme-pricing-panel > footer span { color: var(--muted); font-size: 10px; }
.ai-theme-pricing-panel > footer button { border-color: var(--accent); color: #fff; background: var(--accent); }

/* AI and assets */
.gallery-settings, .sticker-settings { display: grid; gap: 10px; }
.gallery-item { display: grid; grid-template-columns: 140px repeat(4,minmax(150px,1fr)) auto auto; gap: 9px; align-items: end; padding: 14px; border-radius: 12px; background: var(--panel-soft); }
.sticker-item { display: grid; grid-template-columns: 70px 160px minmax(230px,1fr) auto auto; gap: 10px; align-items: end; padding: 14px; border-radius: 12px; background: var(--panel-soft); }
.sticker-thumb { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 10px; background: #fff; overflow: hidden; color: var(--muted); font-size: 10px; }
.sticker-thumb img { width: 52px; height: 52px; object-fit: contain; }
.future-module { min-height: 250px; display: grid; place-items: center; align-content: center; gap: 10px; text-align: center; }
.future-module > span { padding: 5px 9px; border-radius: 20px; color: var(--warm); background: var(--warm-soft); font-size: 10px; }
.future-module p { max-width: 620px; color: var(--muted); }
.future-module code { color: var(--accent); }
.system-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.system-grid article { min-height: 160px; display: grid; align-content: start; gap: 10px; padding: 19px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.system-grid span, .system-grid p { color: var(--muted); font-size: 11px; }

/* Workbench operation banners */
.workbench-banner-admin { margin-top: 16px; }
.workbench-banner-admin-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.workbench-banner-admin-head > div { display: grid; gap: 5px; }
.workbench-banner-admin-head h3 { margin: 0; }
.workbench-banner-admin-head p { max-width: 680px; color: var(--muted); font-size: 11px; }
.workbench-banner-admin-list { display: grid; gap: 12px; }
.workbench-banner-editor { padding: 17px; border-radius: 14px; background: var(--panel-soft); }
.workbench-banner-editor-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.workbench-banner-editor-grid label { display: grid; align-content: start; gap: 6px; }
.workbench-banner-editor-grid label > span { color: var(--muted); font-size: 10px; }
.workbench-banner-editor-grid .wide { grid-column: span 2; }
.workbench-banner-editor-grid textarea { min-height: 70px; resize: vertical; }
.workbench-banner-editor > footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.workbench-banner-editor > footer > span { color: var(--muted); font-size: 10px; }
.workbench-banner-editor > footer > div { display: flex; gap: 8px; }
.workbench-banner-editor .danger-link { color: var(--danger); background: transparent; border-color: rgba(188, 65, 55, .2); }
.workbench-banner-admin .settings-result { min-height: 20px; margin-top: 10px; color: var(--muted); font-size: 11px; }
.admin-empty-state { padding: 28px; border-radius: 14px; color: var(--muted); background: var(--panel-soft); text-align: center; }

/* Unified payment records */
.payment-records-panel { margin-top: 14px; }
.payment-records-result { min-height: 20px; color: var(--muted); font-size: 11px; }
.payment-records-table-wrap { margin-top: 12px; overflow-x: auto; border-radius: 12px; background: #fff; }
.payment-records-table { width: 100%; min-width: 980px; border-collapse: collapse; }
.payment-records-table th, .payment-records-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; font-size: 11px; }
.payment-records-table th { color: var(--muted); background: var(--panel-soft); font-weight: 600; white-space: nowrap; }
.payment-records-table td small { display: block; margin-top: 3px; color: var(--muted); }
.payment-record-status { display: inline-flex; padding: 4px 8px; border-radius: 20px; color: #8b641e; background: #fff3d8; white-space: nowrap; }
.payment-record-status.paid { color: #137f5b; background: #e7f7ef; }
.payment-record-status.failed, .payment-record-status.closed { color: var(--danger); background: #faecea; }
.payment-records-empty { padding: 30px; color: var(--muted); text-align: center; }

@media (max-width: 1250px) {
  .admin-sidebar { width: 224px; }
  .admin-workspace { margin-left: 224px; }
  .admin-content { padding: 20px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .product-card-fields { grid-template-columns: repeat(2, 1fr); }
  .coupon-setting-item { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .payment-config { grid-template-columns: 122px repeat(2, minmax(220px,1fr)); }
  .payment-config > label:nth-of-type(3) { grid-column: 2 / -1; }
  .ai-feature-row { grid-template-columns: repeat(4, minmax(130px,1fr)); }
  .ai-metrics-grid { grid-template-columns: repeat(3, minmax(140px, 1fr)); }
  .workbench-banner-editor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-height: 800px) and (min-width: 901px) {
  .admin-sidebar { padding-top: 12px; }
  .sidebar-brand { padding-bottom: 10px; }
  .nav-group-label { padding-top: 10px; }
  .admin-nav button { min-height: 37px; }
  .sidebar-footer { padding-top: 9px; }
}

@media (max-width: 900px) {
  .admin-sidebar { transform: translateX(-100%); transition: transform .22s ease; box-shadow: 20px 0 50px rgba(15,28,22,.2); }
  .admin-sidebar.open { transform: translateX(0); }
  .admin-workspace { margin-left: 0; }
  .sidebar-toggle { display: block; }
  .admin-topbar { padding: 10px 16px; }
  .top-actions { display: none; }
  .admin-content { padding: 18px 14px 36px; }
  .dashboard-grid, .product-card-grid, .service-card-grid, .production-board, .system-grid { grid-template-columns: 1fr; }
  .ai-dashboard-grid, .ai-config-grid, .ai-provider-grid { grid-template-columns: 1fr; }
  .ai-theme-config-grid { grid-template-columns: 1fr; }
  .ai-metrics-grid { grid-template-columns: repeat(2, minmax(130px, 1fr)); }
  .ai-admin-view-heading { align-items: flex-start; flex-direction: column; }
  .funnel-grid { grid-template-columns: repeat(3,1fr); }
  .funnel-grid i { display: none; }
  .payment-health, .payment-config { grid-template-columns: 1fr; }
  .workbench-banner-editor-grid { grid-template-columns: 1fr; }
  .workbench-banner-editor-grid .wide { grid-column: auto; }
  .workbench-banner-admin-head, .workbench-banner-editor > footer { align-items: stretch; flex-direction: column; }
  .payment-config > label:nth-of-type(3), .payment-mode-row { grid-column: auto; }
  .filters { align-items: stretch; flex-direction: column; }
  .order-batch-bar { position: static; align-items: stretch; flex-direction: column; }
  .order-batch-actions { flex-wrap: wrap; }
  #searchInput { max-width: none; }
}

@media (max-width: 560px) {
  .login-card { padding: 24px 20px; }
  .stats-grid { grid-template-columns: 1fr; }
  .page-heading { flex-direction: column; }
  .product-card-fields, .coupon-setting-item, .ai-feature-row { grid-template-columns: 1fr; }
  .funnel-grid { grid-template-columns: repeat(2,1fr); }
  .recent-order { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .ai-metrics-grid { grid-template-columns: 1fr; }
  .ai-config-fields, .ai-provider-card dl { grid-template-columns: 1fr; }
  .ai-theme-fields { grid-template-columns: 1fr; }
  .ai-theme-fields .wide { grid-column: auto; }
  .ai-theme-price-fields { grid-template-columns: 1fr; }
  .ai-prompt-meta, .ai-prompt-content { grid-template-columns: 1fr; }
  .ai-prompt-meta span.wide { grid-column: auto; }
}

.review-filters { align-items: center; grid-template-columns: 180px minmax(240px, 1fr) auto; }
.review-filters select, .review-filters input { min-height: 42px; border: 1px solid #e1ddd7; border-radius: 10px; background: #fff; padding: 0 12px; }
#reviewsAdminResult { color: #7d746e; font-size: 12px; white-space: nowrap; }
.review-admin-table td { vertical-align: top; }
.review-admin-table td strong, .review-admin-table td small { display: block; }
.review-admin-table td small { margin-top: 4px; color: #8a817b; }
.review-score { display: block; color: #9b6d2f; white-space: nowrap; }
.review-copy { min-width: 220px; max-width: 360px; line-height: 1.65; white-space: normal; }
.review-status { display: inline-flex; border-radius: 999px; padding: 5px 9px; background: #f0ece8; white-space: nowrap; }
.review-status.approved { background: #e5f4eb; color: #28734d; } .review-status.pending { background: #fff3dc; color: #956516; } .review-status.hidden, .review-status.rejected { background: #f5e7e5; color: #93493f; }
.review-admin-actions { display: flex; min-width: 130px; flex-wrap: wrap; gap: 6px; }

/* HK-CREATIVE-REWARD-SETTINGS-V1 */
.creative-reward-admin { border: 1px solid #e8ddd0; background: linear-gradient(145deg, #fffdf9, #fbf5ec); }
.creative-reward-admin-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.creative-reward-admin-head h3 { margin: 4px 0 7px; color: #2f211a; font-size: 21px; }
.creative-reward-admin-head p { margin: 0; max-width: 780px; color: #7d6e63; line-height: 1.7; }
.creative-reward-registration { display: grid; grid-template-columns: minmax(240px, 1fr) auto minmax(180px, 240px); align-items: center; gap: 28px; padding: 22px; border: 1px solid #e7d7c5; border-radius: 16px; background: #fff; box-shadow: 0 10px 26px rgba(73, 47, 31, .06); }
.creative-reward-registration > div > span, .creative-reward-campaign header span { color: #b17b36; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.creative-reward-registration h4, .creative-reward-campaign-heading h4 { margin: 5px 0; color: #30231c; font-size: 18px; }
.creative-reward-registration p, .creative-reward-campaign-heading p { margin: 0; color: #87786c; line-height: 1.55; }
.creative-reward-switch { display: inline-flex; align-items: center; gap: 9px; color: #4a382e; font-weight: 700; white-space: nowrap; }
.creative-reward-switch input { width: 18px; height: 18px; accent-color: #8b5e3c; }
.creative-reward-base > span, .creative-reward-fields label > span { display: block; margin-bottom: 7px; color: #76665b; font-size: 12px; font-weight: 700; }
.creative-reward-number { display: flex; align-items: center; overflow: hidden; border: 1px solid #dccbb8; border-radius: 11px; background: #fffdf9; }
.creative-reward-number input { width: 100%; min-width: 0; border: 0; background: transparent; font-size: 17px; font-weight: 800; color: #34241c; }
.creative-reward-number b { padding: 0 13px; color: #936736; font-size: 12px; white-space: nowrap; }
.creative-reward-campaign-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 28px 0 14px; }
.creative-reward-campaign-heading button, .creative-reward-campaign footer button { border: 1px solid #d8c2a8; border-radius: 10px; background: #fffaf3; color: #765035; padding: 9px 14px; font-weight: 700; cursor: pointer; }
.creative-reward-campaign-list { display: grid; gap: 14px; }
.creative-reward-campaign { padding: 19px; border: 1px solid #e7ddd2; border-radius: 15px; background: rgba(255,255,255,.88); }
.creative-reward-campaign header, .creative-reward-campaign footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.creative-reward-campaign header strong { display: block; margin-top: 3px; color: #3b2b22; }
.creative-reward-campaign header em { padding: 5px 10px; border-radius: 999px; background: #f3eadf; color: #8a633e; font-size: 12px; font-style: normal; font-weight: 800; }
.creative-reward-fields { display: grid; grid-template-columns: 1.2fr .7fr 1fr 1fr; gap: 13px; margin: 17px 0; }
.creative-reward-fields input:not([type="checkbox"]) { box-sizing: border-box; width: 100%; min-height: 42px; border: 1px solid #dfd1c2; border-radius: 10px; padding: 9px 11px; background: #fff; color: #33251d; }
.creative-reward-campaign footer { padding-top: 14px; border-top: 1px solid #eee4da; }
.creative-reward-campaign footer button { color: #a24b3c; }
@media (max-width: 980px) {
  .creative-reward-registration { grid-template-columns: 1fr; gap: 16px; }
  .creative-reward-fields { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .creative-reward-admin-head, .creative-reward-campaign-heading { align-items: stretch; flex-direction: column; }
  .creative-reward-fields { grid-template-columns: 1fr; }
}
/* HK-CREATIVE-RECHARGE-PACKAGE-IMPLEMENT-V1 */
.creative-recharge-package-admin { border: 1px solid #e5d4bf; background: linear-gradient(145deg, #fffdf8, #f8efe2); }
.creative-recharge-package-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.creative-recharge-package-head h3 { margin: 4px 0 7px; color: #2f211a; font-size: 21px; }
.creative-recharge-package-head p { margin: 0; max-width: 780px; color: #7d6e63; line-height: 1.7; }
.creative-recharge-package-list { display: grid; gap: 14px; }
.creative-recharge-package { padding: 20px; border: 1px solid #e3d3c1; border-radius: 16px; background: rgba(255,255,255,.94); box-shadow: 0 10px 26px rgba(73,47,31,.06); }
.creative-recharge-package header, .creative-recharge-package footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.creative-recharge-package header span { color: #b17b36; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.creative-recharge-package header strong { display: block; margin-top: 4px; color: #35251d; font-size: 17px; }
.creative-recharge-package header em { padding: 5px 10px; border-radius: 999px; background: #f2e7dc; color: #8b6c54; font-size: 12px; font-style: normal; font-weight: 800; }
.creative-recharge-package header em.enabled { background: #e3f3eb; color: #257254; }
.creative-recharge-package-fields { display: grid; grid-template-columns: 1.25fr .75fr .85fr .85fr .55fr .8fr; gap: 12px; margin: 18px 0; }
.creative-recharge-package-fields label > span, .creative-recharge-package-total > span { display: block; margin-bottom: 7px; color: #76665b; font-size: 12px; font-weight: 700; }
.creative-recharge-package-fields input:not([type="checkbox"]) { box-sizing: border-box; width: 100%; min-height: 42px; border: 1px solid #dfd1c2; border-radius: 10px; padding: 9px 11px; background: #fff; color: #33251d; }
.creative-recharge-package-total { padding: 9px 13px; border-radius: 11px; background: #4c3427; color: #fff8ee; }
.creative-recharge-package-total > span { margin-bottom: 1px; color: #e6c99c; }
.creative-recharge-package-total strong { margin-right: 4px; font-size: 22px; }
.creative-recharge-package-total b { font-size: 11px; }
.creative-recharge-package footer { padding-top: 15px; border-top: 1px solid #eee3d8; }
.creative-recharge-package footer > button { border: 0; border-radius: 10px; padding: 10px 16px; background: #3c281e; color: #fffaf3; font-weight: 800; cursor: pointer; }
@media (max-width: 1180px) { .creative-recharge-package-fields { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) {
  .creative-recharge-package-head { align-items: stretch; flex-direction: column; }
  .creative-recharge-package-fields { grid-template-columns: 1fr; }
}
/* HK-ADMIN-ACCOUNT-MANAGEMENT-V1 */
.admin-account-management { display: grid; gap: 18px; }
.admin-account-management-head, .admin-account-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.admin-account-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 18px; border: 1px solid #eadcc9; border-radius: 16px; background: #fbf8f3; }
.admin-account-form label, .admin-password-form label { display: grid; gap: 7px; color: #5c493c; font-size: 13px; }
.admin-account-form input, .admin-account-form select, .admin-password-form input { width: 100%; min-height: 42px; box-sizing: border-box; border: 1px solid #dfd4c8; border-radius: 10px; padding: 0 12px; background: #fff; color: #2f2018; }
.admin-account-form-actions { grid-column: 1 / -1; justify-content: flex-end; }
.admin-account-status { display: inline-flex; padding: 5px 9px; border-radius: 999px; font-size: 12px; }
.admin-account-status.enabled { color: #087c65; background: #e5f5ee; }
.admin-account-status.disabled { color: #8c392f; background: #f9e9e5; }
.admin-account-note, .data-table td small { display: block; margin-top: 5px; color: #8b7c70; }
.admin-account-note.danger { color: #b44235; }
.admin-account-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.admin-account-actions button { min-height: 34px; padding: 0 10px; }
.admin-account-actions button.danger { color: #b44235; border-color: #e6c6c1; background: #fff; }
.admin-password-dialog { width: min(520px, calc(100vw - 28px)); }
.admin-password-form { display: grid; gap: 15px; padding: 24px; }
.admin-password-form > button { min-height: 46px; }
@media (max-width: 840px) { .admin-account-form { grid-template-columns: 1fr; } }
/* SPECIAL-SHIPPING-FEES-MVP */
.shipping-base-settings > label { display: grid; gap: 8px; max-width: 320px; color: #5c493c; font-size: 13px; }
.shipping-base-settings input,
.shipping-rule-grid input,
.shipping-rule-grid select {
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid #dfd4c8;
  border-radius: 10px;
  padding: 0 12px;
  background: #fff;
  color: #2f2018;
}
.shipping-rule-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.shipping-rule-grid label { display: grid; align-content: start; gap: 7px; color: #5c493c; font-size: 13px; }
.shipping-rule-grid .shipping-rule-enabled { display: flex; align-items: center; gap: 9px; padding-top: 28px; }
.shipping-rule-grid .shipping-rule-enabled input { width: 18px; min-height: 18px; }
.shipping-rule-actions { display: flex; align-items: center; gap: 14px; margin-top: 18px; }
.shipping-rule-actions span { color: #7d6858; }
.shipping-rules-table td:first-child small { display: block; margin-top: 4px; color: #8b7c70; }
@media (max-width: 1100px) { .shipping-rule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .shipping-rule-grid { grid-template-columns: 1fr; } }

.share-reward-admin { border: 1px solid #e8ddd0; background: linear-gradient(145deg,#fffdf9,#fbf5ec); }
.share-reward-settings { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.share-reward-settings label { display: grid; gap: 8px; color: #67564c; font-size: 12px; font-weight: 700; }
.share-reward-settings input,.share-reward-settings select { min-height: 42px; box-sizing: border-box; width: 100%; border: 1px solid #dfd4c8; border-radius: 10px; background: #fff; padding: 0 12px; color: #39281f; }
@media(max-width:900px){.share-reward-settings{grid-template-columns:1fr}}

/* HK-ADMIN-ORDER-SOURCE-SHARE-V1 */
.order-source-section { overflow: hidden; }
.order-source-share { display: grid; grid-template-columns: minmax(180px, .42fr) 1fr; gap: 28px; align-items: center; padding-top: 8px; }
.order-source-donut-wrap { display: grid; place-items: center; }
.order-source-donut { width: 170px; aspect-ratio: 1; position: relative; display: grid; place-items: center; border-radius: 50%; background: #e9ece9; box-shadow: inset 0 0 0 1px rgba(34, 65, 61, .06); }
.order-source-donut::after { content: ""; position: absolute; inset: 27px; border-radius: 50%; background: #fff; box-shadow: 0 10px 24px rgba(38, 27, 20, .08); }
.order-source-donut span { position: relative; z-index: 1; display: grid; gap: 2px; text-align: center; }
.order-source-donut strong { color: #142e3a; font-family: Georgia, serif; font-size: 32px; line-height: 1; }
.order-source-donut small { color: #7d8585; font-size: 11px; }
.order-source-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.order-source-breakdown article { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 16px 14px; border: 1px solid #edf0ed; border-radius: 14px; background: #fbfcfa; }
.order-source-breakdown i { width: 9px; height: 42px; border-radius: 999px; background: var(--source-color); }
.order-source-breakdown div { min-width: 0; display: grid; gap: 4px; }
.order-source-breakdown span { overflow: hidden; color: #627071; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.order-source-breakdown strong { color: #142e3a; font-size: 15px; }
.order-source-breakdown b { color: #142e3a; font-family: Georgia, serif; font-size: 20px; }
.order-source-other { margin: 14px 0 0; color: #7a6a5e; font-size: 12px; text-align: center; }
@media (max-width: 900px) {
  .order-source-share { grid-template-columns: 1fr; }
  .order-source-breakdown { grid-template-columns: 1fr; }
}

.ai-text-template-toolbar{margin-top:26px}.ai-text-template-card{scroll-margin-top:18px}.ai-text-template-live{display:flex;min-height:96px;padding:18px;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(145deg,#765f4f,#3d3028);font-family:STSong,SimSun,serif;font-size:22px;font-weight:700;text-align:center;text-shadow:0 2px 8px rgba(0,0,0,.3)}.ai-text-template-live.font-handwriting,.ai-text-template-live.font-calligraphy{font-family:STKaiti,KaiTi,serif}.ai-text-template-actions{display:flex;gap:8px}.ai-text-template-card input[type=color]{min-height:42px;padding:4px}

.gift-admin-panel { margin: 0 0 18px; padding: 18px; border: 1px solid #ead8bd; border-radius: 18px; background: #fffaf2; }
.gift-admin-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.gift-admin-heading strong,.gift-admin-heading span { display: block; }
.gift-admin-heading > div:last-child { display: flex; align-items: center; gap: 8px; }
.gift-admin-heading select { min-height: 38px; padding: 0 30px 0 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); }
.gift-admin-heading span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.gift-admin-funnel { display: grid; grid-template-columns: repeat(7,minmax(90px,1fr)); gap: 10px; margin-bottom: 16px; }
.gift-admin-funnel article { padding: 12px; border-radius: 13px; background: #f2e8da; }
.gift-admin-funnel span,.gift-admin-funnel strong { display: block; }
.gift-admin-funnel span { color: var(--muted); font-size: 12px; }
.gift-admin-funnel strong { margin-top: 4px; font-size: 22px; }
.gift-order-badge { display: block; width: max-content; margin-top: 5px; padding: 2px 7px; border-radius: 999px; background: #f3e2c7; color: #83572f; font-size: 11px; }
.gift-asset-links{display:flex;flex-wrap:wrap;gap:6px}.gift-asset-links a{padding:5px 8px;border:1px solid #ddcbb7;border-radius:8px;color:#6d4b35;background:#fffaf4;text-decoration:none;font-size:12px}
