:root {
  color-scheme: light;
  --canvas: #f5f0f5;
  --paper: #fffdfb;
  --ink: #292031;
  --muted: #66596f;
  --muted-strong: #4d4157;
  --line: #e4dae8;
  --soft-line: #f0e8f0;
  --accent: #6a4b83;
  --accent-deep: #503467;
  --accent-wash: #f0e7f6;
  --gold: #936431;
  --gold-light: #e9ca8f;
  --rail: #251a30;
  --rail-muted: #c9bad4;
  --success: #2e6b52;
  --douyin: #1d846e;
  --xiaohongshu: #d16d84;
  --legacy: #9ca9a3;
  --danger: #a73837;
  --radius: 12px;
  --sidebar-width: 228px;
  --shadow: 0 1px 2px #301d3c0a, 0 5px 16px #301d3c06;
  --heading-font: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, Georgia, serif;
  --stars: radial-gradient(circle at 12% 32%, #efd6a66b 0 1px, transparent 2px),
    radial-gradient(circle at 23% 79%, #efd6a64d 0 1px, transparent 2px),
    radial-gradient(circle at 45% 24%, #efd6a64d 0 1px, transparent 2px),
    radial-gradient(circle at 62% 68%, #efd6a670 0 1.25px, transparent 2.5px),
    radial-gradient(circle at 86% 17%, #efd6a670 0 1.25px, transparent 2.5px),
    radial-gradient(circle at 93% 78%, #efd6a65a 0 1px, transparent 2px);
  font-family: 'Segoe UI', 'Microsoft YaHei UI', 'PingFang SC', system-ui, sans-serif;
  font-size: 14px;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; background: var(--canvas); color: var(--ink); line-height: 1.55; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .62; }
a { color: var(--accent-deep); }
h1, h2, h3, p { margin: 0; }
h2 { font-size: 17px; letter-spacing: -.015em; line-height: 1.35; font-weight: 700; }
h3 { font-size: 15px; }
:focus-visible { outline: 2px solid #8762a3; outline-offset: 3px; }
::selection { background: #e8d6f2; color: #36213d; }

.icon-library { width: 0; height: 0; position: absolute; overflow: hidden; pointer-events: none; }
.icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
}
.muted { color: var(--muted); }
.positive { color: var(--success); }
.negative { color: var(--danger); }
.eyebrow { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: .12em; }

.app-shell {
  --shell-gap: 14px;
  --canvas: #f2eff8;
  --paper: #fefcfe;
  --ink: #211a34;
  --muted: #625b73;
  --muted-strong: #49415d;
  --line: #ded7ea;
  --soft-line: #ebe5f2;
  --accent: #6851aa;
  --accent-deep: #4e3684;
  --accent-wash: #efe9fa;
  --radius: 18px;
  --glass-line: rgba(255, 255, 255, .92);
  --glass-card: linear-gradient(155deg, #fff 0%, #fffc 64%, #f9f5ffdb);
  --glass-shadow: 0 0 0 1px #6e588414, 0 8px 24px #4936660d, inset 0 1px 0 #fff;
  --heading-font: -apple-system, BlinkMacSystemFont, 'Segoe UI Variable', 'Segoe UI', 'PingFang SC', 'Microsoft YaHei UI', 'Noto Sans CJK SC', system-ui, sans-serif;
  min-height: 100vh;
  padding: var(--shell-gap);
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  gap: var(--shell-gap);
  color: var(--ink);
  background: radial-gradient(ellipse 52rem 40rem at 96% 0%, #f9e4bc 0%, transparent 74%),
    radial-gradient(ellipse 42rem 34rem at 0% 13%, #e0eaf9 0%, transparent 76%),
    radial-gradient(ellipse 55rem 48rem at 60% 22%, #e9dffa 0%, transparent 80%),
    linear-gradient(150deg, #eff2fb, #f3edf6 60%, #f1edf9);
  font-family: var(--heading-font);
}
.sidebar {
  position: sticky;
  top: var(--shell-gap);
  height: calc(100dvh - 2 * var(--shell-gap));
  z-index: 4;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: linear-gradient(155deg, #f9fbfff2, #f8f4fcee 78%, #f1ebf8f2);
  border: 1px solid var(--glass-line);
  border-radius: 23px;
  box-shadow: var(--glass-shadow);
  color: var(--ink);
  padding: 19px 12px 11px;
  overflow-y: auto;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px; }
.brand-mark {
  width: 39px;
  height: 39px;
  border: 1px solid #8e75c4;
  border-radius: 13px;
  background: radial-gradient(circle at 28% 12%, #a18bd7, transparent 64%), linear-gradient(155deg, #795dbb, #5f4596);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: #fff5df;
  box-shadow: inset 0 1px 1px #ffffff9e, 0 5px 12px #52367e38;
}
.brand-mark .icon { width: 23px; height: 23px; stroke-width: 1.3; }
.brand strong { display: block; font: 750 17px/1.25 var(--heading-font); letter-spacing: .005em; }
.brand small { display: block; color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: .13em; margin-top: 4px; white-space: nowrap; }
.navigation { margin-top: 23px; padding-top: 17px; display: grid; gap: 21px; border-top: 1px solid var(--soft-line); }
.nav-group { display: grid; gap: 4px; }
.nav-group-label { margin: 0 0 5px 10px; color: var(--muted); font-weight: 650; font-size: 11px; letter-spacing: .1em; }
.nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 11px;
  width: 100%;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  text-align: left;
  color: var(--muted-strong);
  font-weight: 600;
  transition: color .15s ease, background .15s ease;
}
.nav-item .icon { color: #74628f; }
.nav-item:hover { background: #fff9; color: var(--accent-deep); }
.nav-item[aria-current='page'] { border-color: #fff; background: linear-gradient(135deg, #fff, #eee5fc); color: var(--accent-deep); box-shadow: 0 3px 9px #5b438418, inset 0 1px 0 #fff; }
.nav-item[aria-current='page'] .icon { color: var(--accent-deep); }
.nav-item[aria-current='page']::before { content: ''; position: absolute; inset-block: 10px; inset-inline-start: 0; width: 2px; border-radius: 2px; background: #8e74c8; }
.sidebar-bottom { margin-top: auto; padding-top: 28px; }
#demo-switch:not(:empty) { padding: 0 3px 11px; color: var(--muted); }
#demo-switch select, #demo-switch button { width: 100%; color: var(--ink); background: #fffd; border-color: var(--line); }
.demo-label { display: grid; gap: 5px; }
.demo-label > span { font-size: 11px; letter-spacing: .1em; }
.profile {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 7px;
  border: 1px solid #fff;
  border-radius: 14px;
  background: #fffa;
}
.profile-avatar {
  width: 33px;
  height: 33px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: linear-gradient(150deg, #f2eafa, #e7dbf8);
  color: var(--accent-deep);
  font-size: 13px;
  font-weight: 700;
  flex: 0 0 auto;
}
.profile-meta { display: grid; flex: 1 1 auto; min-width: 0; line-height: 1.35; }
.profile-meta strong, .profile-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-meta strong { font-size: 13px; }
.profile-meta span { color: var(--muted); font-size: 11px; margin-top: 3px; }
.icon-button { display: inline-grid; place-items: center; flex: 0 0 auto; width: 33px; height: 33px; border: 0; border-radius: 8px; background: transparent; color: inherit; }
.icon-button:hover { background: #a77ab023; }
.logout { color: var(--muted); }
.logout:hover { color: var(--accent-deep); }
#nav-toggle, .nav-scrim { display: none; }

.workspace {
  min-width: 0;
  min-height: calc(100vh - 2 * var(--shell-gap));
  align-self: start;
  border: 1px solid var(--glass-line);
  border-radius: 24px;
  background: radial-gradient(ellipse 38rem 28rem at 88% 1%, #ffe7a44d, transparent 81%),
    radial-gradient(ellipse 40rem 28rem at 20% 0%, #e6edff8f, transparent 80%), #faf8fba6;
  box-shadow: var(--glass-shadow);
}
.topbar {
  position: sticky;
  z-index: 2;
  top: var(--shell-gap);
  min-height: 56px;
  padding: 8px clamp(18px, 2.25vw, 34px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid #fff;
  border-radius: 23px 23px 0 0;
  background: #fcf9fff2;
  box-shadow: 0 1px 0 #816b9d10;
}
@supports (backdrop-filter: blur(1px)) {
  .sidebar { background: linear-gradient(155deg, #f9fbffe0, #f8f4fcd9 78%, #f1ebf8db); backdrop-filter: blur(18px) saturate(120%); }
  .topbar { background: #fcf9ffbd; backdrop-filter: blur(20px) saturate(130%); }
}
.breadcrumbs, .top-date { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--muted); }
.breadcrumbs #crumb { color: var(--ink); font-weight: 650; }
.crumb-divider { width: 13px; height: 13px; color: #9e8baa; }
.top-date { gap: 6px; padding: 5px 10px; border: 1px solid #fff; border-radius: 99px; background: #fffa; font-variant-numeric: tabular-nums; white-space: nowrap; }
.top-date .icon { width: 16px; height: 16px; color: var(--gold); }
.workspace-main { position: relative; z-index: 0; max-width: 1650px; margin-inline: auto; padding: 23px clamp(18px, 2.25vw, 34px) 40px; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 17px; }
.page-heading h1 { display: flex; align-items: center; gap: 9px; font: 750 clamp(25px, 2.35vw, 34px)/1.25 var(--heading-font); letter-spacing: -.012em; }
.page-heading h1::before { content: ''; flex: 0 0 auto; width: .46em; height: .46em; background: linear-gradient(150deg, #d9ac74, var(--gold)); clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); }
.page-heading p { font-size: 13px; color: var(--muted); margin-top: 5px; }
.page-heading p:empty { display: none; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
.header-actions:empty { display: none; }

.stack { display: grid; min-width: 0; gap: 17px; }
.card { min-width: 0; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.app-shell .card { background: var(--glass-card); border-color: var(--glass-line); box-shadow: var(--glass-shadow); }
.section-card { padding: 19px 21px; }
.section-head { display: flex; justify-content: space-between; align-items: start; gap: 13px; margin-bottom: 16px; }
.section-head h2, .ai-chat-head h2, .ai-context-head h2 { font-family: var(--heading-font); letter-spacing: -.01em; }
.section-head p { color: var(--muted); font-size: 12px; margin-top: 5px; }
.section-head h2 + .badge { margin-left: 6px; }
.section-head .btn { flex-shrink: 0; }
.dashboard-intro {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-height: 134px;
  padding: 21px 24px;
  border: 1px solid #6b4b7e;
  border-radius: var(--radius);
  background: radial-gradient(ellipse at 82% 75%, #a273a646 0%, transparent 65%), linear-gradient(112deg, #30203c, #412851 65%, #35233f);
  color: #fff6fa;
  box-shadow: 0 7px 23px #38204823;
}
.dashboard-intro::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0 0 0 38%;
  background: var(--stars), repeating-radial-gradient(circle at 68% 49%, transparent 0 27px, #ecd09c16 28px, transparent 29px 56px);
  mask-image: linear-gradient(90deg, transparent, #000 55%);
}
.dashboard-intro::after {
  content: '';
  position: absolute;
  z-index: -1;
  width: min(43%, 360px);
  inset: -6px 15% -6px auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 260 152'%3E%3Cg fill='none' stroke='%23e9ca8f' stroke-width='1.1'%3E%3Cpath d='M130 13 178 76 130 139 82 76Z' opacity='.58'/%3E%3Ccircle cx='130' cy='76' r='51' stroke-dasharray='2 5' opacity='.44'/%3E%3Ccircle cx='130' cy='76' r='39' opacity='.6'/%3E%3Cpath d='M134 54a22 22 0 1 0 16 34 19 19 0 0 1-16-34Z' fill='%23e9ca8f' fill-opacity='.22'/%3E%3Cpath d='M145 66v12m-6-6h12M59 48v12m-6-6h12m139 38v12m-6-6h12M32 97v8m-4-4h8m180-62v10m-5-5h10' opacity='.81'/%3E%3Cpath d='M44 77H80m100 0h36' stroke-dasharray='2 5' opacity='.4'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
  animation: celestial-reveal .85s ease-out both;
}
.dashboard-intro .eyebrow { color: var(--gold-light); }
.dashboard-intro .eyebrow .icon { width: 14px; height: 14px; }
.dashboard-intro h2 { font: 700 clamp(20px, 2.4vw, 29px)/1.3 var(--heading-font); margin-top: 5px; letter-spacing: .03em; overflow-wrap: anywhere; }
.dashboard-intro p { color: #e0d3e7; font-size: 12px; margin-top: 5px; }
.intro-detail { display: grid; gap: 3px; flex: 0 1 auto; min-width: 111px; max-width: 36%; padding: 9px 13px; border: 1px solid #e9ca8f55; border-radius: 10px; background: #35233de6; color: #fff2d7; font-size: 12px; overflow-wrap: anywhere; }
.intro-detail span { color: #e4d2e8; font-size: 10px; letter-spacing: .08em; }
.stats-grid { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.stat-card { position: relative; padding: 14px 16px; }
.stat-card:first-child { background: linear-gradient(150deg, #faf4fd, #fff 74%); border-color: #e8daef; }
.stat-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.stat-label { color: var(--muted-strong); font-size: 12px; font-weight: 650; }
.stat-icon { display: grid; place-items: center; flex: 0 0 auto; width: 33px; height: 33px; border-radius: 10px; background: #f0e4f6; color: #694984; }
.stat-icon--lime { background: #efe8f7; color: #61487e; }
.stat-icon--blue { background: #eaeaf6; color: #515c87; }
.stat-icon--sand { background: #f7efe0; color: #8a6530; }
.stat-icon .icon { width: 17px; height: 17px; }
.stat-value { margin-top: 6px; color: var(--ink); font-size: clamp(21px, 2.1vw, 31px); line-height: 1.2; font-weight: 730; font-variant-numeric: tabular-nums; letter-spacing: -.05em; overflow-wrap: anywhere; }
.stat-note { color: var(--muted); margin-top: 6px; font-size: 11px; }
.stat-note .icon { width: 13px; height: 13px; margin-right: 3px; }
.stat-spark { position: absolute; width: 23%; max-width: 70px; height: auto; right: 15px; bottom: 36px; opacity: .8; pointer-events: none; }
.stat-card:has(.stat-spark) .stat-value { padding-right: min(25%, 73px); }
.analytics-grid { min-width: 0; display: grid; grid-template-columns: minmax(0, 1.95fr) minmax(255px, 1fr); gap: 16px; }
.chart-wrap { width: 100%; overflow: hidden; }
.chart-wrap svg:not(.icon) { display: block; width: 100%; height: auto; }
.chart-wrap svg text { font-family: inherit; }
.chart-legend { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; color: var(--muted-strong); font-size: 11px; }
.chart-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.legend-dot { width: 8px; height: 8px; border-radius: 50%; background: #6a4b83; flex: 0 0 auto; }
.legend-dot:nth-child(2), .legend-dot--cost { background: #a8763d; }
.channel-meter { display: flex; height: 12px; overflow: hidden; gap: 3px; border-radius: 99px; margin: 19px 0 13px; background: #f0e9f2; }
.channel-meter > span { min-width: 3px; flex-basis: 0; border-radius: 3px; }
.channel-list { display: grid; }
.channel-row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(48px, auto); align-items: center; gap: 10px; padding: 11px 1px; border-bottom: 1px solid var(--soft-line); font-size: 12px; }
.channel-row:last-child { border-bottom: 0; }
.channel-row > span:first-child { display: flex; align-items: center; gap: 7px; color: var(--muted-strong); }
.channel-row > strong { text-align: right; font-size: 14px; }
.channel-row > strong small { color: var(--muted); font-weight: 400; }
.channel-row > span:last-child { text-align: right; color: var(--muted); font-variant-numeric: tabular-nums; }
.platform-douyin { --platform-color: var(--douyin); }
.platform-xiaohongshu { --platform-color: var(--xiaohongshu); }
.platform-legacy { --platform-color: var(--legacy); }
.platform-dot { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: var(--platform-color, var(--legacy)); vertical-align: .08em; flex: 0 0 auto; }
.channel-row .platform-dot { margin-right: 0; }
.financial-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.financial-grid > div { min-width: 0; display: grid; gap: 4px; padding: 11px 13px; border: 1px solid var(--soft-line); border-radius: 11px; background: #faf6fb; }
.financial-grid span { color: var(--muted); font-size: 11px; }
.financial-grid strong { font-size: 18px; font-variant-numeric: tabular-nums; letter-spacing: -.025em; overflow-wrap: anywhere; }
.metric-list { display: grid; }
.metric-row { min-width: 0; min-height: 43px; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--soft-line); }
.metric-row:last-child { border-bottom: 0; }
.metric-row span { font-size: 13px; color: var(--muted-strong); }
.metric-row strong { text-align: right; font-size: 15px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.workflow-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.workflow-step { position: relative; display: grid; justify-items: start; align-content: start; gap: 4px; min-width: 0; border: 1px solid var(--soft-line); border-radius: 10px; background: #faf6fb; padding: 10px 11px; }
.workflow-step:not(:last-child)::after { content: '›'; position: absolute; z-index: 1; top: calc(50% - 11px); right: -9px; width: 9px; color: #9279a4; text-align: center; font-weight: 700; }
.workflow-step .step-icon { display: grid; place-items: center; width: 27px; height: 27px; margin-bottom: 2px; border-radius: 7px; color: var(--accent-deep); background: #f0e7f6; }
.workflow-step .step-icon .icon { width: 16px; height: 16px; }
.workflow-step strong { color: var(--ink); font-size: 12px; line-height: 1.35; }
.workflow-step span:not(.step-icon) { color: var(--muted); font-size: 10px; line-height: 1.4; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 13px;
  min-height: 37px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--paper);
  color: var(--ink);
  font-weight: 650;
  font-size: 13px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s ease, border-color .15s ease;
}
.btn .icon { width: 16px; height: 16px; }
.btn:hover:not(:disabled) { background: #f6eff8; border-color: #d9c9e3; }
.btn-primary { --primary-sheen: linear-gradient(112deg, #674782, #78558e 48%, #55366f); color: #fff; background: var(--primary-sheen) 0 0 / 190% 100%; border-color: var(--accent); box-shadow: inset 0 1px 0 #ffffff24, 0 2px 5px #43265332; transition: background-position .35s ease, border-color .15s ease; }
.btn-primary:hover:not(:disabled) { background: var(--primary-sheen) 100% 0 / 190% 100%; border-color: var(--accent-deep); }
.btn-secondary { background: var(--paper); box-shadow: 0 1px 2px #34214209; }
.btn-small { min-height: 29px; padding: 4px 8px; font-size: 11px; }
.btn-ghost { background: transparent; border-color: transparent; color: var(--accent-deep); }
.app-shell .btn { border-radius: 10px; }
.app-shell .btn-primary { --primary-sheen: linear-gradient(110deg, #7255b0, #795bb9 48%, #59428f); box-shadow: inset 0 1px 0 #ffffff54, 0 4px 9px #4e368436; }
.app-shell .btn-secondary { background: linear-gradient(155deg, #fff, #f8f4ff); border-color: #e0d7ef; }
.app-shell .btn-secondary:hover:not(:disabled) { background: #efe7fa; }
.btn-danger { color: var(--danger); border-color: #f0d8d7; background: #fff7f6; }
.btn-danger:hover:not(:disabled) { background: #fcebe8; border-color: #eec2be; }
.badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; color: #5a4968; background: #f0eaf3; padding: 3px 8px; font-size: 11px; line-height: 1.25; font-weight: 650; white-space: nowrap; vertical-align: middle; }
.badge-green { color: #256345; background: #e8f4e9; }
.badge-blue { color: #385c7a; background: #eaf1f7; }
.badge-amber { color: #775523; background: #f8f0db; }

.table-wrap { min-width: 0; width: 100%; overflow-x: auto; scrollbar-width: thin; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; font-variant-numeric: tabular-nums; }
.data-table th, .data-table td { padding: 11px 13px; border-bottom: 1px solid var(--soft-line); white-space: nowrap; font-size: 12px; }
.data-table th { background: #f5eff6; color: var(--muted-strong); font-size: 11px; font-weight: 650; }
.app-shell .data-table td { font-size: 13px; }
.app-shell .data-table th { background: #f2edf9; font-size: 12px; }
.data-table thead th:first-child { border-radius: 7px 0 0 7px; }
.data-table thead th:last-child { border-radius: 0 7px 7px 0; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover td { background: #faf6fb; }
.data-table .numeric, .data-table .number-cell { text-align: right; }
.data-table .lead-total-cell { color: var(--accent-deep); font-weight: 700; }
.data-table .number-cell.positive, .data-table .number-cell.negative { font-weight: 650; }
.data-table .date-cell { color: var(--muted-strong); }
.data-table td > strong + small { display: block; color: var(--muted); margin-top: 2px; font-size: 10px; }
.notes-cell { max-width: 175px; overflow: hidden; text-overflow: ellipsis; }
.table-actions { display: flex; align-items: center; gap: 6px; }

.filters, .form-actions { display: flex; align-items: end; flex-wrap: wrap; gap: 9px; }
.filters .field { min-width: 115px; }
.range-switch, .date-range { display: flex; align-items: center; min-height: 35px; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.range-switch .btn { min-height: 27px; padding: 4px 10px; }
.range-switch .btn.active { border-color: transparent; background: var(--accent-wash); color: var(--accent-deep); }
.date-range > .icon { width: 15px; height: 15px; margin-left: 6px; color: var(--accent-deep); }
.date-range > span { color: var(--muted); }
.date-range .btn { min-height: 27px; }
.filters .filter-select { min-height: 35px; padding: 5px 8px; font-size: 12px; }
.monthly-filters { justify-content: flex-start; }
.monthly-filters input[type='month'] { min-width: 140px; }
.finance-filters { align-items: end; }
.finance-filters > .badge { margin-bottom: 6px; }
.finance-export-hint { margin-top: -5px; color: var(--muted); font-size: 12px; }
.finance-export-hint.form-error { color: var(--danger); }
.finance-breakdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; }
.finance-breakdown > div { padding: 9px 11px; border: 1px solid var(--soft-line); border-radius: 8px; background: var(--canvas); }
.finance-breakdown dt { color: var(--muted); font-size: 12px; }
.finance-breakdown dd { margin: 2px 0 0; color: var(--accent-deep); font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.finance-table { min-width: 850px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px; }
.form-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-grid > .field-wide, .form-grid > .form-actions, .form-grid > .form-error { grid-column: 1 / -1; }
.report-lead-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px; }
.report-lead-fields > .field-wide { grid-column: 1 / -1; }
.report-kq-leads { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: 5px 8px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); }
.report-kq-leads strong { color: var(--accent-deep); font-size: 13px; }
.report-kq-leads p, .report-lead-fields .field small { color: var(--muted); font-size: 12px; }
.report-kq-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.field { display: grid; gap: 5px; min-width: 0; color: var(--ink); }
.field label, .field > span:first-child { font-size: 12px; font-weight: 650; }
.field small { color: var(--muted); font-size: 11px; }
input:not([type='checkbox']):not([type='radio']), select, textarea {
  min-height: 37px;
  min-width: 0;
  border: 1px solid #dfd3e5;
  border-radius: 8px;
  padding: 7px 9px;
  background: #fff;
  color: var(--ink);
}
.date-range input[type='date'] { width: 121px; min-height: 27px; padding: 2px 6px; font-size: 12px; }
.field input:not([type='checkbox']):not([type='radio']), .field select, .field textarea { width: 100%; }
input:focus, select:focus, textarea:focus { border-color: #9a76ae; }
input::placeholder, textarea::placeholder { color: #796b83; }
input[readonly], input:disabled, select:disabled { background: #f4eef6 !important; color: var(--muted); }
input[type='checkbox'], input[type='radio'] { accent-color: var(--accent); }
textarea { resize: vertical; }
.form-actions { margin-top: 13px; }
.form-error:empty { display: none; }
.form-error, .error-state { padding: 10px 12px; border-radius: 8px; border: 1px solid #eed6d3; background: #fff5f4; color: #963632; font-size: 13px; }
.form-error { margin-top: 11px; }
.error-state p { margin: 7px 0; }
.form-layout { align-items: start; }
.unit-input { position: relative; }
.unit-input input[type='number'] { padding-right: 32px; }
.unit-input > span { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); color: var(--muted); font-size: 12px; pointer-events: none; }
.platform-field { padding: 9px 10px; border: 1px solid color-mix(in srgb, var(--platform-color, var(--legacy)) 20%, #fff); border-radius: 10px; background: color-mix(in srgb, var(--platform-color, var(--legacy)) 6%, #fff); }
.platform-field input:focus { border-color: var(--platform-color, var(--accent)); }
.platform-field input:focus-visible { outline-color: var(--platform-color, var(--accent)); }
.lead-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 13px; border: 1px solid #e9ddef; border-radius: 10px; background: #f8f0fb; color: var(--accent-deep); }
.lead-summary > div:first-child { display: grid; gap: 2px; }
.lead-summary small { color: var(--muted); font-size: 11px; }
.lead-summary output { font-size: 22px; font-weight: 750; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
.lead-summary > div:last-child { flex: 0 0 auto; }
.legacy-leads { display: grid; gap: 5px; padding: 10px 13px; border: 1px solid #e9dfc5; border-radius: 10px; background: #fffbef; color: #5f4c23; font-size: 12px; }
.legacy-leads p { color: #6d5d3e; }
.legacy-toggle { display: flex; align-items: center; gap: 6px; min-height: 26px; justify-self: start; cursor: pointer; font-weight: 650; }
.legacy-toggle input { margin: 0; flex: 0 0 auto; }
#report-form .form-actions { padding-top: 13px; border-top: 1px solid var(--soft-line); }
.report-preview { background: linear-gradient(#fbf5fd, #fff 48%); }
.report-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.report-metrics > div { display: grid; gap: 4px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 9px; background: #fffcfd; }
.report-metrics > div:last-child { background: #f4eafa; border-color: #e8d8f0; color: var(--accent-deep); }
.report-metrics span { color: var(--muted); font-size: 11px; }
.report-metrics strong { font-size: 16px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 10px; }
.team-tile { display: grid; justify-items: start; gap: 6px; padding: 12px; border-radius: 10px; border: 1px solid var(--line); background: #faf6fc; }
.team-tile > span:last-child { color: var(--muted); font-size: 12px; }
.equal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tier-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 43px; align-items: center; gap: 8px; margin-bottom: 8px; }
.tier-row--commission { grid-template-columns: repeat(3, minmax(0, 1fr)) 43px; }
.tier-row input { width: 100%; }
.tier-labels { font-size: 11px; font-weight: 650; color: var(--muted-strong); }
#tiers-commission, #tiers-rewards { margin-bottom: 11px; }
.app-dialog { width: min(570px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 0; border-radius: var(--radius); background: var(--paper); color: var(--ink); box-shadow: 0 15px 70px #24132f47; }
.app-dialog::backdrop { background: #25133382; backdrop-filter: blur(2px); }
.app-dialog .section-card { padding: 20px; }
.monitor-workspace { --monitor-subtle: #f9f4fb; gap: 12px; }
.monitor-status-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.monitor-notice { display: flex; flex: 1 1 26rem; align-items: flex-start; gap: 8px; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--muted-strong); }
.monitor-notice.is-unavailable { border-color: #e8e0ce; }
.monitor-notice > .icon { flex: 0 0 auto; width: 15px; height: 15px; margin-top: 2px; color: var(--accent); }
.monitor-notice.is-unavailable > .icon { color: #806431; }
.monitor-notice > div { flex: 1 1 auto; min-width: 0; }
.monitor-notice strong { color: var(--ink); font-size: 12px; }
.monitor-notice p { margin: 1px 0 0; color: var(--muted); font-size: 11px; }
.monitor-collection-guide { min-width: 0; max-width: 100%; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.monitor-collection-guide[open] { flex: 1 1 100%; }
.monitor-guide-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 3px 7px; padding: 8px 10px; min-height: 100%; border-radius: inherit; list-style: none; color: var(--muted); cursor: pointer; font-size: 11px; }
.monitor-guide-summary::-webkit-details-marker { display: none; }
.monitor-guide-summary:hover { background: var(--monitor-subtle); }
.monitor-guide-summary strong { color: var(--ink); font-size: 12px; }
.monitor-collection-guide[open] .monitor-guide-summary { min-height: auto; }
.monitor-guide-summary .icon { width: 13px; height: 13px; }
.monitor-guide-summary .icon:last-child { margin-inline-start: auto; }
.monitor-collection-guide[open] .monitor-guide-summary .icon:last-child { transform: rotate(90deg); }
.monitor-collection-legend {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: 5px 12px;
  padding: 8px 10px;
  border-top: 1px solid var(--line);
}
.monitor-collection-legend p { display: flex; align-items: baseline; gap: 6px; min-width: 0; color: var(--muted-strong); font-size: 11px; line-height: 1.45; }
.monitor-collection-legend strong { flex: 0 0 auto; color: var(--accent-deep); font-size: 11px; font-weight: 700; white-space: nowrap; }
.monitor-collection-legend .is-manual strong { color: #526176; }
.monitor-collection-legend .is-entry strong { color: #70592f; }
.stats-grid.monitor-summary { gap: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.monitor-summary .stat-card { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 3px 8px; padding: 9px 11px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.monitor-summary .stat-card + .stat-card { border-inline-start: 1px solid var(--line); }
.monitor-summary .stat-label { font-size: 11px; }
.monitor-summary .stat-icon, .monitor-summary .stat-note { display: none; }
.monitor-summary .stat-value { margin: 0; font-size: 19px; }
.monitor-summary .stat-value small { color: var(--muted-strong); font-size: 11px; font-weight: 550; }
.monitor-list.section-card { padding: 12px 15px; border-radius: 10px; box-shadow: none; }
.monitor-list .section-head { margin-bottom: 9px; }
.monitor-list .section-head p { margin-top: 2px; }
.monitor-date-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 9px; padding: 9px 10px; border: 1px solid var(--soft-line); border-radius: 9px; background: var(--monitor-subtle); }
.monitor-date-presets { flex-wrap: wrap; flex: 0 1 auto; max-width: 100%; }
.monitor-date-range { display: flex; flex: 1 1 26rem; align-items: center; flex-wrap: wrap; gap: 5px 9px; min-width: 0; }
.monitor-date-range .filter-select { width: 9.5rem; min-height: 31px; padding: 4px 6px; font-size: 12px; font-variant-numeric: tabular-nums; }
.monitor-date-range .form-error { flex: 1 0 100%; margin: 0; padding: 4px 8px; }
.monitor-date-caption { flex: 1 0 100%; color: var(--muted); font-size: 11px; }
.monitor-toolbar { align-items: center; gap: 6px 10px; margin-bottom: 0; padding: 0 0 10px; }
.monitor-filter { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; }
.monitor-filter-label { color: var(--muted-strong); font-size: 11px; font-weight: 650; white-space: nowrap; }
.monitor-toolbar .filter-select { min-height: 31px; min-width: 0; max-width: min(14rem, 100%); }
.monitor-date-actions, .monitor-list-actions, .monitor-page-controls { display: flex; align-items: center; gap: 7px; }
.monitor-list-actions { margin-inline-start: auto; }
.monitor-count { color: var(--muted-strong); font-size: 12px; font-variant-numeric: tabular-nums; }
.monitor-pagination { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 7px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--soft-line); color: var(--muted-strong); font-size: 12px; font-variant-numeric: tabular-nums; }
.monitor-pagination .btn:disabled, .monitor-gallery-nav .btn:disabled { cursor: default; }
.monitor-list-loading { padding: 15px 2px; color: var(--muted); font-size: 12px; }
.monitor-grid { container: monitor-list / inline-size; border-top: 1px solid var(--line); }
.monitor-work {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 12px 1px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.monitor-work + .monitor-work { border-top: 1px solid var(--line); }
.monitor-card-body { display: grid; grid-template-columns: clamp(8.5rem, 17cqi, 12.5rem) minmax(0, 1fr); align-items: start; gap: 14px; min-width: 0; }
.monitor-card-media, .monitor-card-detail { display: grid; gap: 5px; min-width: 0; }
.monitor-card-detail { gap: 6px; }
.monitor-work-header { min-width: 0; }
.monitor-work-identity { display: flex; align-items: center; flex-wrap: wrap; gap: 3px 6px; min-width: 0; }
.monitor-work-name { flex: 1 1 12rem; margin: 0; font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.monitor-work-identity .monitor-meta { flex: 1 0 100%; margin: 0; overflow-wrap: anywhere; }
.monitor-tags { display: flex; flex: 0 0 auto; gap: 4px; flex-wrap: wrap; }
.monitor-tags .badge, .monitor-work-status { padding: 2px 6px; border-radius: 5px; font-size: 10px; }
.monitor-tags .badge { background: var(--monitor-subtle); color: var(--muted-strong); box-shadow: inset 0 0 0 1px var(--line); }
.monitor-tags .platform-dot { margin-right: 0; }
.monitor-meta { color: var(--muted); font-size: 11px; }
.monitor-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(4.5rem, 1.15fr); gap: 4px 10px; max-width: 38rem; margin: 1px 0; }
.monitor-metrics > div { min-width: 0; }
.monitor-metrics dt { color: var(--muted-strong); font-size: 10px; line-height: 1.4; }
.monitor-metrics dd { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 5px; margin: 2px 0 0; font-variant-numeric: tabular-nums; line-height: 1.3; }
.monitor-metrics dd strong { min-width: 0; font-size: 15px; overflow-wrap: anywhere; }
.monitor-delta { font-size: 10px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.monitor-delta.is-up { color: var(--success); }
.monitor-delta.is-down { color: var(--danger); }
.monitor-delta.is-flat { color: var(--muted); }
.monitor-work-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 3px 7px; }
.monitor-work-footer p { display: flex; align-items: center; gap: 5px; margin: 0; }
.monitor-work-state { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-width: 0; }
.monitor-work-status.badge-green { background: #edf5ef; color: #33634a; }
.monitor-work-status.badge-blue { background: #f0f2f4; color: #485564; }
.monitor-work-status.badge-amber { background: #f7f1e5; color: #77572d; }
.monitor-wechat-adds { min-width: 0; padding-top: 4px; border-top: 1px solid var(--line); }
.monitor-wechat-readout, .monitor-wechat-form { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-height: 26px; }
.monitor-wechat-label, .monitor-wechat-form > label { color: var(--muted-strong); font-size: 11px; font-weight: 650; }
.monitor-wechat-label { display: inline-flex; align-items: center; gap: 4px; }
.monitor-wechat-label .icon, .monitor-wechat-edit .icon { width: 12px; height: 12px; }
.monitor-wechat-value { color: var(--ink); font-size: 14px; font-weight: 730; font-variant-numeric: tabular-nums; }
.monitor-wechat-value.is-empty { color: var(--muted); font-size: 11px; font-weight: 500; }
.monitor-wechat-edit { color: var(--accent-deep); }
.monitor-wechat-form > label { display: flex; align-items: center; gap: 6px; min-width: 0; }
.monitor-wechat-form input.monitor-wechat-input { width: min(6rem, 100%); min-height: 29px; padding: 3px 6px; font-size: 13px; font-variant-numeric: tabular-nums; }
.monitor-wechat-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; }
.monitor-wechat-adds .btn { min-height: 27px; padding-inline: 7px; }
.monitor-wechat-form .form-error { flex: 1 0 100%; padding: 4px 7px; font-size: 11px; }
.monitor-work-times { display: flex; flex-wrap: wrap; gap: 3px 7px; min-width: 0; }
.monitor-sandbase-status { color: var(--muted-strong); overflow-wrap: anywhere; }
.monitor-sandbase-status.is-error { color: var(--danger); }
.monitor-history-source { margin-inline-start: 5px; }
.monitor-work-footer .icon { width: 13px; height: 13px; }
.monitor-work-error { margin: 0; color: var(--danger); font-size: 11px; overflow-wrap: anywhere; }
.monitor-actions { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; margin-inline-start: auto; }
.monitor-actions .btn { min-height: 28px; padding-inline: 6px; }
.monitor-actions .monitor-remove { color: var(--danger); }
.monitor-more { position: relative; }
.monitor-more[open] { z-index: 2; }
.monitor-more-trigger { list-style: none; cursor: pointer; }
.monitor-more-trigger::-webkit-details-marker { display: none; }
.monitor-more[open] .monitor-more-trigger { background: var(--monitor-subtle); border-color: var(--line); }
.monitor-more-menu { position: absolute; inset-block-start: calc(100% + 4px); inset-inline-end: 0; display: grid; min-width: 8.5rem; max-width: min(14rem, 80vw); gap: 2px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); box-shadow: 0 7px 22px #321d4425; }
.monitor-more:not([open]) .monitor-more-menu { display: none; }
.monitor-more-menu .btn { justify-content: flex-start; width: 100%; padding-inline: 7px; }
.monitor-card-assets, .monitor-card-copy { display: grid; gap: 4px; min-width: 0; margin: 0; }
.monitor-card-description { display: -webkit-box; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--muted-strong); font-size: 12px; line-height: 1.45; }
.monitor-preview-frame, .monitor-media-empty { display: grid; place-items: center; width: 100%; min-width: 0; height: clamp(86px, 12cqi, 132px); overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--monitor-subtle); }
.monitor-media-empty { align-content: center; gap: 5px; padding: 7px; color: var(--muted); text-align: center; font-size: 11px; }
.monitor-media-empty > .icon { width: 17px; height: 17px; }
.monitor-preview-frame.is-video { border-color: #342641; background: #23182d; color: #fff; }
.monitor-preview-frame:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.monitor-preview-frame img, .monitor-preview-frame video { display: block; width: 100%; height: 100%; object-fit: contain; }
.work-image-trigger { position: relative; display: block; width: 100%; min-height: 0; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.monitor-preview-frame .work-image-trigger { height: 100%; }
.work-image-trigger:focus-visible { outline-offset: -3px; }
.work-image-hint { position: absolute; inset: auto 5px 5px auto; display: inline-flex; align-items: center; gap: 3px; padding: 2px 6px; border-radius: 5px; color: #fff7e8; background: #251a30dc; font-size: 10px; pointer-events: none; }
.work-image-hint .icon { width: 12px; height: 12px; }
.monitor-gallery-nav, .monitor-preview-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.monitor-gallery-nav { justify-content: center; }
.monitor-preview-actions { justify-content: space-between; }
.monitor-gallery-nav .btn, .monitor-preview-actions .btn { min-height: 27px; padding: 3px 5px; font-size: 11px; }
.monitor-gallery-nav .btn { min-width: 27px; font-size: 16px; line-height: 1; }
.monitor-gallery-nav .icon, .monitor-preview-actions .icon { width: 13px; height: 13px; }
.monitor-gallery-position, .monitor-media-status { color: var(--muted-strong); font-size: 11px; font-variant-numeric: tabular-nums; }
.monitor-gallery-position { text-align: center; white-space: nowrap; }
@container monitor-list (max-width: 35rem) {
  .monitor-card-body { grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .monitor-work--has-preview .monitor-preview-frame { height: clamp(100px, 36cqi, 185px); }
  .monitor-media-empty { height: 42px; grid-auto-flow: column; justify-content: center; }
}
.monitor-dialog { width: min(800px, calc(100vw - 24px)); }
.monitor-dialog .table-wrap { max-height: min(55vh, 520px); }
.monitor-dialog thead { position: sticky; top: 0; }
.work-material-panel { max-height: min(58vh, 580px); overflow: auto; }
.work-material-copy { background: #faf6fb; border: 1px solid var(--soft-line); border-radius: 10px; padding: 12px; }
.work-material-copy h3 { margin: 0 0 6px; font-size: 13px; }
.work-material-copy p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.work-material-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(175px, 100%), 1fr)); gap: 10px; }
.work-material-file { margin: 0; min-width: 0; border: 1px solid var(--soft-line); border-radius: 10px; overflow: hidden; }
.work-material-file img, .work-material-file video { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #f0e7f4; }
.work-material-file figcaption { display: flex; align-items: center; justify-content: space-between; padding: 4px 8px; font-size: 12px; }
.work-image-dialog { width: min(1040px, calc(100vw - 24px)); }
.work-image-dialog::backdrop { background: #1b1126d6; }
.work-image-dialog .section-card { position: relative; padding: clamp(12px, 2vw, 20px); }
.work-image-close { position: absolute; inset: clamp(12px, 2vw, 20px) clamp(12px, 2vw, 20px) auto auto; }
.work-image-original { display: block; width: 100%; max-height: calc(100dvh - 128px); margin-top: 12px; border-radius: 7px; background: var(--canvas); object-fit: contain; }
.monitor-empty { display: grid; justify-items: center; gap: 9px; }
.monitor-empty .empty-state { padding-bottom: 1px; }
.monitor-empty > .btn { margin-bottom: 12px; }
.monitor-badge-error { color: #963632; background: #fff0ed; }
@media (max-width: 455px) {
  .monitor-notice { display: grid; grid-template-columns: auto minmax(0, 1fr); }
  .monitor-notice > .btn { grid-column: 2; justify-self: start; }
  .monitor-collection-guide { width: 100%; }
  .monitor-list.section-card { padding-inline: 11px; }
  .monitor-list-actions { margin-inline-start: 0; }
  .monitor-work { padding: 10px 0; }
  .monitor-date-filters { gap: 7px; padding: 7px; }
  .monitor-date-presets .btn { padding-inline: 6px; }
  .monitor-date-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; }
  .monitor-date-range .monitor-filter { display: grid; min-width: 0; }
  .monitor-date-range .filter-select { width: 100%; min-height: 36px; font-size: 16px; }
  .monitor-date-range .btn { grid-column: 1 / -1; justify-self: end; min-height: 33px; }
  .monitor-date-range .form-error { grid-column: 1 / -1; }
  .monitor-metrics { column-gap: 6px; }
  .monitor-actions .btn, .monitor-gallery-nav .btn, .monitor-preview-actions .btn, .monitor-pagination .btn, .monitor-wechat-adds .btn, .monitor-wechat-form input.monitor-wechat-input { min-height: 32px; }
  .monitor-wechat-form input.monitor-wechat-input { font-size: 16px; }
  .monitor-gallery-nav .btn { min-width: 32px; }
}
.empty-state { display: grid; place-items: center; gap: 7px; padding: 35px 12px; color: var(--muted); text-align: center; font-size: 13px; }
.empty-state .icon { width: 27px; height: 27px; color: #927ca4; }
.empty-state strong { color: var(--ink); }
.toast { position: fixed; bottom: 24px; right: 24px; z-index: 8; max-width: min(360px, calc(100vw - 48px)); border-radius: 10px; padding: 11px 15px; background: var(--rail); color: #fff; box-shadow: 0 6px 20px #34244136; font-size: 13px; }
.toast.error { background: #8b3835; }

.auth-layout { min-height: 100dvh; display: grid; grid-template-columns: minmax(380px, 1.05fr) minmax(350px, 1fr); }
.auth-brand { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 38px; min-width: 0; padding: clamp(30px, 5vw, 72px); color: #fff6fb; background: radial-gradient(ellipse at 92% 76%, #79558281, transparent 62%), linear-gradient(140deg, #2e2039, #251a30 62%, #422c4e); }
.auth-brand::before { content: ''; position: absolute; z-index: -1; inset: 14px; border: 1px solid #e9ca8f28; border-radius: 9px; pointer-events: none; }
.auth-brand::after { content: ''; position: absolute; z-index: -2; inset: 9% 0 3%; background: var(--stars); pointer-events: none; }
.tarot-auth-art { position: absolute; z-index: -1; inset: 0 -5% 0 auto; width: min(64%, 480px); height: 100%; color: var(--gold-light); opacity: .51; pointer-events: none; animation: celestial-reveal .95s ease-out both; }
.auth-brand .brand { padding: 0; }
.auth-brand .brand-mark { background: linear-gradient(145deg, #f3dbad, #d3a66a); color: #442e56; }
.auth-brand .brand small { color: var(--rail-muted); }
.auth-story { max-width: 460px; }
.auth-pill { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #e9ca8f49; border-radius: 999px; color: #f0dcba; background: #e9ca8f0e; padding: 5px 10px; font-size: 12px; }
.auth-pill > span { background: var(--gold-light); width: 6px; height: 6px; border-radius: 50%; }
.auth-story h1 { margin: 17px 0; font: 700 clamp(36px, 4.8vw, 70px)/1.16 var(--heading-font); letter-spacing: -.014em; text-shadow: 0 3px 12px #1a102786; }
.auth-story h1 span { color: var(--gold-light); }
.auth-story p { color: #e3d4e8; max-width: 30em; font-size: clamp(13px, 1.4vw, 16px); line-height: 1.8; }
.auth-pipeline { margin-top: 28px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.auth-pipeline > div { display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; border: 1px solid #e9ca8f38; border-radius: 8px; color: #f4e8f7; background: #e9ca8f0c; font-size: 12px; }
.auth-pipeline > div .icon { color: var(--gold-light); width: 16px; height: 16px; }
.auth-pipeline .pipeline-arrow { color: var(--rail-muted); width: 13px; height: 13px; }
.auth-brand-footer { display: inline-flex; align-items: center; gap: 7px; color: var(--rail-muted); font-size: 12px; }
.auth-brand-footer .icon { width: 15px; height: 15px; }
.auth-content { min-width: 0; display: grid; align-content: center; justify-items: center; padding: 40px clamp(24px, 4vw, 64px); background: radial-gradient(ellipse at 14% 14%, #eadcf1, transparent 60%), radial-gradient(ellipse at 95% 98%, #f1e3d5, transparent 59%), var(--canvas); }
.auth-card { width: min(100%, 430px); padding: clamp(19px, 3vw, 34px); border: 1px solid var(--line); border-radius: 18px; background: var(--paper); box-shadow: 0 15px 46px #4a2c5d16; }
.auth-card.error-state { border-color: #eed6d3; background: #fff5f4; }
.auth-card h1, .auth-card h2 { font: 700 29px/1.24 var(--heading-font); margin: 6px 0; letter-spacing: .02em; }
.auth-kicker { color: var(--gold); font-size: 11px; letter-spacing: .16em; font-weight: 750; }
.auth-copy, .auth-card > p { color: var(--muted); font-size: 13px; }
.auth-form, .auth-card form { display: grid; gap: 13px; margin-top: 20px; }
.auth-card input:not([type='checkbox']):not([type='radio']), .auth-card .btn-primary { min-height: 43px; }
.auth-card .btn-primary { width: 100%; }

.kq-panel { margin-bottom: 15px; background: linear-gradient(120deg, #fcf8ff, var(--paper) 60%); }
.kq-panel-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 10px; }
.kq-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--accent-wash); color: var(--accent-deep); }
.kq-panel-head h2 { font: 700 17px/1.4 var(--heading-font); }
.kq-panel-head h2 .badge { margin-left: 4px; }
.kq-panel-head p, .kq-meta { margin-top: 3px; color: var(--muted); font-size: 12px; }
.kq-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kq-actions .icon { width: 14px; height: 14px; }
.kq-meta, .kq-notice { margin-top: 8px; }
.kq-notice { display: flex; align-items: center; gap: 6px; color: var(--accent-deep); font-size: 12px; }
.kq-notice .icon { width: 14px; height: 14px; }
.kq-panel > .form-error { margin: 8px 0 0; }
.kq-verification { margin-top: 12px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.kq-verification > p { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 12px; }
.kq-verification > p span, .kq-verification small { color: var(--muted); font-size: 11px; }
.kq-verification > p .icon { width: 13px; height: 13px; color: var(--gold); }
.kq-verification dl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; margin: 8px 0; }
.kq-verification dl > div { min-width: 0; padding: 6px 8px; border-radius: 6px; background: var(--canvas); }
.kq-verification dt { color: var(--muted); font-size: 11px; }
.kq-verification dd { margin: 1px 0 0; font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }

.wechat-overview { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px; }
.wechat-overview > .card:first-child { background: linear-gradient(135deg, #fbf5ff, var(--paper) 60%); }
.wechat-binding-list { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.wechat-binding-list > li { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: 7px 10px; padding: 8px 0; border-top: 1px solid var(--soft-line); }
.wechat-binding-list strong, .wechat-binding-details strong { font-size: 13px; overflow-wrap: anywhere; }
.wechat-binding-list .wechat-badges { margin-top: 4px; }
.wechat-binding-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.wechat-binding-actions [data-action^='wechat-binding-delete-'] { color: var(--danger); }
.wechat-binding-details { display: grid; gap: 6px; margin: 12px 0; }
.wechat-binding-details details { padding: 7px 8px; border: 1px solid var(--line); border-radius: 7px; }
.wechat-binding-details summary { cursor: pointer; }
.wechat-binding-details summary .badge { margin-inline-start: 6px; }
.wechat-binding-details summary small { margin-inline-start: 6px; }
.wechat-binding-details .wechat-badges { margin: 7px 0; }
.wechat-detail-dialog { width: min(780px, calc(100vw - 24px)); }
.wechat-badges { display: flex; flex-wrap: wrap; gap: 5px; }
.wechat-note { margin-top: 7px; color: var(--muted); font-size: 12px; }
.wechat-record-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin-bottom: 10px; }
.wechat-date-form .filter-select { min-width: 0; }
.wechat-summary { display: grid; gap: 6px; margin: 8px 0; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--canvas); }
.wechat-summary span { color: var(--muted); font-size: 11px; }
.wechat-totals { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; }
.wechat-totals div { display: flex; align-items: baseline; gap: 5px; }
.wechat-totals dt, .wechat-totals small { color: var(--muted); font-size: 11px; }
.wechat-totals dd { margin: 0; color: var(--accent-deep); font-weight: 700; font-variant-numeric: tabular-nums; }
.wechat-totals.is-compact { gap: 2px 7px; min-width: 125px; }
.wechat-days-table { min-width: 320px; }
.wechat-employees-table { min-width: 750px; }
.wechat-records .form-error, .wechat-overview .form-error { margin: 8px 0 0; }

.ai-workspace { display: grid; grid-template-columns: minmax(190px, 235px) minmax(0, 1fr); align-items: start; gap: 15px; max-width: 1100px; }
.ai-context { display: grid; gap: 13px; padding: 15px; }
.ai-context-head, .ai-scope { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ai-context-head .icon, .ai-scope .icon { width: 15px; height: 15px; color: var(--accent); }
.ai-scope { margin-top: -7px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.ai-dates { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ai-dates legend, .ai-work-selection > strong { margin-bottom: 4px; padding: 0; font-size: 12px; font-weight: 700; }
.ai-dates input[type='date'], .ai-context select { min-height: 34px; padding: 5px 7px; font-variant-numeric: tabular-nums; }
.ai-date-presets, .ai-prompts { display: flex; flex-wrap: wrap; gap: 5px; }
.ai-date-presets .btn[aria-pressed='true'] { border-color: #e1cfea; background: var(--accent-wash); color: var(--accent-deep); }
.ai-dates small, .ai-work-selection > p, .ai-connection p { color: var(--muted); font-size: 11px; }
.ai-work-selection, .ai-connection { display: grid; justify-items: start; gap: 3px; padding-top: 11px; border-top: 1px solid var(--line); }
.ai-work-selection > strong { margin-bottom: 0; }
.ai-work-selection > .btn, .ai-connection > .btn { margin-inline-start: -5px; }
.ai-work-dates { width: 100%; margin-top: 4px; }
.ai-work-date-modes .btn { min-height: 31px; padding-inline: 7px; }
.ai-scope-note { line-height: 1.45; }
.ai-selected-work { display: flex; align-items: center; gap: 5px; width: 100%; min-width: 0; }
.ai-selected-work .badge { flex: 0 0 auto; padding: 2px 6px; font-size: 10px; }
.ai-selected-work .platform-dot { margin-inline-end: 0; }
.ai-selected-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: 12px; }
.ai-connection .ai-connection-label { display: flex; align-items: center; gap: 5px; color: var(--ink); font-size: 12px; font-weight: 650; }
.ai-connection-label i { width: 7px; height: 7px; border-radius: 50%; background: #a89bb1; }
.ai-connection-label .is-ready { background: var(--success); }
.ai-connection p { overflow-wrap: anywhere; }
.ai-chat { min-width: 0; }
.ai-chat-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 6px; padding: 15px 17px 12px; border-bottom: 1px solid var(--line); }
.ai-chat-head p { margin-top: 3px; color: var(--muted); font-size: 12px; }
.ai-chat-head .btn { flex: 0 0 auto; }
.ai-chat-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.ai-chat-actions .icon { width: 13px; height: 13px; }
.ai-chat-actions [aria-expanded='true'] { background: var(--accent-wash); color: var(--accent-deep); }
.ai-history-panel { display: grid; justify-items: start; gap: 6px; padding: 9px 17px; border-bottom: 1px solid var(--line); background: #faf6fc; font-size: 12px; }
.ai-history-panel .form-error { margin: 0; }
.ai-thread-list { display: grid; gap: 3px; width: 100%; max-height: 220px; margin: 0; padding: 0 3px 0 0; list-style: none; overflow: auto; }
.ai-thread-button { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 7px; width: 100%; min-height: 36px; padding: 6px 8px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--ink); text-align: start; }
.ai-thread-button:hover, .ai-thread-button[aria-current='true'] { border-color: var(--line); background: var(--paper); color: var(--accent-deep); }
.ai-thread-button[aria-current='true'] { box-shadow: inset 2px 0 var(--gold); }
.ai-thread-button .icon { width: 14px; height: 14px; color: var(--accent); }
.ai-thread-button span, .ai-current-thread strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-thread-button time, .ai-current-thread > span { color: var(--muted); font-size: 11px; }
.ai-current-thread { display: flex; align-items: center; gap: 7px; padding: 4px 17px; border-bottom: 1px solid var(--soft-line); }
.ai-current-thread > span, .ai-delete-thread { flex: 0 0 auto; }
.ai-current-thread strong { flex: 1 1 auto; font-size: 12px; }
.ai-delete-thread.btn-ghost { color: var(--danger); }
.ai-history-loading { display: flex; align-items: center; gap: 6px; padding: 21px 17px; color: var(--muted); font-size: 12px; }
.ai-older-turns { justify-self: center; }
.ai-starter { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; gap: 14px; min-height: 158px; padding: 20px 22px; background: radial-gradient(ellipse at 88% 46%, #eddef6, transparent 70%), linear-gradient(100deg, #faf5fc, #fcf8f3); }
.ai-starter::after { content: ''; position: absolute; z-index: -1; inset: 0 0 0 54%; background: repeating-radial-gradient(circle at 80% 55%, transparent 0 15px, #9e78a526 16px, transparent 17px 29px); mask-image: linear-gradient(90deg, transparent, #000 52%); pointer-events: none; }
.ai-starter-icon { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 auto; border: 1px solid #b18bc9; border-radius: 12px; background: linear-gradient(145deg, #7a5a90, #513567); color: var(--gold-light); box-shadow: 0 4px 12px #65427827; }
.ai-starter h3 { font: 700 19px/1.35 var(--heading-font); }
.ai-starter p { max-width: 36em; margin-top: 4px; color: var(--muted); font-size: 12px; }
.ai-transcript { display: grid; gap: 17px; max-height: min(56dvh, 550px); overflow: auto; padding: 15px 17px 19px; }
.ai-exchange { display: grid; gap: 10px; min-width: 0; }
.ai-question { justify-self: end; width: fit-content; max-width: min(83%, 44rem); padding: 8px 10px; border: 1px solid #e6d7ed; border-radius: 9px 9px 2px 9px; background: #f7eefb; overflow-wrap: anywhere; }
.ai-question small { display: block; margin-bottom: 2px; color: var(--muted); font-size: 11px; }
.ai-question p, .ai-answer-text { white-space: pre-wrap; }
.ai-reply { min-width: 0; padding: 11px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); }
.ai-reply-label, .ai-coverage h3, .ai-pending { display: flex; align-items: center; gap: 6px; color: var(--accent-deep); font-size: 12px; font-weight: 650; }
.ai-reply-label span { color: var(--muted); font-size: 11px; font-weight: 500; }
.ai-reply-label .icon, .ai-coverage .icon, .ai-pending .icon { width: 14px; height: 14px; }
.ai-answer-text { margin-top: 6px; line-height: 1.7; overflow-wrap: anywhere; }
.ai-pending { padding: 6px 0; color: var(--muted); }
.ai-pending .icon { color: var(--gold); animation: celestial-pulse 1.55s ease-in-out infinite; }
.ai-coverage { margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--line); }
.ai-coverage-list { display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 5px 0 0; }
.ai-coverage-list > div { display: flex; gap: 4px; align-items: center; padding: 2px 6px; border-radius: 5px; background: var(--canvas); color: var(--muted-strong); font-size: 11px; }
.ai-coverage-list dd { margin: 0; color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.ai-coverage ul { display: grid; gap: 3px; margin: 6px 0 0; padding-left: 16px; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.ai-coverage-notes { margin-top: 6px; color: var(--muted-strong); font-size: 11px; }
.ai-coverage-notes summary { width: fit-content; cursor: pointer; }
.ai-composer { display: grid; gap: 8px; padding: 12px 17px 15px; border-top: 1px solid var(--line); }
.ai-composer textarea { min-height: 74px; }
.ai-composer .form-error { margin: 0; }
.ai-image-controls { display: grid; gap: 6px; }
.ai-image-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 8px; }
.ai-image-actions p { color: var(--muted); font-size: 11px; }
.ai-image-list { display: flex; flex-wrap: wrap; gap: 7px; }
.ai-question .ai-image-list { margin-top: 6px; }
.ai-image-tile { position: relative; display: block; width: 76px; height: 62px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); }
.ai-image-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ai-image-remove { position: absolute; top: 3px; right: 3px; display: grid; place-items: center; width: 23px; height: 23px; padding: 0; border: 1px solid #ffffff85; border-radius: 50%; background: #271737d9; color: #fff; font-size: 18px; line-height: 1; }
.ai-image-remove:hover { background: #271737; }
.ai-submit-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ai-submit-row p { color: var(--muted); font-size: 11px; }
.ai-submit-row .btn { flex: 0 0 auto; }

@keyframes celestial-reveal {
  from { opacity: 0; transform: translateY(7px) scale(.98); }
  to { transform: none; }
}

@keyframes celestial-pulse {
  50% { opacity: .55; transform: scale(.84); }
}

@media (max-width: 1130px) {
  :root { --sidebar-width: 190px; }
  .sidebar { padding-inline: 12px; }
  .stats-grid { gap: 10px; }
  .stat-card { padding-inline: 12px; }
  .section-card { padding-inline: 15px; }
}

@media (max-width: 900px) {
  .app-shell { --shell-gap: 0px; display: block; }
  .workspace { border: 0; border-radius: 0; }
  .sidebar { position: fixed; inset: 8px auto 8px 8px; width: min(247px, 82vw); height: calc(100dvh - 16px); transform: translateX(calc(-100% - 12px)); visibility: hidden; transition: transform .2s ease, visibility .2s ease; }
  #shell.nav-open .sidebar { visibility: visible; transform: translateX(0); }
  #shell.nav-open .nav-scrim { display: block; position: fixed; inset: 0; z-index: 3; border: 0; background: #21122f82; }
  #nav-toggle { display: inline-grid; margin-left: -7px; color: var(--ink); }
  .breadcrumbs { gap: 6px; }
  .topbar { min-height: 53px; border-radius: 0; }
  .workspace-main { padding-top: 19px; }
}

@media (max-width: 760px) {
  .auth-layout { grid-template-columns: minmax(0, 1fr); }
  .auth-brand { padding: 23px 24px; gap: 23px; }
  .auth-brand::before { inset: 7px; }
  .tarot-auth-art { opacity: .32; inset-inline-end: -10%; }
  .auth-story h1 { margin: 9px 0; font-size: 33px; }
  .auth-story h1 br { display: none; }
  .auth-story p { font-size: 12px; }
  .auth-pipeline, .auth-brand-footer { display: none; }
  .auth-content { padding: 25px 24px 38px; }
}

@media (max-width: 675px) {
  .finance-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kq-panel-head { grid-template-columns: auto minmax(0, 1fr); }
  .kq-actions { grid-column: 2; }
  .kq-verification dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wechat-overview { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .wechat-date-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .wechat-date-form .field { min-width: 0; }
  .wechat-date-form input { width: 100%; min-width: 0; }
  .wechat-date-form .btn { justify-self: start; }
  .analytics-grid { grid-template-columns: minmax(0, 1fr); }
  .ai-workspace { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .ai-context { gap: 8px; padding: 11px 12px; }
  .ai-dates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-date-presets, .ai-dates small, .ai-work-dates:has(#ai-work-date) .field { grid-column: 1 / -1; }
  .ai-work-selection, .ai-connection { padding-top: 7px; }
  .ai-chat-head, .ai-history-panel, .ai-current-thread, .ai-history-loading, .ai-transcript, .ai-composer { padding-inline: 12px; }
  .ai-chat-head { flex-wrap: wrap; }
  .ai-starter { min-height: 106px; padding: 12px; }
  .ai-question { max-width: 96%; }
  .ai-composer textarea, .ai-dates input[type='date'], .ai-context select { font-size: 16px; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .monitor-collection-legend { grid-template-columns: minmax(0, 1fr); }
  .monitor-collection-legend strong { min-width: 5.5em; text-align: center; }
  .stats-grid.monitor-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .monitor-summary .stat-card { display: block; padding: 6px 4px; text-align: center; }
  .monitor-summary .stat-head { justify-content: center; line-height: 1.25; }
  .monitor-summary .stat-label { font-size: 10px; }
  .monitor-summary .stat-value { margin-top: 3px; font-size: 19px; }
  .monitor-summary .stat-value small { font-size: 10px; }
  .workflow-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .workflow-step:nth-child(3)::after { display: none; }
  .financial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 460px) {
  .workspace-main { padding-inline: 13px; }
  .topbar { padding-inline: 15px; }
  .page-heading { flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
  .header-actions { justify-content: flex-start; }
  .dashboard-intro { align-items: flex-start; flex-direction: column; padding: 14px 16px; gap: 9px; }
  .dashboard-intro::after { opacity: .58; }
  .intro-detail { display: flex; align-items: center; gap: 7px; min-width: 0; max-width: 100%; }
  .date-range input[type='date'] { width: clamp(100px, 27vw, 121px); }
  .stat-spark { display: none; }
  .stat-card:has(.stat-spark) .stat-value { padding-right: 0; }
  .section-card { padding: 13px; }
  .section-head { flex-wrap: wrap; }
  .form-grid, .form-grid--three, .report-lead-fields { grid-template-columns: minmax(0, 1fr); }
  .crumb-root, .crumb-divider { display: none; }
}

@media (max-width: 350px) {
  .monitor-date-range, .ai-dates { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .dashboard-intro::after, .tarot-auth-art, .ai-pending .icon { animation: none; }
}

@media (prefers-reduced-transparency: reduce) {
  .sidebar, .topbar { background: #f9f6fd; backdrop-filter: none; }
  .app-shell .card { background: var(--paper); }
}
