:root {
  --ink: #14201c;
  --muted: #6d7873;
  --faint: #939c97;
  --line: #e4ebe7;
  --bg: #eef2f0;
  --panel: #ffffff;
  --brand: #14685c;
  --brand-deep: #0e4d44;
  --brand-soft: #e7f4f0;
  --rail: #10231e;
  --rail-mid: #18332c;
  --rail-text: #c3d2cc;
  --warn: #b5812a;
  --warn-bg: #f8efd8;
  --danger: #b05757;
  --danger-bg: #f8eaea;
  --info: #4d7ea8;
  --info-bg: #eaf2f8;
  --ok: #2f7a64;
  --shadow: 0 10px 30px rgba(16, 35, 30, .08);
}
body { background: var(--bg); color: var(--ink); }
button { background: var(--brand); border-color: var(--brand); }
button:hover { filter: none; background: var(--brand-deep); }
.secondary { background: #fff; color: var(--muted); border-color: var(--line); }
.secondary:hover { background: #f7fafa; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible { outline-color: var(--brand); }

.logo { display: flex; align-items: center; gap: 10px; min-width: 148px; color: inherit; }
.mark { width: 10px; height: 22px; background: #2cb9a4; transform: skewX(-16deg); border-radius: 1px; }
.logo strong { font-size: 22px; letter-spacing: .4px; font-weight: 700; }
.logo span { color: var(--faint); font-size: 12px; margin-left: 2px; }
.logo-light { color: #fff; }

#workspace-community-sim { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 28px 32px 32px; width: min(980px, 100%); max-width: 980px; }
#workspace-community-sim h2 { margin: 0; font-size: 16px; font-weight: 650; color: var(--ink); }
.community-sim-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin: 22px 0 18px; }
.community-sim-toolbar select { width: 160px; height: 36px; margin: 0; border: 0; border-radius: 4px; background: #ececed; }
.community-sim-toolbar button { width: auto; height: 36px; margin: 0; padding: 0 18px; border: 0; border-radius: 18px; background: #ececed; }
.community-sim-add { background: #d8dcf8 !important; color: #3b47a0; }
.community-sim-cards { display: grid; gap: 14px; }
.community-sim-card { display: grid; grid-template-columns: 72px minmax(0, 1fr) 48px; gap: 16px; padding: 16px 18px; background: #ececed; border-radius: 4px; }
.community-sim-inline { display: grid; grid-template-columns: minmax(0, 1fr) 34px; gap: 8px; align-items: end; }
#community-sim-editor { max-width: none; }
#community-sim-editor input { width: 100%; height: 44px; border: 0; border-radius: 4px; background: #ececed; }
.tutorial-workspace { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 28px 32px 32px; width: min(980px, 100%); max-width: 980px; }
.tutorial-workspace h2 { margin: 0; font-size: 16px; font-weight: 650; color: var(--ink); }
.tutorial-toolbar { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin: 22px 0 18px; max-width: none; }
.tutorial-toolbar select { width: 220px; flex: 0 0 220px; height: 36px; margin: 0; border: 0; border-radius: 4px; background: #ececed; }
#tutorial-all { min-width: 72px; height: 36px; margin: 0; padding: 0 22px; border: 0; border-radius: 18px; background: #ececed; color: #22272d; }
#tutorial-new { min-width: 108px; height: 36px; margin: 0; padding: 0 22px; border: 0; border-radius: 18px; background: #d8dcf8; color: #3b47a0; }
#tutorial-list { display: grid; gap: 14px; }
.tutorial-row { min-height: 120px; display: grid; grid-template-columns: 72px minmax(0, 1fr) 48px; gap: 16px; padding: 16px 18px; background: #ececed; border-radius: 4px; }
.tutorial-thumb { width: 64px; height: 80px; display: grid; place-items: center; background: #fff; color: #30353b; font-size: 13px; text-align: center; }
.tutorial-row p { margin: 4px 0 0; font-size: 14px; color: #2c3137; }
.tutorial-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.tutorial-actions button { width: auto; min-width: 0; height: auto; padding: 0; border: 0; background: transparent; color: #2c3137; font-size: 13px; }
#tutorial-editor { max-width: none; }
.tutorial-plus { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 0 12px; cursor: pointer; background: #ececed; color: #30353b; font-size: 22px; border-radius: 4px; }
#tutorial-cover-preview { display: block; width: 96px; height: 120px; margin: 0 0 12px; object-fit: cover; border-radius: 4px; background: #ececed; }
#tutorial-editor label { margin: 8px 0 0; }
#tutorial-title { width: 100%; height: 44px; margin: 6px 0 4px; border: 0; border-radius: 4px; background: #ececed; }
.academy-poster-workspace { background: transparent; border: 0; padding: 0; width: min(980px, 100%); max-width: 980px; }
.academy-empty { position: relative; min-height: 520px; margin: 0; max-width: none; display: grid; place-items: center; background: #eef1f3; border: 1px solid var(--line); border-radius: 5px; }
.academy-plus { width: 72px; height: 72px; display: grid; place-items: center; margin: 0; cursor: pointer; background: #f3f4f5; color: #252a30; font-size: 28px; border-radius: 4px; }
.academy-chosen { position: absolute; left: 0; right: 0; bottom: 72px; margin: 0; text-align: center; color: var(--muted); font-size: 12px; }
.academy-empty .moments-submit { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); }
.academy-filled { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 28px 32px 32px; }
.academy-filled h2 { margin: 0 0 22px; font-size: 16px; font-weight: 650; color: var(--ink); }
.academy-card { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: start; gap: 16px; min-height: 120px; padding: 16px 18px; background: #ececed; border-radius: 4px; }
.academy-card-example { width: 64px; height: 80px; display: grid; place-items: center; overflow: hidden; background: #fff; color: #30353b; font-size: 13px; }
.academy-card-example img { width: 100%; height: 100%; object-fit: cover; }
.academy-card .link { justify-self: end; width: auto; padding: 0; border: 0; background: transparent; color: #2c3137; }
html.admin-session #gate { display: none !important; }
html.admin-session #app[hidden],
html.admin-session #account-panel[hidden] { display: block !important; }
.login-gate { min-height: 100vh; display: grid; grid-template-columns: 1.1fr .9fr; }
.hero {
  background:
    radial-gradient(1200px 500px at 10% 10%, rgba(44,185,164,.35), transparent 55%),
    linear-gradient(160deg, #0d2a24 0%, #14685c 52%, #0b1c18 100%);
  color: #e7f6f2; padding: 64px;
  display: flex; flex-direction: column; justify-content: space-between;
}
.hero h2 { font-size: 42px; line-height: 1.25; margin: 24px 0 12px; max-width: 520px; color: #fff; }
.hero p { max-width: 420px; color: #c5ddd7; line-height: 1.8; font-size: 14px; }
.hero-foot { font-size: 12px; color: #9ec4bb; }
.login-side { display: grid; place-items: center; padding: 40px; background: #f7f9f8; }
.login-card { width: min(420px, 100%); background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 32px; box-shadow: var(--shadow); margin: 0; }
.login-card h1 { margin: 8px 0 6px; font-size: 24px; }
.login-card p { margin: 0 0 22px; color: var(--muted); font-size: 13px; }
.login-card label { display: block; font-size: 12px; color: var(--muted); margin: 12px 0 6px; }
.login-card input { width: 100%; height: 42px; border: 1px solid var(--line); border-radius: 8px; padding: 0 12px; }
.login-card form button[type=submit] { width: 100%; margin-top: 18px; height: 42px; background: var(--brand); border-color: var(--brand); }
.login-card .secondary { margin-top: 12px; width: 100%; }

.app { min-height: 100vh; background: var(--bg); }
.top {
  height: 64px; display: flex; align-items: center; gap: 28px;
  padding: 0 22px; background: #fff; border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 8;
}
.domains { display: flex; gap: 6px; height: 100%; align-items: stretch; }
.domains button {
  border: 0; background: none; color: var(--muted); padding: 0 14px;
  position: relative; font-size: 14px; height: auto; border-radius: 0;
}
.domains button:hover { background: none; color: var(--ink); }
.domains button.active { color: var(--ink); font-weight: 600; }
.domains button.active:after {
  content: ""; position: absolute; left: 10px; right: 10px; bottom: 0;
  height: 2px; background: var(--brand);
}
.workspace-identity { margin-left: auto; display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 12px; }
.workspace-identity p { margin: 0; font-size: 12px; color: var(--muted); }
.workspace-space { font-size: 12px; color: var(--muted); }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; background: var(--brand-soft);
  color: var(--brand-deep); display: grid; place-items: center; font-weight: 600; font-size: 12px;
}
.workspace-identity [data-logout] { padding: 8px 12px; border-radius: 8px; }

.workspace-shell { display: grid; grid-template-columns: 220px minmax(0, 1fr); min-height: calc(100vh - 64px); }
.rail { background: var(--rail); color: var(--rail-text); padding: 22px 12px 28px; }
.rail-label { font-size: 11px; color: #7f938c; padding: 0 12px 10px; }
.workspace-nav { display: flex; flex-direction: column; gap: 4px; margin: 0; width: auto; height: auto; overflow: visible; border: 0; }
.workspace-nav button {
  width: 100%; text-align: left; border: 0; background: none; color: inherit;
  padding: 10px 12px; border-radius: 8px; font-size: 13px; height: auto; white-space: normal;
}
.workspace-nav button:hover { background: var(--rail-mid); color: #fff; }
.workspace-nav button.active { background: var(--rail-mid); color: #fff; font-weight: 600; border: 0; }

.main-col { min-width: 0; display: flex; flex-direction: column; }
.workspace-toolbar { padding: 28px 32px 0; background: transparent; border: 0; display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 0; }
.workspace-toolbar h1 { margin: 0 0 6px; font-size: 26px; font-weight: 650; }
.workspace-toolbar p { margin: 0; color: var(--muted); font-size: 13px; }
.workspace-tabs { display: flex; gap: 18px; border-bottom: 1px solid var(--line); margin: 16px 32px 0; }
.workspace-tabs button { border: 0; background: none; padding: 0 0 12px; color: var(--muted); height: auto; border-radius: 0; }
.workspace-tabs button:hover { background: none; color: var(--ink); }
.workspace-tabs button.active { color: var(--ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--brand); }

#account-panel { display: block; padding: 22px 32px 40px; background: transparent; }
#account-panel > .workspace { margin: 0; min-width: 0; background: transparent; min-height: calc(100vh - 220px); }
.review-workspace, .publication-workspace, .user-workspace, .agreement-workspace, .prompt-workspace {
  background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden;
}
#account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: 280px minmax(0, 1fr) 320px; }
#account-panel .user-workspace { grid-template-columns: minmax(0, 1fr) 320px; }
.workspace-rail { background: #fff; }
.workspace-inspector { background: #fff; }
.workspace-stage { background: #f4f6f5; }
.column-title { color: var(--muted); }
.stage-empty { color: var(--faint); }
.q-item, .workspace-rail #community-list button, .workspace-rail #official-list button, .workspace-rail #publication-list button {
  border-radius: 10px; border: 1px solid transparent;
}
.workspace-rail button.secondary:hover { background: var(--brand-soft); }

.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding: 0; }
.metric { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 18px 18px 16px; min-height: 0; }
.metric span { color: var(--muted); font-size: 12px; }
.metric strong { font-size: 28px; margin: 10px 0 6px; letter-spacing: -.4px; color: var(--ink); }
.metric small { color: var(--faint); font-size: 11px; }
.analytics-range, .order-filters { display: flex; flex-direction: row; flex-wrap: wrap; align-items: end; background: transparent; border: 0; padding: 0 0 16px; gap: 8px; }
.analytics-range label { flex: 0 1 180px; min-width: 0; }
.analytics-range input, .order-filters input, .order-filters select, .module-query input, .module-query select {
  height: 38px; border-radius: 8px; border: 1px solid var(--line);
}
.admin-module { padding: 0; }
.module-table, .admin-order-list table, .module-editor, .card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
}
.module-table th { background: #f7f9f8; color: var(--faint); font-weight: 500; }
.module-editor.is-open { display: block; }
.pricing-workspace, .moments-workspace, .feedback-workspace { background: #fff; border: 1px solid var(--line); border-radius: 14px; }
#status { background: transparent; border: 0; padding: 8px 32px 24px; color: var(--muted); }

@media (max-width: 1250px) {
  #account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: 220px minmax(0, 1fr); }
  #account-panel .workspace-inspector { grid-column: 1 / -1; border-top: 1px solid var(--line); }
  #account-panel .user-workspace, #account-panel .agreement-workspace { grid-template-columns: minmax(0, 1fr); }
  .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .login-gate { grid-template-columns: 1fr; }
  .hero { min-height: 220px; padding: 32px 24px; }
  .hero h2 { font-size: 28px; }
  .workspace-shell { grid-template-columns: 72px 1fr; }
  .rail-label, .workspace-nav button { font-size: 11px; }
  .domains { overflow-x: auto; }
}
@media (max-width: 700px) {
  .workspace-shell { grid-template-columns: 1fr; }
  .rail { max-height: 200px; overflow: auto; }
  .top { height: auto; flex-wrap: wrap; padding: 12px 16px; gap: 12px; }
  .domains { width: 100%; height: 44px; }
  .workspace-identity { margin-left: 0; }
  .workspace-toolbar, #account-panel { padding-left: 16px; padding-right: 16px; }
  #account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: minmax(0, 1fr); }
  .metrics-grid { grid-template-columns: 1fr; }
}
.channel-workspace { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px 28px 32px; }
.channel-workspace h2 { margin: 0 0 8px; font-size: 18px; }
.channel-note { margin: 0 0 16px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.channel-workspace .module-editor label { display: block; margin: 0 0 12px; }
.channel-rates { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; max-width: 760px; margin-bottom: 8px; }
.channel-rates label { display: block; }
.channel-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 16px; }
.channel-actions button, .channel-workspace td button { width: auto; }
.channel-workspace td button + button { margin-left: 8px; }
.channel-workspace td input { min-width: 140px; }
@media (max-width: 800px) {
  .channel-workspace { padding: 16px; }
  .channel-rates { grid-template-columns: 1fr; }
}
.legal-records { grid-column: 1 / -1; min-width: 0; }
.legal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 16px 24px; }
.legal-actions button { flex: 0 0 auto; width: auto; white-space: nowrap; }
.legal-actions input { flex: 1 1 180px; width: auto; min-width: 0; max-width: 320px; }
.legal-records pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.agreement-workspace > .editor-actions, .agreement-workspace > .workspace-message { grid-column: 1 / -1; }
.page-split, .module-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.sheet { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; min-width: 0; }
.sheet .module-query, .sheet .order-filters { padding: 16px 16px 0; }
.drawer, .module-editor {
  display: block !important;
  min-width: 0;
  min-height: 360px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 20px;
}
.module-layout:has(.module-editor.is-open), .page-split:has(.drawer.is-open) { grid-template-columns: minmax(0, 1fr) 320px; }
.admin-module .module-editor:not(.is-open), .page-split > .drawer:not(.is-open) { display: none !important; }
.settings-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px; margin-bottom: 16px; }
.settings-card h3 { margin: 0 0 16px; font-size: 16px; }
.moments-workspace { background: transparent; border: 0; padding: 0; }
@media (max-width: 1050px) {
  .page-split, .module-layout, .module-layout:has(.module-editor.is-open), .page-split:has(.drawer.is-open) { grid-template-columns: minmax(0, 1fr); }
}
.module-editor h3 { font-size: 18px; overflow-wrap: anywhere; }
.module-table { min-width: 0; }
.admin-module .module-state { border: 0; background: none; padding: 8px 0; min-height: 0; }
.module-state:empty { display: none; }
.user-identifier { display: block; color: #737b76; font-size: 11px; overflow-wrap: anywhere; margin: 8px 0 14px; }
#selected-user { overflow-wrap: anywhere; }
.business-details { margin: 0 0 20px; font-size: 13px; line-height: 1.7; }
.business-details dt { color: #6b746e; }
.business-details dd { white-space: pre-wrap; }
.module-editor .structured-field { border: 0; border-top: 1px solid var(--line); padding: 16px 0; }
.module-editor .structured-field label { display: block; }
.content-block, .config-property { padding: 12px 0; border-bottom: 1px solid var(--line); }
.block-toolbar, .config-property-header { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.block-toolbar select, .config-property-header input, .config-property-header select { width: auto; min-width: 0; flex: 1 1 90px; }
.block-toolbar button, .config-property-header button { padding: 6px 10px; flex: none; }
.readable-item { display: grid; gap: 6px; padding: 8px 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.task-timeline { padding-left: 20px; font-size: 13px; }
.task-timeline span { display: block; margin: 4px 0 12px; color: #6b746e; }
@media (max-width: 1050px) { .module-layout:has(.module-editor.is-open) { grid-template-columns: minmax(0, 1fr); } }
@media (min-width: 1101px) {
  .workspace, .workspace-toolbar { margin-left: 0; }
  .workspace-nav { order: 0; width: 100%; height: auto; overflow: visible; border: 0; }
  .workspace-nav button { height: auto; }
}

/* Customer admin layout: a persistent navigation rail and compact work surfaces. */
:root {
  --ink: #242830;
  --muted: #626b76;
  --faint: #82909c;
  --line: #dfe5eb;
  --bg: #eef3f7;
  --panel: #fff;
  --brand: #5969c8;
  --brand-deep: #4453af;
  --brand-soft: #dfe3ff;
  --rail: #fff;
  --rail-mid: #eef0ff;
  --rail-text: #39424e;
  --shadow: none;
}
body, .app { background: #fff; }
button { background: var(--brand); border-color: var(--brand); }
button:hover { background: var(--brand-deep); }
.secondary:hover { background: #f4f5ff; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible { outline-color: #6575d8; }
.top { height: 56px; padding: 0 22px; position: relative; background: #fff; border-bottom: 1px solid var(--line); }
.top .domains, .workspace-space { display: none; }
.logo { min-width: 0; }
.logo .mark { background: var(--brand); }
.logo strong { font-size: 19px; }
.workspace-identity { margin-left: auto; }
.workspace-identity .avatar { background: var(--brand-soft); color: #414fa7; }
.workspace-shell { grid-template-columns: 170px minmax(0, 1fr); min-height: calc(100vh - 56px); }
.rail { background: #fff; color: var(--rail-text); border-right: 1px solid var(--line); padding: 21px 12px; position: sticky; top: 0; align-self: start; height: calc(100vh - 56px); overflow-y: auto; }
.rail-label { font-weight: 650; color: var(--ink); font-size: 13px; padding: 0 12px 18px; }
.workspace-nav { gap: 3px; }
.workspace-nav button { color: var(--rail-text); border-radius: 5px; padding: 10px 12px; font-size: 13px; }
.workspace-nav button:hover { background: #f4f5fb; color: #34429d; }
.workspace-nav button.active { background: var(--brand-soft); color: #34429d; }
.workspace-nav button.active { font-weight: 650; }
.rail-subnav { margin: 2px 0 7px 12px; padding: 3px 0 3px 10px; border-left: 1px solid #d9dee7; display: flex; flex-direction: column; gap: 2px; }
.workspace-nav .sub-item { padding: 8px 10px; font-size: 12px; color: #667078; }
.workspace-nav .sub-item.active { color: #34429d; }
.main-col { background: var(--bg); }
.workspace-toolbar { padding: 23px 28px 0; align-items: center; }
.workspace-toolbar h1 { font-size: 22px; font-weight: 650; margin: 0; }
.workspace-toolbar p:empty { display: none; }
.workspace-toolbar p { margin: 4px 0 0; color: var(--muted); }
#account-panel { padding: 19px 28px 36px; }
#account-panel > .workspace { min-height: 0; }
#status { padding: 0 28px 18px; }
.workspace-tabs { margin: 14px 28px 0; gap: 20px; }
.workspace-tabs button.active { color: #4453af; box-shadow: inset 0 -2px 0 #6575d8; }
.review-workspace, .publication-workspace, .user-workspace, .agreement-workspace, .prompt-workspace,
.sheet, .drawer, .module-editor, .module-table, .card, .settings-card, .pricing-card,
.feedback-list, .overview-card, .agreement-workspace > .workspace-stage, .agreement-workspace > .workspace-inspector {
  border-radius: 5px; border-color: var(--line); box-shadow: none;
}
.workspace-rail, .workspace-inspector, .workspace-stage { min-width: 0; }
.workspace-stage { background: #f8fafb; }
#account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: minmax(225px, 280px) minmax(0, 1fr) minmax(280px, 330px); }
.column-title { margin: 0 0 12px; font-size: 14px; font-weight: 600; }
.q-item, .workspace-rail #community-list button, .workspace-rail #official-list button, .workspace-rail #publication-list button { border-radius: 4px; }
.metrics-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.metric { border-radius: 5px; padding: 14px 16px; }
.metric strong { font-size: 23px; margin: 5px 0 1px; letter-spacing: 0; }
.metric small { line-height: 1.45; }
.overview-split { margin-top: 12px; gap: 12px; }
.analytics-range { gap: 9px; padding-bottom: 12px; }
.analytics-range input, .order-filters input, .order-filters select, .module-query input, .module-query select { height: 36px; border-radius: 4px; }
.dashboard-surface { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 16px 18px 18px; }
.dashboard-surface-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 8px; }
.dashboard-surface-head h2 { margin: 0 0 10px; font-size: 14px; font-weight: 500; }
.dashboard-surface .analytics-range { display: grid; grid-template-columns: 140px 140px 78px; align-items: end; flex: 0 0 auto; margin: 0; padding: 0 0 8px; }
.dashboard-surface .analytics-range label { min-width: 0; }
.dashboard-surface .analytics-range input, .dashboard-surface .analytics-range button { width: 100%; height: 36px; }
.dashboard-surface .workspace-message { min-height: 18px; margin: 0 0 8px; color: var(--muted); font-size: 11px; }
.dashboard-customer-layout { display: grid; grid-template-columns: minmax(270px, 330px) minmax(360px, 1fr); gap: 14px; align-items: stretch; }
.dashboard-customer-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dashboard-customer-metrics .customer-metric { min-height: 78px; padding: 13px 16px; background: #e6e6e6; border: 0; border-radius: 4px; justify-content: center; }
.dashboard-customer-metrics .customer-metric span { color: #30343a; font-size: 13px; }
.dashboard-customer-metrics .customer-metric strong { margin: 4px 0 0; font-size: 17px; font-weight: 700; }
.dashboard-business-panel { min-width: 0; padding: 13px 16px; background: #e2e2e2; border-radius: 4px; }
.dashboard-business-panel h3, .dashboard-detail-title { margin: 0 0 10px; color: #30343a; font-size: 13px; font-weight: 500; }
.dashboard-business-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); min-height: 121px; }
.dashboard-business-metrics .business-metric { padding: 13px 12px; background: transparent; border: 0; border-left: 1px solid rgba(102, 108, 116, .18); border-radius: 0; }
.dashboard-business-metrics .business-metric:first-child { border-left: 0; }
.dashboard-business-metrics .business-metric strong { margin: 6px 0 2px; font-size: 20px; }
.dashboard-business-metrics .business-metric small { color: #747a80; }
.dashboard-detail-title { margin-top: 16px; }
.dashboard-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid #e3e6ea; border-radius: 4px; overflow: hidden; }
.dashboard-detail-grid .metric { padding: 13px 14px; border: 0; border-radius: 0; border-left: 1px solid #e3e6ea; border-top: 1px solid #e3e6ea; }
.dashboard-detail-grid .metric:nth-child(-n+4) { border-top: 0; }
.dashboard-detail-grid .metric:nth-child(4n+1) { border-left: 0; }
.dashboard-detail-grid .metric strong { font-size: 18px; }
.order-page-tab { min-height: 38px; display: flex; align-items: center; padding: 0 14px; background: #e9edf0; border-bottom: 1px solid #dfe4e8; color: #202831; font-size: 13px; font-weight: 600; }
#workspace-orders.page-split { grid-template-columns: minmax(0, 1fr); align-items: start; }
#workspace-orders.page-split:has(.drawer.is-open) { grid-template-columns: minmax(0, 1fr) 340px; }
#workspace-orders .drawer:not(.is-open) { display: none; }
#workspace-orders .sheet { overflow: hidden; background: #fff; }
.order-filters { display: grid; grid-template-columns: minmax(150px, 1.25fr) repeat(3, minmax(105px, .72fr)) minmax(120px, .82fr) minmax(120px, .82fr); gap: 9px; align-items: end; padding: 14px 14px 10px; border-bottom: 1px solid var(--line); background: #fff; }
.order-filters label { min-width: 0; margin: 0; color: #3f4852; font-size: 11px; }
.order-filters input, .order-filters select { width: 100%; min-width: 0; margin-top: 5px; height: 32px; padding: 0 9px; font-size: 12px; }
.order-filter-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; }
.order-filter-actions button, #workspace-orders > .sheet > button { flex: 0 0 auto; width: auto; min-width: 62px; height: 32px; padding: 0 13px; white-space: nowrap; }
#workspace-orders .workspace-message { min-height: 18px; margin: 0; padding: 8px 14px 0; background: #fff; color: var(--muted); font-size: 11px; }
.admin-order-list { overflow-x: auto; padding: 0 14px 14px; background: #fff; }
.admin-order-list table { min-width: 960px; border: 1px solid var(--line); }
.admin-order-list th { height: 34px; padding: 8px 9px; background: #fff; border-bottom: 1px solid var(--line); color: #333d47; font-size: 11px; }
.admin-order-list td { height: 42px; padding: 9px; font-size: 12px; }
.admin-order-list .module-empty { height: 220px; }
#workspace-orders > .sheet > #admin-order-next { margin: 0 14px 14px; }
.page-split, .module-layout { gap: 12px; }
.module-table th { background: #f4f6f8; color: #59636f; }
.pricing-card { padding: 17px 19px; }
.pricing-grid { gap: 12px; }
.pricing-switch input { accent-color: var(--brand); }
.settings-card { padding: 17px 19px; }
.stage-empty, .planned-empty { color: var(--muted); }
.status { border-radius: 4px; }

.feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 750px; }
.feature-tile {
  min-height: 82px; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  background: #f2f3f5; border: 1px solid #e5e8ec; border-radius: 4px; color: var(--ink);
  font-size: 14px; font-weight: 550; text-align: center;
}
.feature-tile:hover { background: #e8ebff; border-color: #bfc7fa; color: #3544a4; }
.feature-tile small { font-size: 11px; color: #64717d; font-weight: 400; }
.planned-tile { background: #f8f9fa; border-style: dashed; }
.feature-home { background: #fff !important; border: 1px solid var(--line); border-radius: 5px; padding: 22px; }
.planned-workspace { max-width: 1100px; }
.planned-notice { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; background: #eef0ff; color: #36439a; border: 1px solid #cfd5ff; border-radius: 5px; padding: 13px 16px; margin-bottom: 14px; }
.planned-notice strong { font-size: 14px; }
.planned-notice span { font-size: 12px; }
.planned-body { display: grid; grid-template-columns: minmax(0, 1fr); }
.planned-panel { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 22px; }
.planned-panel h2 { margin: 0 0 18px; font-size: 16px; }
.planned-field { display: block; margin-bottom: 15px; color: var(--ink); }
.planned-field input, .planned-field textarea { display: block; margin-top: 6px; width: min(100%, 650px); }
.planned-panel :disabled { cursor: not-allowed; opacity: .72; }
.planned-panel button { min-width: 96px; }
.planned-table { width: 100%; border-collapse: collapse; }
.planned-table th { padding: 12px; text-align: left; background: #f4f6f8; border-bottom: 1px solid var(--line); font-weight: 500; font-size: 12px; }
.planned-empty { margin: 0; padding: 56px 12px; text-align: center; border-bottom: 1px solid var(--line); }

@media (max-width: 1250px) {
  #account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: 230px minmax(0, 1fr); }
  .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .workspace-shell { grid-template-columns: 148px minmax(0, 1fr); }
  .rail { height: calc(100vh - 56px); }
  .workspace-toolbar, #account-panel { padding-left: 18px; padding-right: 18px; }
  .workspace-tabs { margin-left: 18px; margin-right: 18px; }
  .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-split, .module-layout, .module-layout:has(.module-editor.is-open) { grid-template-columns: minmax(0, 1fr); }
  .sheet, .module-table { overflow-x: auto; }
  .admin-order-list table, .module-table table { min-width: 650px; }
  .order-filters { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .dashboard-surface-head { align-items: stretch; flex-direction: column; }
  .dashboard-surface .analytics-range { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .dashboard-surface .analytics-range button { grid-column: 1 / -1; width: auto; justify-self: start; padding: 0 16px; }
  .dashboard-customer-layout { grid-template-columns: minmax(0, 1fr); }
  .dashboard-business-metrics, .dashboard-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-business-metrics .business-metric:nth-child(odd) { border-left: 0; }
  .dashboard-business-metrics .business-metric:nth-child(n+3) { border-top: 1px solid rgba(102, 108, 116, .18); }
  .dashboard-detail-grid .metric:nth-child(n) { border-top: 1px solid #e3e6ea; }
  .dashboard-detail-grid .metric:nth-child(-n+2) { border-top: 0; }
  .dashboard-detail-grid .metric:nth-child(odd) { border-left: 0; }
}
@media (max-width: 620px) {
  .top { height: 52px; padding: 0 12px; }
  .workspace-identity { gap: 5px; }
  .workspace-identity .avatar { display: none; }
  .workspace-identity [data-logout] { padding: 6px; }
  .workspace-shell { grid-template-columns: 1fr; }
  .rail { position: static; height: auto; padding: 7px 10px; border-right: 0; border-bottom: 1px solid var(--line); }
  .rail-label { display: none; }
  .workspace-nav { flex-direction: row; flex-wrap: wrap; gap: 3px; }
  .rail-subnav { flex: 1 0 100%; margin: 0 0 3px 8px; padding: 3px 0 3px 8px; border-left: 1px solid #d9dee7; flex-direction: row; overflow-x: auto; }
  .workspace-nav button { flex: 0 0 auto; width: auto; white-space: nowrap; font-size: 12px; padding: 7px 9px; }
  .workspace-toolbar { padding-top: 17px; }
  .workspace-toolbar h1 { font-size: 19px; }
  #account-panel { padding-top: 14px; }
  .feature-home { padding: 13px; }
  .feature-grid { gap: 8px; }
  .feature-tile { min-height: 67px; font-size: 12px; }
  .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric { padding: 11px; }
  .metric strong { font-size: 19px; }
  #account-panel .review-workspace, #account-panel .publication-workspace, #account-panel .prompt-workspace { grid-template-columns: minmax(0, 1fr); }
  .planned-panel { padding: 14px; overflow-x: auto; }
  .planned-table { min-width: 550px; }
  .order-filters { grid-template-columns: repeat(2, minmax(125px, 1fr)); padding: 12px; }
  .order-filter-actions { grid-column: 1 / -1; overflow-x: auto; }
  .admin-order-list { padding: 0 12px 12px; }
  .dashboard-surface { padding: 13px; }
  .dashboard-customer-metrics, .dashboard-business-metrics, .dashboard-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .dashboard-business-metrics .business-metric, .dashboard-business-metrics .business-metric:nth-child(n), .dashboard-detail-grid .metric, .dashboard-detail-grid .metric:nth-child(n) { border-left: 0; border-top: 1px solid #d7d9dc; }
  .dashboard-business-metrics .business-metric:first-child, .dashboard-detail-grid .metric:first-child { border-top: 0; }
}

/* Membership artwork: list -> full personal detail -> recharge/consumption records. */
#account-panel .member-workspace { display: block; background: transparent; border: 0; padding: 0; }
.member-workspace > .member-list-state, .member-workspace > .member-detail-state { min-width: 0; }
.member-workspace > [hidden] { display: none !important; }
.member-list-state #user-search-form { display: grid; grid-template-columns: minmax(170px,1.3fr) repeat(4,minmax(130px,1fr)); gap: 9px 12px; align-items: end; margin: 0 0 10px; padding: 14px; background: #fff; border: 1px solid var(--line); }
.member-list-state #user-search-form label { display: grid; grid-template-rows: 18px 36px; gap: 5px; margin: 0; color: #313742; font-size: 12px; }
.member-list-state #user-search-form input, .member-list-state #user-search-form select { width: 100%; height: 36px; max-width: none; }
.member-filter-actions { grid-column: 1 / -1; display: flex; gap: 9px; align-items: center; }
.member-filter-actions button { width: auto; min-width: 68px; height: 34px; padding: 0 14px; }
.member-filter-actions button:first-child { background: #232323; border-color: #232323; }
.member-list-state .user-table { overflow-x: auto; border-radius: 4px; }
.member-list-state .user-table table { min-width: 1110px; table-layout: auto; }
.member-list-state .user-table th, .member-list-state .user-table td { padding: 11px 12px; white-space: nowrap; font-size: 12px; }
.member-list-state .user-table td:first-child { max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
.member-list-state .user-table button.link { min-width: 50px; padding: 6px 10px; background: #e3e5ff; border-color: #e3e5ff; color: #414b91; }
.member-detail-state { background: #fff; border: 1px solid var(--line); }
.member-detail-state #user-actions { padding: 0; }
.member-detail-title { display: flex; align-items: center; gap: 16px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.member-detail-title h2 { margin: 0; font-size: 16px; }
.member-detail-title button { width: auto; padding: 7px 11px; }
.member-detail-fields { display: grid; grid-template-columns: repeat(4,minmax(130px,1fr)); gap: 14px 18px; margin: 0; padding: 18px 16px; border-bottom: 1px solid var(--line); }
.member-detail-fields > div { min-width: 0; }
.member-detail-fields dt { margin-bottom: 6px; color: #303640; font-size: 12px; }
.member-detail-fields dd { min-height: 36px; margin: 0; padding: 9px 10px; border: 1px solid #e2e6eb; color: #232a33; font-size: 12px; overflow-wrap: anywhere; }
.member-record-filters { display: grid; grid-template-columns: 130px 130px 150px 150px 78px; justify-content: start; gap: 9px 12px; align-items: end; max-width: none; margin: 0; padding: 12px 16px; background: #f4f6f8; }
.member-record-field { display: grid; grid-template-rows: 17px 34px; gap: 4px; min-width: 0; }
.member-record-field label { margin: 0; font-size: 11px; }
.member-record-filters input, .member-record-filters select { width: 100%; height: 34px; max-width: none; }
.member-record-filters select { padding-top: 0; padding-bottom: 0; line-height: normal; }
.member-record-filters button { width: auto; height: 34px; padding: 0 16px; }
.member-record-list { overflow-x: auto; min-height: 270px; }
.member-record-list table { width: 100%; min-width: 680px; border-collapse: collapse; }
.member-record-list th { padding: 12px 16px; background: #fafafa; color: #626b76; font-size: 11px; font-weight: 500; text-align: left; }
.member-record-list td { padding: 14px 16px; border-top: 1px solid #edf0f3; color: #333b45; font-size: 12px; }
.member-record-list .member-record-empty { height: 150px; color: var(--faint); text-align: center; }
#user-record-next { width: auto; margin: 0 16px 14px; }
.member-account-tools { margin: 0 16px 16px; border-top: 1px solid var(--line); }
.member-account-tools summary { padding: 14px 0; color: #59636f; font-size: 12px; cursor: pointer; }
.member-account-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; padding-bottom: 16px; }
.member-account-grid form { display: grid; grid-template-columns: minmax(0,1fr); gap: 7px; margin: 0; }
.member-account-grid button { width: fit-content; }
@media (max-width: 1180px) {
  .member-list-state #user-search-form { grid-template-columns: repeat(3,minmax(150px,1fr)); }
  .member-detail-fields { grid-template-columns: repeat(3,minmax(130px,1fr)); }
}
@media (max-width: 720px) {
  .member-list-state #user-search-form { grid-template-columns: minmax(0,1fr); }
  .member-filter-actions { grid-column: 1; flex-wrap: wrap; }
  .member-detail-fields { grid-template-columns: minmax(0,1fr); }
  .member-record-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .member-record-filters button { grid-column: 1 / -1; }
  .member-account-grid { grid-template-columns: minmax(0,1fr); }
  .member-detail-title { align-items: flex-start; flex-direction: column; gap: 10px; }
}

.status { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; padding: 4px 8px; border-radius: 99px; white-space: nowrap; }
.status:before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.s-wait { color: var(--warn); background: var(--warn-bg); }
.s-ok { color: var(--ok); background: var(--brand-soft); }
.s-run { color: var(--info); background: var(--info-bg); }
.s-fail { color: var(--danger); background: var(--danger-bg); }
.cell-stack { display: flex; flex-direction: column; gap: 4px; }
.cell-stack strong { font-size: 13px; font-weight: 550; color: var(--ink); }
.cell-stack small { color: var(--muted); font-size: 11px; }
button.link { border: 0; background: none; color: var(--brand); padding: 0; font-size: 12px; height: auto; width: auto; }
button.link:hover { background: none; color: var(--brand-deep); }

.module-query { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; max-width: none; margin: 0 0 14px; }
.module-query input { width: 240px; max-width: 240px; flex: 0 1 240px; }
.module-query select { width: auto; min-width: 140px; }
.module-query button { width: auto; white-space: nowrap; }
.module-table { overflow: auto; }
.module-table table, .admin-order-list table { width: 100%; border-collapse: collapse; }
.module-table th, .admin-order-list th { text-align: left; font-size: 11px; color: var(--faint); font-weight: 500; padding: 12px 16px; background: #f7f9f8; }
.module-table td, .admin-order-list td { padding: 14px 16px; border-top: 1px solid #eef2f0; font-size: 13px; vertical-align: middle; white-space: nowrap; }
.module-table tr.selected td, .admin-order-list tr.selected td { background: #f3faf7; }
.module-empty { text-align: center !important; color: var(--faint); height: 120px; }
.module-pagination, .module-next { margin: 8px 0 0; }
.page-tabs { margin: 0 0 14px; }
.module-editor { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px; }
.module-editor h3 { margin: 0 0 16px; font-size: 16px; }
.customer-service-workspace .module-query input,
.customer-service-workspace .module-query select { display: none; }
.customer-service-workspace .module-layout:has(.module-editor.is-open) { grid-template-columns: minmax(0, 1fr); }
.customer-service-workspace .module-table { display: none; }
.channel-workspace .module-layout,
.channel-workspace .module-layout:has(.module-editor.is-open) { grid-template-columns: minmax(0, 1fr); }
#workspace-channel-list.channel-workspace { background: transparent; border: 0; padding: 0; }
.ch-view { display: flex; flex-direction: column; gap: 14px; }
.ch-notice { min-height: 0; margin: 0 0 8px; color: #b05757; }
.ch-notice:empty { display: none; }
.ch-stats { display: grid; grid-template-columns: 180px 180px 180px minmax(0, 1fr); gap: 14px; align-items: stretch; }
.ch-stats-plain { grid-template-columns: repeat(4, minmax(120px, 180px)); }
.ch-stat { background: #fff; border: 1px solid #e6e8ee; border-radius: 8px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.ch-stat span { color: #626b76; font-size: 13px; }
.ch-stat strong { font-size: 22px; font-weight: 650; }
#workspace-channel-list .ch-primary,
#workspace-channel-list .ch-gray { width: auto; height: 36px; border-radius: 8px; padding: 0 16px; }
#workspace-channel-list .ch-primary { justify-self: end; align-self: center; background: #e7e9ff; border-color: #e7e9ff; color: #3d4cb8; }
.ch-primary:hover { background: #d9defc; }
.ch-gray { background: #eceef2; border-color: #eceef2; color: #3a414b; }
.ch-gray:hover { background: #e2e5ea; }
.ch-mini { height: 30px; padding: 0 12px; }
.ch-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #626b76; font-size: 13px; }
.ch-filter-label { color: #242830; font-weight: 650; margin-right: 6px; }
#workspace-channel-list .ch-filters select,
#workspace-channel-list .ch-filters input,
#workspace-channel-list .ch-field input,
#workspace-channel-list .ch-field select,
#workspace-channel-list .ch-split input,
#workspace-channel-list .ch-basic input { height: 34px; border: 1px solid #e1e4ea; border-radius: 6px; background: #fff; padding: 0 10px; }
#workspace-channel-list .ch-filters select { width: 110px; }
#workspace-channel-list .ch-filters input { width: 140px; }
#workspace-channel-list .ch-field input,
#workspace-channel-list .ch-field select,
#workspace-channel-list .ch-split input,
#workspace-channel-list .ch-basic input { width: 100%; }
.ch-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid #e6e8ee; border-radius: 8px; overflow: hidden; }
.ch-table th, .ch-table td { padding: 12px 14px; border-bottom: 1px solid #eef0f3; text-align: left; font-size: 13px; white-space: nowrap; }
.ch-table th { background: #f6f7f9; color: #7b8490; font-weight: 600; }
.ch-ops { display: flex; gap: 8px; }
.ch-empty { text-align: center; color: #82909c; }
.ch-form { width: min(420px, 100%); margin: 8px auto 24px; display: flex; flex-direction: column; gap: 12px; }
.ch-form h2, .ch-detail-head h2, .ch-basic h3 { margin: 0; font-size: 18px; }
.ch-field { display: grid; gap: 6px; color: #3a414b; font-size: 13px; }
.ch-upload-label { font-size: 13px; color: #3a414b; }
.ch-plus { width: 54px; height: 54px; border-radius: 6px; background: #fff; border: 1px solid #e1e4ea; color: #98a1ab; font-size: 22px; }
.ch-plus-row, .ch-split, .ch-form-actions, .ch-detail-head { display: flex; gap: 10px; align-items: center; }
.ch-split input { flex: 1; }
.ch-form-actions { justify-content: flex-end; margin-top: 8px; }
.ch-basic { background: #f7f8fa; border-radius: 8px; padding: 16px; }
.ch-basic-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.ch-detail-head { justify-content: space-between; }
@media (max-width: 900px) {
  .ch-stats, .ch-stats-plain, .ch-basic-grid { grid-template-columns: 1fr 1fr; }
  .ch-form { width: 100%; }
}
.qr-upload { margin: 8px 0 20px; padding: 16px; border: 1px dashed #0bcfc8; border-radius: 12px; background: #f3fbfb; }
.qr-upload legend { padding: 0 6px; font-size: 14px; font-weight: 600; }
.qr-upload img { display: block; margin: 0 0 12px; object-fit: contain; background: #fff; border: 1px solid #e6eeec; }
.qr-upload input[type="file"] { display: block; margin: 8px 0; }
.qr-upload p { margin: 8px 0 0; color: #5b6164; font-size: 13px; }
.editor-error { margin: 0 0 16px; padding: 10px 12px; border-radius: 8px; background: #fde8e8; color: #a40000; font-size: 14px; }
.drawer { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px; }
.kv { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; font-size: 13px; border-bottom: 1px solid #f1f4f2; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }

.user-directory { padding: 0; background: transparent; }
.user-directory form { display: grid; grid-template-columns: 1fr 180px auto; align-items: end; gap: 8px 12px; margin: 0 0 14px; padding: 16px 16px 0; }
.user-directory form label { font-size: 12px; grid-row: 1; }
.user-directory form input, .user-directory form select, .user-directory form button { grid-row: 2; height: 38px; width: auto; max-width: none; }
.user-directory form button { width: auto; }
.user-table { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.user-table table { width: 100%; border-collapse: collapse; }
.user-table th { text-align: left; font-size: 11px; color: var(--faint); font-weight: 500; padding: 12px 16px; background: #f7f9f8; }
.user-table td { padding: 14px 16px; border-top: 1px solid #eef2f0; font-size: 13px; vertical-align: middle; }
.user-table tr.selected td { background: #f3faf7; }
.user-workspace > .workspace-inspector { border: 1px solid var(--line); border-radius: 12px; margin-left: 16px; }
.user-card { display: none; }

.workspace-rail form { display: flex; flex-direction: column; gap: 8px; }
.workspace-rail #community-list, .workspace-rail #publication-list, .workspace-rail #official-list { display: flex; flex-direction: column; gap: 6px; }
.workspace-rail #community-list button, .workspace-rail #publication-list button, .workspace-rail #official-list button {
  width: calc(100% - 4px); margin: 0; border: 1px solid transparent; background: none; color: inherit;
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px; text-align: left; padding: 10px; border-radius: 10px;
}
.workspace-rail #community-list button:hover, .workspace-rail #publication-list button:hover, .workspace-rail #official-list button:hover,
.workspace-rail #community-list button:focus, .workspace-rail #publication-list button:focus { background: var(--brand-soft); border-color: #cfe6de; }
.queue-item-title { font-size: 13px; font-weight: 550; color: var(--ink); }
.queue-item-meta { color: var(--muted); font-size: 11px; }
.workspace-inspector #community-title { margin: 8px 0 6px; font-size: 18px; }
.workspace-inspector #community-consent { background: var(--brand-soft); color: #3d6b5d; padding: 10px 12px; border-radius: 8px; }
#community-review { display: grid; gap: 10px; }
#community-review-submit { width: 100%; }
.review-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
button.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
button.danger:hover { background: #934848; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.status-kicker { margin: 0 0 6px; color: var(--warn); font-size: 12px; font-weight: 600; }
#community-action { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
#community-prompt.copy { background: var(--brand-soft); color: #3d6b5d; padding: 10px 12px; border-radius: 8px; white-space: pre-wrap; font: inherit; margin: 0 0 12px; }
.workspace-rail form { display: flex; flex-direction: column; gap: 8px; padding: 0 8px 12px; }
.workspace-rail form label { font-size: 11px; color: var(--muted); margin: 0; }
.workspace-rail form input, .workspace-rail form select { height: 38px; }
.workspace-rail form button { width: 100%; }
.agreement-workspace > .workspace-stage, .agreement-workspace > .workspace-inspector {
  background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px; min-height: 420px;
}
.feedback-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; background: transparent; border: 0; padding: 0; }
.feedback-list { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; grid-column: 1; }
.feedback-workspace .module-query { grid-column: 1 / -1; }
.feedback-workspace .workspace-message { grid-column: 1 / -1; margin: 0; }
.feedback-workspace .module-editor { grid-column: 2; grid-row: 3 / span 3; }
@media (max-width: 1050px) { .feedback-workspace { grid-template-columns: 1fr; } .feedback-workspace .module-editor { grid-column: 1; grid-row: auto; } }

.pricing-workspace { padding: 0; background: transparent; border: 0; }
.pricing-workspace .notice { border-radius: 10px; margin-bottom: 16px; }
.pricing-workspace form { display: block; gap: 0; max-width: none; }
#pricing-fields.pricing-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 980px; border: 1px solid var(--line); background: #fff; }
.pricing-card { background: #fff; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0; display: grid; grid-template-columns: 220px 130px minmax(0, 1fr); align-items: stretch; }
.pricing-card:last-child { border-bottom: 0; }
.pricing-card-h { display: contents; }
.pricing-card-h > div { padding: 15px 18px; background: #f4f6f8; }
.pricing-card-h strong { display: block; font-size: 16px; font-weight: 650; }
.pricing-card-h small { display: block; margin-top: 4px; color: var(--faint); font-size: 11px; }
.pricing-switch { display: none; }
.pricing-switch input { width: 18px; height: 18px; }
.pricing-points { grid-column: 2 / 4; display: flex; gap: 10px; padding: 10px 14px; align-items: center; }
.pricing-points label { flex: 1; display: flex; flex-direction: column; gap: 6px; font-size: 11px; color: var(--muted); margin: 0; }
.pricing-points input { height: 38px; font-size: 15px; font-weight: 500; letter-spacing: 0; padding: 0 10px; }
#pricing-version { margin: 16px 0 10px; color: var(--muted); }
.pricing-workspace > button, .pricing-workspace form > button { width: auto; }
@media (max-width: 900px) { .pricing-grid { grid-template-columns: 1fr; } }
.feedback-item { text-align: left; border-radius: 10px; }
.pager { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; color: var(--muted); font-size: 12px; }
.overview-split { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .9fr); gap: 16px; margin-top: 18px; }
.overview-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.card-h { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.card-h h2 { margin: 0; font-size: 14px; }
.overview-body.empty { padding: 36px 16px; text-align: center; color: var(--faint); font-size: 13px; }
.overview-row { width: 100%; border: 0; border-bottom: 1px solid #f1f4f2; border-radius: 0; background: #fff; color: inherit; display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 14px 18px; text-align: left; }
.overview-row:hover { background: #f7fafa; }
.overview-row:last-child { border-bottom: 0; }
@media (max-width: 1100px) { .overview-split { grid-template-columns: 1fr; } }

/* The customer artwork uses a compact three-column launcher and flat data sheets. */
.feature-home { padding: 18px; }
.feature-grid { max-width: 660px; gap: 12px 28px; }
.home-section-title { margin: 0 0 13px; font-size: 14px; font-weight: 600; }
.home-section-title:not(:first-child) { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
.feature-grid-secondary .feature-tile { background: #f4f5f7; }
.feature-tile { min-height: 62px; font-weight: 400; background: #e6e7e9; border-color: #e6e7e9; }
.feature-tile:focus-visible { background: var(--brand-soft); }
.planned-tile { background: #f7f8fa; border: 1px dashed #d2d8e4; }
.user-table, .user-workspace > .workspace-inspector,
.module-table, .module-editor, .drawer, .pricing-card, .overview-card { border-radius: 4px; }
.user-table th, .module-table th, .admin-order-list th { background: #f4f6f8; color: #59636f; }
.user-table tr.selected td, .module-table tr.selected td, .admin-order-list tr.selected td { background: #eef0ff; }
.workspace-rail #community-list button, .workspace-rail #official-list button,
.workspace-rail #publication-list button { border-radius: 4px; }
.workspace-rail #community-list button:hover, .workspace-rail #publication-list button:hover,
.workspace-rail #official-list button:hover { background: #eef0ff; border-color: #d5daff; }
.workspace-inspector #community-consent, #community-prompt.copy { background: #eef0ff; color: #3947a0; border-radius: 4px; }
#account-panel > #workspace-moments, #account-panel > #workspace-copywriting, #account-panel > #workspace-ad-analysis { width: min(980px, 100%); max-width: 980px; justify-self: start; }
.moments-workspace { background: transparent; border: 0; padding: 0; }
.moments-prompt-form { margin: 0; max-width: none; gap: 0; }
.moments-prompt-panel { background: #fff; border: 1px solid var(--line); border-radius: 5px; padding: 26px 28px 32px; }
.moments-prompt-panel h2 { margin: 0 0 22px; font-size: 16px; font-weight: 650; color: var(--ink); }
.moments-prompt-block { display: grid; justify-items: start; gap: 10px; margin: 0 0 20px; min-width: 0; }
.moments-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 132px; height: 34px; margin: 0; padding: 0 18px; border-radius: 999px; font-size: 13px; font-weight: 550; line-height: 34px; }
.moments-pill-on { background: #d8dcf8; color: #3b47a0; }
.moments-pill-off { background: #d8dadd; color: #4a5058; }
.moments-prompt-block textarea { width: 100%; min-height: 88px; margin: 0; border: 0; border-radius: 4px; background: #ececed; padding: 14px 16px; resize: vertical; }
.copywriting-prompt-panel textarea { display: block; width: 100%; min-height: 220px; margin: 0 0 22px; border: 0; border-radius: 4px; background: #ececed; padding: 14px 16px; resize: vertical; }
.ad-analysis-platform-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.ad-analysis-platform-tabs button { width: auto; min-width: 88px; height: 34px; margin: 0; padding: 0 16px; border-radius: 999px; border: 1px solid #c5c9d0; background: #fff; color: #3a4048; font-size: 13px; }
.ad-analysis-platform-tabs button.active { background: #d8dcf8; color: #3b47a0; border-color: #c5cae8; }
.moments-submit { display: block; width: auto; min-width: 118px; height: 40px; margin: 8px auto 0; padding: 0 28px; border-radius: 999px; background: #fff; color: #242830; border: 1px solid #7c838c; font-size: 14px; }
.moments-submit:hover { background: #f7f8fa; filter: none; }
.moments-notice { min-height: 18px; margin: 10px 4px 0; color: var(--muted); }
.settings-field { min-width: 0; }
.settings-field label { display: block; margin-bottom: 6px; }
.settings-field input, .settings-field textarea { width: 100%; }
.copywriting-prompts-card { display: grid; gap: 12px; }
.copywriting-prompts-card h3 { margin-bottom: 2px; }
.copywriting-labels-card { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; }
.copywriting-labels-card h3 { grid-column: 1 / -1; margin-bottom: 2px; }
.settings-actions { display: flex; justify-content: flex-end; gap: 10px; }
.settings-actions button { width: auto; min-width: 108px; }
.copywriting-pricing-row { width: min(980px, 100%); max-width: 980px; margin: 0; padding: 0; display: grid !important; grid-template-columns: 220px minmax(0, 1fr) auto auto; align-items: end; gap: 10px; border: 1px solid var(--line); border-top: 0; background: #fff; }
.pricing-workspace .copywriting-pricing-row { gap: 10px; }
.copywriting-pricing-row h2 { align-self: stretch; margin: 0; padding: 16px 18px; background: #f4f6f8; font-size: 16px; }
.copywriting-pricing-row label { margin: 0; padding: 10px 4px; font-size: 11px; color: var(--muted); }
.copywriting-pricing-row label input { display: block; width: 100%; height: 38px; margin-top: 6px; font-size: 15px; }
.copywriting-pricing-row button { width: auto; margin-bottom: 10px; white-space: nowrap; }
.copywriting-pricing-notice { grid-column: 2 / -1; min-height: 18px; margin: 0 12px 10px 4px; color: var(--muted); font-size: 12px; }
.moments-price-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; min-width: 0; padding: 0 4px; }
.moments-price-fields label { padding-left: 0; padding-right: 0; }

/* Customer prompt pages use distinct list and edit states. */
#account-panel .prompt-workspace { display: block; width: min(100%, 980px); max-width: 980px; min-width: 0; padding: 0; border: 1px solid var(--line); border-radius: 5px; background: #fff; }
.prompt-workspace:has(#official-editor:not([hidden])) { width: min(100%, 980px) !important; max-width: 980px !important; }
.prompt-workspace > summary { display: none; }
#official-list-view, #official-editor { min-height: 560px; padding: 28px 32px 32px; background: #fff; }
#official-list-heading, #official-editor-heading { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.4; font-weight: 650; letter-spacing: 0; }
#official-search-form { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin: 22px 0 18px; max-width: none; }
#official-search-form label { margin: 0; font-size: 14px; color: #252a30; }
#official-search-form select { width: 220px; flex: 0 0 220px; min-width: 0; height: 36px; margin: 0; border: 0; border-radius: 4px; background: #ececed; }
#official-search-form button { width: auto; flex: 0 0 auto; height: 36px; margin: 0; padding: 0 22px; border-radius: 18px; }
#official-all { min-width: 72px; border: 0; background: #ececed; color: #22272d; }
#official-all.is-active { box-shadow: none; background: #ececed; }
#official-new { min-width: 108px; border: 0; background: #d8dcf8; color: #3b47a0; }
#official-list { display: grid; gap: 14px; }
.official-prompt-row { min-height: 132px; display: grid; grid-template-columns: 72px minmax(0, 1fr) 48px; align-items: start; gap: 16px; padding: 16px 18px; background: #ececed; border: 0; border-radius: 4px; }
.official-prompt-example { width: 64px; height: 80px; display: grid; place-items: center; overflow: hidden; background: #fff; color: #30353b; font-size: 13px; }
.official-prompt-example img { width: 100%; height: 100%; object-fit: cover; }
.official-prompt-copy { min-width: 0; padding-top: 4px; }
.official-prompt-copy p { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 0; margin: 0 0 10px; color: #2c3137; font-size: 14px; line-height: 1.55; }
.official-prompt-copy p:last-child { margin-bottom: 0; }
.official-prompt-copy strong { font-weight: 500; }
.official-prompt-copy span { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.official-prompt-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; padding-top: 4px; }
.official-prompt-actions button { width: auto; min-width: 0; height: auto; padding: 0; border: 0; background: transparent; color: #2c3137; font-size: 13px; }
.official-prompt-actions .danger-link { color: #2c3137; }
#official-next { width: auto; margin: 18px auto 0; display: block; }
.official-editor-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
#official-editor-back { width: auto; min-width: 0; margin: 0; padding: 0; border: 0; background: transparent; color: #5d6470; font-size: 13px; }
#official-version { display: none; }
#official-template-fields { display: grid; gap: 8px; }
.official-section-label { margin: 0 0 8px; font-size: 14px; color: #252a30; }
.official-category-row { display: grid; grid-template-columns: auto minmax(160px, 220px) auto 34px; align-items: center; justify-content: start; gap: 10px; margin: 0 0 10px; }
.official-category-row label { margin: 0; color: #252a30; font-size: 14px; }
.official-category-row select { width: 100%; height: 36px; margin: 0; border: 0; border-radius: 4px; background: #ececed; }
.official-category-row #official-add-category { width: auto; min-width: 88px; height: 36px; padding: 0 14px; border: 0; border-radius: 4px; background: #ececed; color: #252a30; }
.official-category-row .icon-button { width: 34px; min-width: 34px; height: 34px; padding: 0; border: 0; border-radius: 4px; background: #ececed; color: #262b31; font-size: 20px; }
.official-example-stack { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.official-example-refs { display: flex; gap: 16px; }
.official-example-slot { display: flex; flex-direction: column; gap: 6px; color: #5c656e; font-size: 12px; }
.official-example-picker { min-height: 64px; display: flex; align-items: center; gap: 12px; margin-bottom: 0; }
.official-example-upload { width: 64px; height: 64px; display: grid; place-items: center; overflow: hidden; margin: 0; cursor: pointer; background: #ececed; color: #30353b; font-size: 22px; border-radius: 4px; }
.official-example-upload img { width: 100%; height: 100%; object-fit: cover; }
#official-example-remove, #official-example-play, #official-video-remove { width: auto; padding: 0; border: 0; background: transparent; }
#official-example-player { width: 240px; max-width: 100%; background: #111; border-radius: 4px; }
#official-example-message { margin: 0; color: #777f89; font-size: 12px; }
#official-editor > #official-template-fields > label { margin: 8px 0 0; color: #252a30; font-size: 14px; }
#official-editor > #official-template-fields > input,
#official-editor > #official-template-fields > textarea { width: 100%; margin: 6px 0 4px; border: 0; border-radius: 4px; background: #ececed; box-shadow: none; }
#official-title { height: 44px; }
#official-guidance { min-height: 72px; resize: vertical; }
#official-content { min-height: 96px; resize: vertical; }
#official-durations { display: flex; align-items: center; gap: 18px; margin: 8px 0 0; padding: 10px 12px; border: 1px solid #e2e5e8; }
#official-durations legend { padding: 0 6px; }
#official-durations label { display: flex; align-items: center; gap: 6px; margin: 0; }
.official-publish-settings { margin-top: 16px; border: 0; background: transparent; }
.official-publish-settings summary { padding: 0; cursor: pointer; color: #5d6470; font-size: 12px; }
.official-publish-settings > div { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(160px, 1fr) auto; align-items: end; gap: 12px 16px; padding: 10px 0 0; }
.official-publish-settings > div > label { display: grid; gap: 6px; margin: 0; min-width: 0; color: #252a30; font-size: 13px; }
.official-publish-settings input, .official-publish-settings select { width: 100%; height: 36px; margin: 0; }
.official-publish-settings .checkbox-label { display: flex; flex-direction: row; align-items: center; gap: 8px; height: 36px; margin: 0; white-space: nowrap; }
#official-submit { display: block; width: auto; min-width: 118px; height: 40px; margin: 28px auto 0; padding: 0 28px; border: 1px solid #7c838c; border-radius: 999px; background: #fff; color: #242830; font-size: 14px; }
#official-submit:hover { background: #f7f8fa; filter: none; }
.official-category-panel { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; padding: 24px; background: rgb(17 24 39 / 36%); }
.official-category-dialog { width: min(520px, 100%); max-height: min(720px, calc(100vh - 48px)); overflow: auto; padding: 24px; background: #fff; border-radius: 4px; box-shadow: 0 22px 60px rgb(15 23 42 / 18%); }
.official-category-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.official-category-head h2 { margin: 0; font-size: 20px; }
.official-category-head button { width: auto; }
#official-category-list { display: grid; gap: 8px; margin-bottom: 18px; }
.official-category-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: 10px; padding: 10px 12px; background: #f4f5f6; }
.official-category-item small { color: #727a85; }
.official-category-item button { width: auto; padding: 0; border: 0; background: transparent; }
#official-category-form { display: grid; grid-template-columns: minmax(0, 1.5fr) 110px 130px; gap: 10px 12px; align-items: end; }
#official-category-form > input[type="hidden"] { display: none; }
#official-category-form > label { display: grid; gap: 6px; margin: 0; min-width: 0; font-size: 12px; color: #252a30; }
#official-category-form input, #official-category-form select { width: 100%; height: 36px; margin: 0; }
.official-category-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 10px; }
.official-category-actions button { width: auto; }

/* Academy and tutorial lists follow the customer's poster/video card layout. */
.content-card-workspace .module-query { justify-content: flex-end; }
.content-card-workspace .module-query > button[type="submit"] { display: none; }
.content-card-workspace .module-table { border: 0; background: transparent; }
.content-card-workspace .module-table thead { display: none; }
.content-card-workspace .module-table tbody { display: grid; gap: 14px; }
.content-card-workspace .module-table tr { min-height: 132px; display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; align-items: center; gap: 18px; padding: 16px; background: #f1f2f3; border: 1px solid #e6e8eb; }
.content-card-workspace .module-table tr:before { content: "示例"; width: 76px; height: 92px; display: grid; place-items: center; background: #fff; color: var(--muted); }
.content-card-tutorials .module-table tr:before { content: "视频教程"; }
.content-card-workspace .module-table td { border: 0; padding: 4px 0; white-space: normal; }
.content-card-workspace .module-table td:nth-child(n+2):nth-child(-n+5) { display: none; }
.content-card-workspace .module-table td:first-of-type { font-weight: 600; }
.content-card-workspace .module-table td:last-child { grid-column: 3; }
.content-card-workspace .module-empty { display: block !important; height: auto; text-align: left !important; }
.planned-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
.planned-summary > div { min-height: 70px; padding: 10px 12px; background: #f4f6f8; font-size: 12px; }
.planned-summary strong { display: block; font-size: 18px; margin-top: 6px; }
.planned-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 15px; }
.planned-filters label { flex: 1 1 110px; font-size: 12px; }
.planned-filters input { width: 100%; height: 36px; margin-top: 5px; }
.planned-uploads { display: flex; gap: 10px; margin-bottom: 18px; }
.planned-uploads button { width: 96px; height: 96px; font-size: 24px; background: #f4f6f8; }
.planned-hierarchy { min-height: 360px; display: flex; align-items: center; justify-content: center; gap: 42px; padding: 28px; }
.hierarchy-city { min-width: 145px; padding: 22px 18px; border-radius: 9px; background: #c9634b; color: #fff; text-align: center; font-size: 24px; font-weight: 650; }
.hierarchy-branches { display: grid; gap: 18px; }
.hierarchy-branch { display: flex; align-items: center; gap: 20px; position: relative; }
.hierarchy-branch:after { content: ""; width: 38px; height: 1px; background: #9eaaa5; order: 2; }
.hierarchy-branch strong { min-width: 92px; padding: 12px 10px; background: #dce7d8; border-radius: 7px; text-align: center; font-weight: 500; order: 1; }
.hierarchy-users { display: grid; gap: 7px; order: 0; }
.hierarchy-users span { min-width: 66px; padding: 7px 10px; border: 1px solid #cfd9cb; border-radius: 5px; background: #fff; }
.dashboard-primary-metrics { margin-bottom: 14px; }
.dashboard-primary-metrics .metric { min-height: 112px; }
.dashboard-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; border: 1px solid var(--line); margin-bottom: 14px; }
.dashboard-detail-grid .metric { min-height: 76px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; padding: 12px 14px; }
.dashboard-detail-grid .metric:nth-child(4n) { border-right: 0; }
.dashboard-detail-grid .metric:nth-last-child(-n+4) { border-bottom: 0; }
.dashboard-detail-grid .metric strong { font-size: 18px; }
.dashboard-detail-grid .metric small { display: none; }
@media (max-width: 1250px) {
  #account-panel .prompt-workspace { width: 100%; }
  #official-list-view, #official-editor { padding: 28px 30px 24px; }
  .dashboard-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-detail-grid .metric:nth-child(4n) { border-right: 1px solid var(--line); }
  .dashboard-detail-grid .metric:nth-child(2n) { border-right: 0; }
  .dashboard-detail-grid .metric:nth-last-child(-n+4) { border-bottom: 1px solid var(--line); }
  .dashboard-detail-grid .metric:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 620px) {
  .feature-grid { gap: 8px; }
  .feature-tile { min-height: 63px; }
  .planned-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .planned-hierarchy { justify-content: flex-start; min-width: 540px; }
  .pricing-card { grid-template-columns: minmax(0, 1fr); }
  .pricing-card-h > div { background: #f4f6f8; }
  .pricing-points { grid-column: 1; display: grid; grid-template-columns: minmax(0, 1fr); padding: 12px; }
  #account-panel .prompt-workspace { border-width: 1px; }
  #official-list-view, #official-editor { min-height: 0; padding: 20px 16px; }
  #official-list-heading, #official-editor-heading { font-size: 16px; }
  #official-search-form { gap: 9px; }
  #official-search-form label { display: none; }
  #official-search-form select { width: min(220px, 100%); flex: 1 1 160px; }
  .official-prompt-row { min-height: 0; grid-template-columns: 54px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .official-prompt-actions { grid-column: 2; flex-direction: row; justify-content: flex-end; }
  .official-prompt-copy p { grid-template-columns: minmax(0, 1fr); gap: 0; margin-bottom: 9px; }
  .official-category-row { grid-template-columns: auto minmax(0, 1fr); }
  .official-category-row #official-add-category, .official-category-row .icon-button { justify-self: start; }
  .official-publish-settings > div { grid-template-columns: minmax(0, 1fr); }
  #official-category-form { grid-template-columns: minmax(0, 1fr); }
  .official-category-actions { grid-column: 1; }
  .official-category-item { grid-template-columns: minmax(0, 1fr) auto; }
  .official-category-item small { grid-column: 1; }
  .content-card-workspace .module-table tr { grid-template-columns: 72px minmax(0, 1fr); }
  .content-card-workspace .module-table tr:before { width: 64px; height: 78px; }
  .content-card-workspace .module-table td:last-child { grid-column: 2; }
  .dashboard-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .copywriting-labels-card { grid-template-columns: minmax(0, 1fr); }
  .copywriting-pricing-row { grid-template-columns: minmax(0, 1fr); padding-bottom: 12px; }
  .copywriting-pricing-row h2 { background: #f4f6f8; }
  .copywriting-pricing-row label, .copywriting-pricing-row button, .copywriting-pricing-notice { margin-left: 12px; margin-right: 12px; }
  .copywriting-pricing-notice { grid-column: 1; }
}
.carousel-board { display: grid; gap: 14px; max-width: 980px; min-width: 0; }
.carousel-lead { margin: 0; color: #5c656c; font-size: 13px; line-height: 1.6; }
.carousel-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.carousel-slot { min-width: 0; display: grid; gap: 8px; padding: 12px; background: #f4f6f8; border: 1px solid #e1e4e8; border-radius: 8px; }
.carousel-slot h2 { margin: 0; font-size: 14px; }
.carousel-preview { height: 220px; display: grid; place-items: center; overflow: hidden; background: #111; color: #fff; border-radius: 6px; }
.carousel-preview img { width: 100%; height: 100%; object-fit: cover; }
.carousel-meta, .carousel-chosen { margin: 0; color: #5c656c; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.carousel-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.carousel-actions button, .carousel-pick { width: auto; }
.carousel-save { width: auto; justify-self: start; }
@media (max-width: 860px) {
  .carousel-slots { grid-template-columns: minmax(0, 1fr); }
}