:root {
  color-scheme: light;
  --bg: #f0ede4;
  --bg-glow: rgba(255, 251, 238, .88);
  --surface: #faf7ee;
  --card: #fffdf7;
  --card-strong: #fffef9;
  --ink: #37342d;
  --muted: #777064;
  --quiet: #9d9484;
  --line: #ddd6c7;
  --line-strong: #cfc4b1;
  --green: #b59b68;
  --green-dark: #78623b;
  --green-bg: #eee5d2;
  --copper: #b56b4d;
  --copper-bg: #f4e2db;
  --amber: #b98445;
  --amber-bg: #f5e9d8;
  --olive: #7f886b;
  --olive-bg: #e9ebdd;
  --mauve: #796f78;
  --mauve-bg: #ece7eb;
  --stone: #8b918d;
  --stone-bg: #eceeeb;
  --source-ok: #3f8f6b;
  --source-refreshing: #c28a38;
  --source-offline: #b85b55;
  --shadow: 0 18px 48px rgb(37 49 45 / 8%);
  --radius: 16px;
  --ease-silk: cubic-bezier(.22, 1, .36, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  font-family: "Microsoft YaHei UI", "PingFang SC", "Noto Sans CJK SC", sans-serif;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --copper: #d29172;
  --copper-bg: #472f26;
  --amber: #dfbd73;
  --amber-bg: #463a25;
  --olive: #b7a78a;
  --olive-bg: #3c352a;
  --mauve: #baa9b5;
  --mauve-bg: #3e353d;
  --stone: #aaa49a;
  --stone-bg: #37332d;
  --shadow: 0 18px 48px rgb(0 0 0 / 24%);
}

* {
  box-sizing: border-box;
}

html {
  background: var(--bg);
  color: var(--ink);
  min-width: 320px;
}

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 10% 0%, var(--bg-glow), transparent 28rem),
    var(--bg);
  transition: background-color .28s var(--ease-soft), color .22s var(--ease-soft);
}

button,
input,
select {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
  transition:
    color .18s var(--ease-soft),
    background-color .18s var(--ease-soft),
    border-color .18s var(--ease-soft),
    box-shadow .22s var(--ease-silk),
    transform .18s var(--ease-silk);
}

button:not(:disabled):active {
  transform: scale(.98);
}

a {
  color: var(--green-dark);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

.eyebrow {
  margin: 0 0 6px;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.login-shell,
.loading-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-card {
  width: min(520px, 100%);
  padding: 52px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgb(255 253 248 / 92%);
  box-shadow: var(--shadow);
}

.brand-mark,
.loading-mark {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  margin-bottom: 28px;
  border-radius: 20px;
  background: var(--green);
  color: white;
  font-weight: 900;
  letter-spacing: .05em;
}

.login-card h1 {
  margin: 0;
  font-size: clamp(30px, 6vw, 44px);
  letter-spacing: -.04em;
}

.login-copy {
  margin: 16px 0 32px;
  color: var(--muted);
  line-height: 1.8;
}

.login-form label {
  display: block;
  margin-bottom: 10px;
  font-weight: 700;
}

.account-fields { display: grid; gap: 14px; }
.account-fields label { margin: 0; display: grid; gap: 7px; }
.account-fields label[hidden] { display: none; }
.account-fields label > span { color: var(--muted); font-size: 10px; }
.account-fields input {
  width: 100%;
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  outline: none;
}
.account-fields input:focus { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 16%, transparent); }
.login-submit {
  width: 100%;
  min-height: 46px;
  margin-top: 16px;
  border: 1px solid var(--green-dark);
  border-radius: 8px;
  background: var(--green-dark);
  color: #fff;
  cursor: pointer;
  font-weight: 800;
}
.login-submit:disabled { opacity: .55; cursor: wait; }

.code-field {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.code-field input,
.search-field,
.filter-grid > label > input,
.filter-grid > label > select {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink);
  outline: none;
}

.code-field input {
  width: 100%;
  padding: 0 14px;
}

.code-field input:focus,
.search-field:focus-within,
.filter-grid > label > input:focus,
.filter-grid > label > select:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgb(85 118 107 / 12%);
}

.code-field button,
.primary-small {
  border: 0;
  border-radius: 12px;
  background: var(--green);
  color: white;
  cursor: pointer;
  font-weight: 800;
}

.code-field button {
  padding: 0 24px;
}

.code-field button:disabled {
  opacity: .55;
}

.form-message {
  min-height: 22px;
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.form-message.is-error {
  color: var(--copper);
}

.loading-shell {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--muted);
  background:
    radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--green-bg) 70%, transparent), transparent 24rem),
    var(--bg);
}

.loading-shell::before,
.loading-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
}

.loading-shell::before {
  opacity: .42;
  background-image:
    linear-gradient(color-mix(in srgb, var(--green) 11%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--green) 11%, transparent) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(circle at center, black, transparent 72%);
}

.loading-shell::after {
  background:
    radial-gradient(circle at 50% 48%, transparent 0 15rem, color-mix(in srgb, var(--bg) 22%, transparent) 28rem),
    linear-gradient(115deg, color-mix(in srgb, var(--green) 4%, transparent), transparent 42% 58%, color-mix(in srgb, var(--copper) 4%, transparent));
}

.loading-stage {
  position: relative;
  z-index: 2;
  width: min(560px, 100%);
  display: grid;
  justify-items: center;
  text-align: center;
  animation: loader-stage-in .58s var(--ease-silk) both;
}

.loading-frame {
  position: absolute;
  z-index: 1;
  width: min(72vw, 780px);
  height: min(58vh, 510px);
  pointer-events: none;
}

.loading-frame > i {
  position: absolute;
  display: block;
}

.loading-frame > i:nth-child(1),
.loading-frame > i:nth-child(3) {
  right: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--green), transparent);
  transform: scaleX(0);
  animation: loader-frame-x .78s .12s var(--ease-silk) forwards;
}

.loading-frame > i:nth-child(1) { top: 0; }
.loading-frame > i:nth-child(3) { bottom: 0; animation-delay: .28s; }

.loading-frame > i:nth-child(2),
.loading-frame > i:nth-child(4) {
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(transparent, var(--green), transparent);
  transform: scaleY(0);
  animation: loader-frame-y .78s .34s var(--ease-silk) forwards;
}

.loading-frame > i:nth-child(2) { right: 0; }
.loading-frame > i:nth-child(4) { left: 0; animation-delay: .48s; }

.loading-kicker {
  margin: 0 0 18px;
  opacity: 0;
  color: var(--green-dark);
  font: 700 9px/1 Georgia, "Times New Roman", serif;
  letter-spacing: .3em;
  transform: translateY(10px);
  animation: loader-rise .55s .25s var(--ease-silk) forwards;
}

.loading-wordmark {
  display: flex;
  gap: clamp(3px, 1vw, 9px);
  color: var(--ink);
  font: 600 clamp(58px, 10vw, 108px)/.78 Georgia, "Times New Roman", serif;
  letter-spacing: -.04em;
}

.loading-wordmark > span {
  opacity: 0;
  transform: translateY(22px);
  animation: loader-rise .68s .42s var(--ease-silk) forwards;
}

.loading-wordmark > span:nth-child(2) { animation-delay: .51s; }
.loading-wordmark > span:nth-child(3) { animation-delay: .60s; }

.loading-rule {
  width: 0;
  height: 1px;
  margin: 25px 0 18px;
  background: var(--green);
  animation: loader-rule .8s .72s var(--ease-silk) forwards;
}

.loading-emblem {
  position: relative;
  width: 126px;
  height: 126px;
  display: grid;
  place-items: center;
  margin-bottom: 30px;
}

.loading-orbit {
  position: absolute;
  inset: 0;
  border: 1px solid color-mix(in srgb, var(--green) 36%, transparent);
  border-radius: 50%;
}

.loading-orbit::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green-dark);
  box-shadow: 0 0 18px color-mix(in srgb, var(--green) 58%, transparent);
}

.loading-orbit-outer {
  animation: loader-orbit-spin 1.2s var(--ease-silk) forwards;
}

.loading-orbit-inner {
  inset: 13px;
  border-style: dashed;
  opacity: .62;
  animation: loader-orbit-spin 1.45s var(--ease-silk) reverse forwards;
}

.loading-orbit-inner::before {
  top: auto;
  right: 8px;
  bottom: 4px;
  left: auto;
  width: 5px;
  height: 5px;
  background: var(--copper);
}

.loading-emblem .loading-mark {
  position: relative;
  z-index: 2;
  width: 68px;
  height: 68px;
  margin: 0;
  border: 1px solid color-mix(in srgb, white 32%, transparent);
  border-radius: 22px;
  background: linear-gradient(145deg, var(--green), var(--green-dark));
  box-shadow: 0 16px 38px color-mix(in srgb, var(--green-dark) 28%, transparent);
  animation: loader-mark-breathe .9s var(--ease-soft) forwards;
}

.loading-copy h1 {
  margin: 0;
  opacity: 0;
  color: var(--ink);
  font-size: clamp(28px, 5vw, 40px);
  letter-spacing: -.045em;
  transform: translateY(12px);
  animation: loader-rise .62s .84s var(--ease-silk) forwards;
}

.loading-copy > p:last-child {
  margin: 12px 0 0;
  opacity: 0;
  font-size: 12px;
  transform: translateY(10px);
  animation: loader-rise .56s .96s var(--ease-silk) forwards;
}

.loading-progress {
  position: relative;
  width: min(310px, 78vw);
  height: 3px;
  margin: 28px 0 12px;
  overflow: hidden;
  opacity: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line) 72%, transparent);
  transform: translateY(8px);
  animation: loader-rise .5s 1.08s var(--ease-silk) forwards;
}

.loading-progress > i {
  position: absolute;
  inset: 0;
  width: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, var(--green), var(--copper), transparent);
  transform: scaleX(0);
  transform-origin: left;
  animation: loader-progress 1.05s 1.16s var(--ease-silk) forwards;
}

.loading-phases {
  width: min(310px, 78vw);
  display: flex;
  justify-content: space-between;
  opacity: 0;
  color: var(--quiet);
  font-size: 9px;
  letter-spacing: .08em;
  transform: translateY(8px);
  animation: loader-rise .5s 1.16s var(--ease-silk) forwards;
}

.loading-phases span {
  animation: loader-phase .42s 1.22s var(--ease-soft) forwards;
}

.loading-phases span:nth-child(2) { animation-delay: 1.48s; }
.loading-phases span:nth-child(3) { animation-delay: 1.74s; }

.loading-scan {
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  left: -24%;
  width: 20%;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, white 62%, transparent), transparent);
  transform: skewX(-12deg);
  animation: loader-scan 1.05s 1.12s ease-in-out forwards;
}

.entry-curtain {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, color-mix(in srgb, var(--green) 17%, transparent), transparent 22rem),
    var(--bg);
  transform-origin: top;
  animation: entry-curtain-away .92s .08s var(--ease-silk) both;
}

.entry-curtain::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--green), var(--copper), transparent);
  box-shadow: 0 0 18px color-mix(in srgb, var(--green) 48%, transparent);
}

.entry-curtain-mark {
  display: grid;
  justify-items: center;
  gap: 14px;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 26px;
  letter-spacing: .18em;
  animation: entry-mark-away .58s .12s var(--ease-silk) both;
}

.entry-curtain-mark i {
  width: 38px;
  height: 1px;
  background: var(--green);
}

.app-shell.is-entering .app-header {
  animation: page-enter .66s .22s var(--ease-silk) both;
}

.detail-shell.is-entering .detail-header {
  animation: page-enter .66s .22s var(--ease-silk) both;
}

.app-shell.is-entering .dashboard-layout,
.app-shell.is-entering .weekly-query-card,
.app-shell.is-entering .weekly-main {
  animation: page-enter .72s .32s var(--ease-silk) both;
}

.app-shell.is-entering .analytics-main > * {
  animation-name: page-enter;
  animation-duration: .72s;
  animation-timing-function: var(--ease-silk);
  animation-fill-mode: both;
}

.app-shell.is-entering .analytics-main > :nth-child(1) { animation-delay: .28s; }
.app-shell.is-entering .analytics-main > :nth-child(2) { animation-delay: .34s; }
.app-shell.is-entering .analytics-main > :nth-child(3) { animation-delay: .40s; }
.app-shell.is-entering .analytics-main > :nth-child(4) { animation-delay: .46s; }
.app-shell.is-entering .analytics-main > :nth-child(5) { animation-delay: .52s; }
.app-shell.is-entering .analytics-main > :nth-child(6) { animation-delay: .58s; }
.app-shell.is-entering .analytics-main > :nth-child(n + 7) { animation-delay: .64s; }

.detail-shell.is-entering .detail-main > * {
  animation: page-enter .72s .34s var(--ease-silk) both;
}

@keyframes loader-stage-in {
  from { transform: translateY(12px) scale(.98); }
  to { transform: translateY(0) scale(1); }
}

@keyframes loader-frame-x {
  to { transform: scaleX(1); }
}

@keyframes loader-frame-y {
  to { transform: scaleY(1); }
}

@keyframes loader-rise {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes loader-rule {
  to { width: min(220px, 54vw); }
}

@keyframes loader-scan {
  20% { opacity: 1; }
  100% { left: 124%; opacity: 0; }
}

@keyframes loader-orbit-spin {
  to { transform: rotate(360deg); }
}

@keyframes loader-halo-spin {
  to { transform: translate(-50%, -50%) rotate(380deg); }
}

@keyframes loader-mark-breathe {
  50% { transform: translateY(-3px) scale(1.025); box-shadow: 0 20px 44px color-mix(in srgb, var(--green-dark) 36%, transparent); }
}

@keyframes loader-progress {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes loader-phase {
  from { color: var(--quiet); opacity: .58; }
  to { color: var(--green-dark); opacity: 1; }
}

@keyframes entry-curtain-away {
  0%, 34% { opacity: 1; clip-path: inset(0 0 0 0); }
  100% { opacity: .1; clip-path: inset(0 0 100% 0); }
}

@keyframes entry-mark-away {
  0%, 42% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-18px) scale(.94); }
}

@keyframes page-enter {
  from { opacity: 0; transform: translateY(18px) scale(.992); filter: blur(5px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

::view-transition-old(root),
::view-transition-new(root) {
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  animation: route-view-out .17s ease-in both;
}

::view-transition-new(root) {
  animation: route-section-in .42s var(--ease-silk) both;
}

html[data-view-transition="detail-forward"]::view-transition-new(root) {
  animation-name: route-detail-forward-in;
}

html[data-view-transition="detail-back"]::view-transition-new(root) {
  animation-name: route-detail-back-in;
}

#app.is-route-leaving > * {
  animation: route-view-out .145s ease-in both;
}

#app.is-route-entering > * {
  animation: route-section-in .42s var(--ease-silk) both;
}

@keyframes route-view-out {
  to { opacity: .18; transform: translateY(-5px) scale(.996); filter: blur(2px); }
}

@keyframes route-section-in {
  from { opacity: 0; transform: translateY(13px) scale(.997); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@keyframes route-detail-forward-in {
  from { opacity: 0; transform: translateX(18px) scale(.997); filter: blur(4px); }
  to { opacity: 1; transform: translateX(0) scale(1); filter: blur(0); }
}

@keyframes route-detail-back-in {
  from { opacity: 0; transform: translateX(-14px) scale(.998); filter: blur(3px); }
  to { opacity: 1; transform: translateX(0) scale(1); filter: blur(0); }
}

.app-shell {
  min-height: 100vh;
  padding: 32px clamp(20px, 3vw, 48px) 64px;
}

.app-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 32px;
  max-width: 1900px;
  margin: 0 auto 24px;
}

.app-header h1,
.detail-hero h1 {
  margin: 0;
  font-size: clamp(28px, 3vw, 42px);
  letter-spacing: -.04em;
}

.header-copy {
  margin: 8px 0 0;
  color: var(--muted);
}

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.read-only-badge,
.freshness,
.attention-chip,
.interval-chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.read-only-badge {
  background: var(--green-bg);
  color: var(--green-dark);
}

.freshness {
  background: var(--card);
  color: var(--muted);
}

.freshness.is-stale,
.attention-chip {
  background: var(--amber-bg);
  color: #8b5d26;
}

.icon-button,
.text-button,
.filter-button,
.back-button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  cursor: pointer;
  font-weight: 700;
}

.text-button {
  border-color: transparent;
  background: transparent;
  color: var(--muted);
}

.stale-banner {
  max-width: 1900px;
  margin: 0 auto 16px;
  padding: 12px 16px;
  border: 1px solid #e7c899;
  border-radius: 12px;
  background: var(--amber-bg);
  color: #795323;
  font-size: 13px;
}

.dashboard-layout {
  width: 100%;
  max-width: 1900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.dashboard-layout.is-insights-open {
  grid-template-columns: minmax(0, 1fr) 392px;
}

.dashboard-main {
  min-width: 0;
}

.dashboard-main > .metric-strip,
.dashboard-main > .ledger {
  max-width: none;
}

.dashboard-insights {
  position: sticky;
  top: 16px;
  max-height: calc(100vh - 32px);
  display: none;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #f8f6ef;
  box-shadow: var(--shadow);
}

.dashboard-layout.is-insights-open .dashboard-insights {
  display: flex;
  flex-direction: column;
  animation: surface-rise .3s var(--ease-silk) both;
}

.insights-backdrop {
  display: none;
}

.insights-header {
  padding: 20px 20px 17px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--card);
}

.insights-header h2 {
  margin: 0;
  font-size: 21px;
  letter-spacing: -.02em;
}

.insights-header > div > span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 10px;
}

.insights-close {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  font-size: 20px;
}

.insights-close:hover,
.icon-button:hover,
.filter-button:hover,
.back-button:hover {
  border-color: rgb(85 118 107 / 48%);
  background: var(--green-bg);
  color: var(--green-dark);
  box-shadow: 0 6px 18px rgb(85 118 107 / 10%);
}

.insights-scroll {
  padding: 14px;
  display: grid;
  gap: 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.insight-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.insight-kpis article,
.insight-pair article,
.insight-section {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  transition:
    border-color .2s var(--ease-soft),
    box-shadow .24s var(--ease-silk),
    transform .24s var(--ease-silk);
}

.insight-kpis article:hover,
.insight-pair article:hover,
.insight-section:hover {
  border-color: rgb(85 118 107 / 34%);
  box-shadow: 0 10px 24px rgb(37 49 45 / 6%);
  transform: translateY(-1px);
}

.insight-kpis article {
  min-height: 104px;
  padding: 14px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}

.insight-kpis span,
.insight-pair span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.insight-kpis strong {
  grid-row: span 2;
  align-self: center;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 500;
}

.insight-kpis small,
.insight-pair small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.45;
}

.insight-section {
  padding: 16px;
}

.insight-title {
  margin-bottom: 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.insight-title > div {
  display: grid;
  gap: 4px;
}

.insight-title span {
  font-size: 12px;
  font-weight: 900;
}

.insight-title small,
.coverage-section p {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}

.insight-title > strong {
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  font-weight: 500;
  white-space: nowrap;
}

.flow-chips {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
}

.flow-chips > div {
  min-width: 0;
  padding: 10px 6px;
  display: grid;
  gap: 5px;
  border-radius: 10px;
  text-align: center;
}

.flow-chips span {
  overflow: hidden;
  font-size: 8px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.flow-chips strong {
  font-size: 17px;
}

.flow-chips .tone-copper { background: var(--copper-bg); color: #995039; }
.flow-chips .tone-green { background: var(--green-bg); color: var(--green-dark); }
.flow-chips .tone-olive { background: var(--olive-bg); color: #697151; }
.flow-chips .tone-amber { background: var(--amber-bg); color: #8a5d2b; }

.weekly-chart {
  height: 164px;
  padding-top: 16px;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 7px;
  align-items: end;
  border-bottom: 1px solid var(--line);
}

.weekly-column {
  height: 100%;
  min-width: 0;
  display: grid;
  grid-template-rows: 16px 1fr 20px;
  align-items: end;
  justify-items: center;
}

.weekly-column > strong {
  color: var(--muted);
  font-size: 9px;
}

.weekly-column > span {
  align-self: center;
  color: var(--muted);
  font-size: 8px;
}

.weekly-stack {
  width: min(24px, 72%);
  min-height: 2px;
  display: flex;
  overflow: hidden;
  flex-direction: column-reverse;
  border-radius: 5px 5px 1px 1px;
  background: var(--line);
}

.weekly-stack i {
  width: 100%;
  min-height: 1px;
}

.weekly-stack .tone-copper,
.chart-legend .tone-copper { background: var(--copper); }
.weekly-stack .tone-green,
.chart-legend .tone-green { background: var(--green); }
.weekly-stack .tone-olive,
.chart-legend .tone-olive { background: var(--olive); }
.weekly-stack .tone-amber,
.chart-legend .tone-amber { background: var(--amber); }
.weekly-stack .tone-muted { background: #a7aaa5; }

.chart-legend {
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 8px;
}

.chart-legend i {
  width: 7px;
  height: 7px;
  margin-left: 4px;
  border-radius: 50%;
}

.holder-visual {
  display: grid;
  grid-template-columns: 116px 1fr;
  align-items: center;
  gap: 16px;
}

.donut {
  width: 116px;
  height: 116px;
  padding: 18px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}

.donut > span {
  width: 100%;
  height: 100%;
  display: grid;
  place-content: center;
  border-radius: 50%;
  background: var(--card);
  text-align: center;
}

.donut strong,
.donut small {
  display: block;
}

.donut strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 500;
}

.donut small {
  color: var(--muted);
  font-size: 8px;
}

.donut-legend {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.donut-legend div {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  font-size: 9px;
}

.donut-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.donut-legend span {
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.insight-bars {
  display: grid;
  gap: 10px;
}

.insight-bars.is-compact {
  gap: 8px;
}

.insight-bar-row {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 8px;
  font-size: 9px;
}

.insight-bar-row > span {
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.insight-bar-row > strong {
  text-align: right;
}

.insight-bar-track,
.coverage-track {
  height: 7px;
  overflow: hidden;
  border-radius: 99px;
  background: #ebe8df;
}

.insight-bar-track i,
.coverage-track i {
  height: 100%;
  display: block;
  border-radius: inherit;
  background: var(--green);
}

.insight-bar-track .tone-copper { background: var(--copper); }
.insight-bar-track .tone-olive { background: var(--olive); }
.insight-bar-track .tone-amber { background: var(--amber); }
.insight-bar-track .tone-muted { background: #a7aaa5; }

.insight-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.insight-pair article {
  min-height: 108px;
  padding: 14px;
  display: grid;
  gap: 7px;
  align-content: start;
}

.insight-pair strong {
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 19px;
  font-weight: 500;
}

.coverage-section p {
  margin: 10px 0 0;
}

.metric-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
  max-width: 1700px;
  margin: 0 auto 16px;
}

.metric-card {
  min-height: 104px;
  padding: 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--card);
  text-align: left;
  cursor: pointer;
  transition: .18s ease;
}

.metric-card:hover,
.metric-card.is-active {
  transform: translateY(-1px);
  border-color: var(--green);
  box-shadow: 0 8px 24px rgb(85 118 107 / 9%);
}

.metric-card span {
  align-self: center;
  color: var(--muted);
  font-size: 13px;
}

.metric-card strong {
  grid-row: span 2;
  align-self: center;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 500;
}

.metric-card small {
  color: var(--muted);
  font-size: 11px;
}

.ledger {
  max-width: 1700px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
}

.ledger-toolbar {
  min-height: 84px;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: auto minmax(280px, 560px) auto;
  align-items: center;
  gap: 18px;
  background: var(--card);
}

.ledger-toolbar h2 {
  margin: 0;
  font-size: 22px;
}

.search-field {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 14px;
}

.search-field span {
  color: var(--green);
  font-size: 18px;
}

.search-field input {
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
}

.filter-button.has-filter {
  border-color: var(--green);
  background: var(--green-bg);
  color: var(--green-dark);
}

.filter-panel {
  max-height: 0;
  padding: 0 20px;
  overflow: hidden;
  border-top: 1px solid var(--line);
  background: #f6f4ed;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  visibility: hidden;
  transition:
    max-height .34s var(--ease-silk),
    padding .28s var(--ease-silk),
    opacity .2s var(--ease-soft),
    transform .28s var(--ease-silk),
    visibility 0s linear .28s;
}

.filter-panel.is-open {
  max-height: 560px;
  padding: 18px 20px;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  visibility: visible;
  transition-delay: 0s;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 14px;
}

.filter-grid > label,
.filter-field {
  position: relative;
  min-width: 0;
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.filter-grid > label > input,
.filter-grid > label > select {
  width: 100%;
  padding: 0 10px;
  transition:
    border-color .18s var(--ease-soft),
    box-shadow .2s var(--ease-soft),
    background-color .18s var(--ease-soft);
}

.filter-field-label {
  min-height: 13px;
}

.multi-filter-trigger {
  width: 100%;
  min-height: 46px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.multi-filter-trigger > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multi-filter-trigger > strong {
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: var(--green);
  color: white;
  font-size: 10px;
}

.multi-filter-trigger > i {
  color: var(--muted);
  font-size: 15px;
  font-style: normal;
  transition: transform .24s var(--ease-silk);
}

.multi-filter-trigger:hover,
.multi-filter-trigger:focus-visible,
.multi-filter-trigger.has-selection {
  border-color: rgb(85 118 107 / 60%);
  background: var(--green-bg);
  box-shadow: 0 0 0 3px rgb(85 118 107 / 8%);
  outline: none;
}

.multi-filter.is-open .multi-filter-trigger > i {
  transform: rotate(180deg);
}

.multi-filter-menu {
  position: absolute;
  z-index: 70;
  top: calc(100% + 8px);
  left: 0;
  width: max(100%, 260px);
  padding: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgb(255 253 248 / 98%);
  box-shadow: 0 18px 42px rgb(37 49 45 / 16%);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px) scale(.985);
  transform-origin: top center;
  visibility: hidden;
  transition:
    opacity .18s var(--ease-soft),
    transform .24s var(--ease-silk),
    visibility 0s linear .2s;
}

.multi-filter.is-open .multi-filter-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  visibility: visible;
  transition-delay: 0s;
}

.multi-filter-menu-head {
  min-height: 34px;
  padding: 0 6px 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgb(216 213 202 / 74%);
  color: var(--muted);
  font-size: 10px;
}

.multi-filter-menu-head button {
  padding: 5px 7px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--green-dark);
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
}

.multi-filter-menu-head button:hover {
  background: var(--green-bg);
}

.multi-filter-options {
  max-height: 230px;
  padding-top: 5px;
  display: grid;
  gap: 2px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.multi-filter-option {
  position: relative;
  min-height: 39px;
  padding: 0 9px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  align-items: center;
  gap: 8px;
  border-radius: 9px;
  color: var(--ink);
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
  transition:
    color .16s var(--ease-soft),
    background-color .16s var(--ease-soft),
    transform .2s var(--ease-silk);
}

.multi-filter-option:hover {
  background: #f2f2eb;
  transform: translateX(2px);
}

.multi-filter-option.is-selected {
  background: var(--green-bg);
  color: var(--green-dark);
}

.multi-filter-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.multi-filter-option > i {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--card);
  color: transparent;
  font-size: 11px;
  font-style: normal;
  transition: .18s var(--ease-soft);
}

.multi-filter-option.is-selected > i {
  border-color: var(--green);
  background: var(--green);
  color: white;
  transform: scale(1.04);
}

.multi-filter-option:focus-within {
  outline: 2px solid rgb(85 118 107 / 28%);
  outline-offset: -2px;
}

.filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 14px;
}

.primary-small {
  min-height: 36px;
  padding: 0 16px;
}

.ledger-table {
  width: 100%;
  overflow-x: auto;
}

.table-head,
.row-main {
  min-width: 1260px;
  display: grid;
  grid-template-columns: 1.55fr 1.9fr .65fr .95fr .9fr .7fr 1fr .58fr .9fr .42fr;
  align-items: center;
  gap: 12px;
}

.table-head {
  min-height: 44px;
  padding: 0 20px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.ledger-row {
  min-width: 1260px;
  border-bottom: 1px solid var(--line);
  background: var(--card);
  transition:
    border-color .2s var(--ease-soft),
    box-shadow .26s var(--ease-silk),
    background-color .2s var(--ease-soft);
}

.ledger-row:last-child {
  border-bottom: 0;
}

.ledger-row.is-expanded {
  box-shadow: inset 4px 0 var(--green);
}

.row-main {
  width: 100%;
  min-height: 66px;
  padding: 0 20px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition:
    background-color .2s var(--ease-soft),
    color .2s var(--ease-soft);
}

.row-main:hover,
.ledger-row.is-expanded .row-main {
  background: var(--green-bg);
}

.cell {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.document-number {
  font-weight: 900;
  letter-spacing: .015em;
}

.document-title {
  font-size: 13px;
}

.holder-cell,
.stay-cell {
  color: var(--muted);
}

.expand-label {
  color: var(--green-dark);
  font-weight: 800;
  text-align: right;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-height: 27px;
  padding: 0 10px;
  overflow: hidden;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tone-active,
.tone-complete {
  background: var(--green-bg);
  color: var(--green-dark);
}

.tone-precomplete {
  background: var(--olive-bg);
  color: #697151;
}

.tone-change {
  background: var(--copper-bg);
  color: #995039;
}

.tone-owner {
  background: var(--amber-bg);
  color: #8a5d2b;
}

.row-expanded {
  padding: 20px 24px 28px;
  border-top: 1px solid var(--line);
  background: #f5f3eb;
  animation: content-unfold .3s var(--ease-silk) both;
}

.expanded-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.expanded-heading h3 {
  margin: 0;
  font-size: 15px;
}

.expanded-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.inline-timeline {
  display: grid;
  grid-template-columns: repeat(var(--event-count), minmax(150px, 1fr));
  gap: 14px;
}

.preview-event {
  position: relative;
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--card);
  animation: surface-rise .32s var(--ease-silk) both;
  transition:
    border-color .2s var(--ease-soft),
    box-shadow .24s var(--ease-silk),
    transform .24s var(--ease-silk);
}

.preview-event:nth-child(2) { animation-delay: 25ms; }
.preview-event:nth-child(3) { animation-delay: 50ms; }
.preview-event:nth-child(4) { animation-delay: 75ms; }
.preview-event:nth-child(5) { animation-delay: 100ms; }
.preview-event:nth-child(6) { animation-delay: 125ms; }

.preview-event:hover {
  border-color: rgb(85 118 107 / 38%);
  box-shadow: 0 10px 24px rgb(37 49 45 / 7%);
  transform: translateY(-2px);
}

.preview-event::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 16px;
  width: 34px;
  height: 3px;
  border-radius: 99px;
  background: var(--green);
}

.preview-event.tone-copper::before {
  background: var(--copper);
}

.preview-event.tone-olive::before {
  background: var(--olive);
}

.preview-event.tone-amber::before {
  background: var(--amber);
}

.preview-event i {
  position: absolute;
  top: 50%;
  right: -15px;
  width: 15px;
  border-top: 1px solid var(--green);
}

.preview-role,
.preview-event small,
.preview-event time {
  display: block;
  color: var(--muted);
  font-size: 10px;
}

.preview-event strong {
  display: block;
  margin: 9px 0 6px;
  font-size: 12px;
}

.preview-event time {
  margin-top: 12px;
}

.preview-links {
  display: flex;
  gap: 12px;
  margin-top: 9px;
  font-size: 10px;
  font-weight: 800;
}

.preview-links span {
  color: var(--copper);
}

.empty-inline {
  margin: 0;
  padding: 32px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  text-align: center;
}

.empty-state {
  padding: 80px 24px;
  color: var(--muted);
  text-align: center;
}

.empty-state strong {
  display: block;
  color: var(--ink);
  font-size: 18px;
}

.empty-state button {
  margin-top: 8px;
  border: 0;
  background: transparent;
  color: var(--green);
  cursor: pointer;
  font-weight: 800;
}

.mobile-actions {
  display: none;
}

.detail-shell {
  min-height: 100vh;
}

.detail-header {
  position: sticky;
  z-index: 10;
  top: 0;
  min-height: 68px;
  padding: 0 clamp(20px, 5vw, 72px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgb(251 250 245 / 92%);
  backdrop-filter: blur(14px);
}

.back-button {
  border: 0;
  background: transparent;
  color: var(--green-dark);
}

.detail-main {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
  padding: 44px 0 100px;
}

.detail-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 32px;
}

.detail-title {
  margin: 12px 0 0;
  font-size: 18px;
}

.detail-meta {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.detail-status {
  display: grid;
  justify-items: end;
  gap: 14px;
}

.detail-status a {
  font-size: 12px;
  font-weight: 800;
}

.attention-summary {
  margin-top: 24px;
  padding: 14px 16px;
  display: flex;
  gap: 14px;
  border: 1px solid #e7c899;
  border-radius: 13px;
  background: var(--amber-bg);
  color: #745123;
  font-size: 12px;
}

.detail-controls {
  position: sticky;
  z-index: 8;
  top: 68px;
  margin-top: 28px;
  padding: 14px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  background: rgb(239 238 231 / 94%);
  backdrop-filter: blur(12px);
}

.detail-controls > span {
  color: var(--muted);
  font-size: 11px;
}

.detail-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.detail-chips button {
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}

.detail-chips button.is-active {
  border-color: var(--green);
  background: var(--green);
  color: white;
}

.full-timeline {
  position: relative;
  padding: 28px 0 0;
}

.full-timeline::before {
  content: "";
  position: absolute;
  top: 28px;
  bottom: 40px;
  left: 114px;
  width: 2px;
  background: var(--green);
}

.timeline-entry {
  position: relative;
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 48px;
  margin-bottom: 18px;
}

.timeline-rail {
  padding-top: 23px;
  color: var(--muted);
  font-size: 10px;
  text-align: right;
}

.timeline-dot {
  position: absolute;
  top: 25px;
  left: 107px;
  width: 16px;
  height: 16px;
  border: 3px solid var(--bg);
  border-radius: 50%;
  background: var(--green);
}

.timeline-entry.tone-copper .timeline-dot {
  background: var(--copper);
}

.timeline-entry.tone-olive .timeline-dot {
  background: var(--olive);
}

.timeline-entry.tone-amber .timeline-dot {
  background: var(--amber);
}

.event-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  transition:
    border-color .2s var(--ease-soft),
    box-shadow .24s var(--ease-silk);
}

.event-card summary {
  min-height: 70px;
  padding: 14px 18px;
  display: grid;
  grid-template-columns: 96px 1fr auto 20px;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  list-style: none;
  transition: background-color .2s var(--ease-soft);
}

.event-card summary:hover,
.event-card[open] summary {
  background: var(--green-bg);
}

.event-card[open] {
  border-color: rgb(85 118 107 / 46%);
  box-shadow: 0 10px 26px rgb(37 49 45 / 7%);
}

.event-card summary::-webkit-details-marker {
  display: none;
}

.event-role {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.event-title {
  display: grid;
  gap: 5px;
}

.event-title strong {
  font-size: 14px;
}

.event-title small {
  color: var(--muted);
}

.interval-chip {
  background: var(--surface);
  color: var(--muted);
  font-size: 10px;
}

.summary-chevron {
  color: var(--green);
  font-size: 18px;
  transition: transform .2s ease;
}

.event-card[open] .summary-chevron {
  transform: rotate(180deg);
}

.event-body {
  padding: 18px;
  border-top: 1px solid var(--line);
  background: #faf8f1;
  animation: content-unfold .26s var(--ease-silk) both;
}

.event-body dl {
  margin: 0;
  display: grid;
  gap: 9px;
}

.event-body dl div {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 12px;
  font-size: 12px;
}

.event-body dt {
  color: var(--muted);
}

.event-body dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.event-links {
  margin-top: 18px;
  display: flex;
  gap: 18px;
  align-items: center;
  font-size: 12px;
  font-weight: 800;
}

.primary-link {
  padding: 10px 14px;
  border-radius: 9px;
  background: var(--green);
  color: white;
}

.primary-link:hover {
  text-decoration: none;
  background: var(--green-dark);
}

.missing-link {
  color: var(--copper);
}

.weekly-shell {
  background:
    radial-gradient(circle at 92% 2%, rgb(127 136 107 / 10%), transparent 28rem),
    transparent;
}

.weekly-query-card,
.weekly-main {
  width: 100%;
  max-width: 1900px;
  margin-right: auto;
  margin-left: auto;
}

.weekly-query-card {
  min-height: 82px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--card);
  box-shadow: 0 10px 32px rgb(37 49 45 / 5%);
}

.weekly-query-card > div,
.weekly-query-card label,
.weekly-query-actions {
  display: flex;
  align-items: center;
}

.weekly-query-card > div {
  gap: 12px;
}

.weekly-query-card > div > span {
  color: var(--muted);
}

.weekly-query-card label {
  gap: 9px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.weekly-query-card input {
  min-height: 44px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  color: var(--ink);
  outline: none;
  transition: border-color .18s var(--ease-soft), box-shadow .2s var(--ease-soft);
}

.weekly-query-card input:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgb(85 118 107 / 12%);
}

.weekly-query-actions {
  justify-content: flex-end;
  gap: 8px;
}

.weekly-query-actions .primary-small {
  min-width: 112px;
}

.weekly-main {
  margin-top: 16px;
  display: grid;
  gap: 16px;
}

.weekly-summary-card {
  padding: 24px 26px;
  display: grid;
  grid-template-columns: minmax(220px, .65fr) minmax(320px, 1.6fr) auto;
  align-items: center;
  gap: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(115deg, var(--card), #f3f1e7);
  animation: surface-rise .3s var(--ease-silk) both;
}

.weekly-summary-card h2 {
  margin: 0;
  font-size: clamp(18px, 1.65vw, 21px);
  white-space: nowrap;
}

.weekly-summary-card > p {
  margin: 0;
  line-height: 1.8;
}

.weekly-summary-card > span {
  max-width: 170px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.6;
  text-align: right;
}

.weekly-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
}

.weekly-metrics article {
  position: relative;
  min-height: 116px;
  padding: 18px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--card);
  animation: surface-rise .3s var(--ease-silk) both;
  transition: border-color .2s var(--ease-soft), box-shadow .24s var(--ease-silk), transform .24s var(--ease-silk);
}

.weekly-metrics article:nth-child(2) { animation-delay: 35ms; }
.weekly-metrics article:nth-child(3) { animation-delay: 70ms; }
.weekly-metrics article:nth-child(4) { animation-delay: 105ms; }
.weekly-metrics article:nth-child(5) { animation-delay: 140ms; }

.weekly-metrics article:hover {
  border-color: rgb(85 118 107 / 42%);
  box-shadow: 0 10px 26px rgb(37 49 45 / 7%);
  transform: translateY(-2px);
}

.weekly-metrics span {
  align-self: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.weekly-metrics strong {
  grid-row: span 2;
  align-self: center;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 500;
}

.weekly-metrics small {
  color: var(--muted);
  font-size: 10px;
}

.weekly-metrics article > i {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--green) var(--weekly-progress), #e4e2d9 var(--weekly-progress));
}

.weekly-time-section {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
  animation: surface-rise .34s var(--ease-silk) both;
}

.weekly-time-header {
  padding: 20px 22px;
  display: grid;
  grid-template-columns: minmax(230px, .65fr) minmax(520px, 1.35fr);
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--line);
}

.weekly-time-header h2,
.weekly-time-card h3 {
  margin: 0;
}

.weekly-time-header > div:first-child > span,
.weekly-time-card header p,
.weekly-time-note {
  color: var(--muted);
}

.weekly-time-header > div:first-child > span {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.5;
}

.weekly-span-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  gap: 8px;
}

.weekly-span-kpis article {
  min-height: 72px;
  padding: 11px 12px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px 8px;
  border: 1px solid #e4e1d7;
  border-radius: 13px;
  background: var(--surface);
}

.weekly-span-kpis span,
.weekly-span-kpis small {
  color: var(--muted);
  font-size: 9px;
}

.weekly-span-kpis strong {
  grid-row: span 2;
  align-self: center;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-weight: 500;
}

.weekly-time-grid {
  padding: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.weekly-time-card {
  min-width: 0;
  padding: 18px 18px 10px;
  border: 1px solid #e4e1d7;
  border-radius: 15px;
  background: #fffefa;
}

.weekly-time-card > header {
  min-height: 52px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.weekly-time-card h3 {
  font-size: 14px;
}

.weekly-time-card header p {
  margin: 5px 0 0;
  font-size: 9px;
  line-height: 1.5;
}

.weekly-time-legend {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 9px;
  white-space: nowrap;
}

.weekly-time-legend span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.weekly-time-legend i {
  width: 11px;
  height: 11px;
  display: inline-block;
  border-radius: 3px;
}

.weekly-time-legend i.submitted {
  background: var(--copper);
}

.weekly-time-legend i.approved {
  border: 1.5px solid var(--green);
  background: var(--green-bg);
}

.weekly-time-legend i.line {
  width: 16px;
  height: 0;
  border-radius: 0;
  background: transparent;
}

.weekly-time-legend i.line.submitted {
  border-top: 2px solid var(--green);
}

.weekly-time-legend i.line.approved {
  border: 0;
  border-top: 2px dashed var(--amber);
}

.weekly-time-chart-scroll {
  width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #c6c3b9 transparent;
}

.weekly-chart-swipe-hint {
  display: none;
}

.weekly-time-chart {
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}

.weekly-time-chart .chart-grid line {
  stroke: #e2dfd5;
  stroke-width: 1;
}

.weekly-time-chart .chart-grid text,
.weekly-time-chart .chart-date,
.weekly-time-chart .chart-value,
.weekly-time-chart .chart-end-label {
  fill: var(--muted);
  font-family: "Microsoft YaHei UI", "PingFang SC", sans-serif;
  font-size: 8px;
}

.weekly-time-chart .chart-grid text {
  text-anchor: end;
}

.weekly-time-chart .chart-date,
.weekly-time-chart .chart-value {
  text-anchor: middle;
}

.weekly-time-chart .chart-value {
  fill: var(--ink);
  font-size: 8px;
  font-weight: 700;
}

.volume-submitted {
  fill: var(--copper);
}

.volume-approved {
  fill: var(--green-bg);
  stroke: var(--green);
  stroke-width: 1.5;
}

.cumulative-submitted,
.cumulative-approved {
  fill: none;
  stroke-linejoin: round;
  stroke-linecap: round;
  stroke-width: 2.5;
}

.cumulative-submitted {
  stroke: var(--green);
}

.cumulative-approved {
  stroke: var(--amber);
  stroke-dasharray: 6 5;
}

.cumulative-submitted-point {
  fill: var(--green);
  stroke: white;
  stroke-width: 1.5;
}

.cumulative-approved-point {
  fill: var(--card);
  stroke: var(--amber);
  stroke-width: 2;
}

.weekly-time-chart .chart-end-label {
  font-size: 9px;
  font-weight: 800;
}

.weekly-time-chart .chart-end-label.submitted {
  fill: var(--green-dark);
}

.weekly-time-chart .chart-end-label.approved {
  fill: #94662d;
}

.weekly-time-note {
  margin: 0;
  padding: 0 22px 16px;
  font-size: 9px;
  line-height: 1.6;
}

.weekly-list-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
}

.weekly-list-header {
  min-height: 68px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
}

.weekly-tabs {
  display: flex;
  gap: 7px;
}

.weekly-tabs button,
.weekly-copy-button {
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.weekly-tabs button {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.weekly-tabs button strong {
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #e8e6dc;
  color: var(--muted);
  font-size: 10px;
}

.weekly-tabs button.is-active {
  border-color: var(--green);
  background: var(--green);
  color: white;
  box-shadow: 0 7px 18px rgb(85 118 107 / 16%);
}

.weekly-tabs button.is-active strong {
  background: rgb(255 255 255 / 18%);
  color: white;
}

.weekly-copy-button:hover {
  border-color: var(--green);
  background: var(--green-bg);
  color: var(--green-dark);
}

.weekly-list-status {
  min-height: 38px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: #f7f5ee;
  color: var(--muted);
  font-size: 11px;
}

.weekly-list-status.is-success {
  color: var(--green-dark);
  font-weight: 800;
}

.weekly-groups {
  padding: 14px;
  display: grid;
  gap: 12px;
  background: #f4f2ea;
}

.weekly-group {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--card);
  animation: content-unfold .28s var(--ease-silk) both;
}

.weekly-group > header {
  min-height: 46px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, var(--green-bg), var(--card) 62%);
}

.weekly-group > header > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.weekly-group > header span {
  font-size: 13px;
  font-weight: 900;
}

.weekly-group > header small {
  color: var(--muted);
  font-size: 10px;
}

.weekly-table-scroll {
  overflow-x: auto;
}

.weekly-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  table-layout: fixed;
}

.weekly-table th,
.weekly-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgb(216 213 202 / 72%);
  text-align: left;
  vertical-align: middle;
  font-size: 11px;
}

.weekly-table th {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.weekly-table th:nth-child(1) { width: 64px; }
.weekly-table th:nth-child(2) { width: 78px; }
.weekly-table th:nth-child(3) { width: 250px; }
.weekly-table th:nth-child(5) { width: 100px; }

.weekly-table tbody tr:last-child td {
  border-bottom: 0;
}

.weekly-table tbody tr {
  transition: background-color .18s var(--ease-soft);
}

.weekly-table tbody tr:hover {
  background: #f7f7f1;
}

.weekly-table td button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--green-dark);
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  text-align: left;
}

.weekly-table td button:hover {
  text-decoration: underline;
}

.weekly-remark {
  display: inline-flex;
  min-height: 25px;
  padding: 0 9px;
  align-items: center;
  border-radius: 999px;
  background: var(--olive-bg);
  color: #697151;
  font-size: 10px;
  font-weight: 900;
}

.weekly-loading,
.weekly-empty,
.weekly-no-rows {
  min-height: 280px;
  padding: 36px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
  color: var(--muted);
  text-align: center;
}

.weekly-loading strong,
.weekly-empty strong,
.weekly-no-rows strong {
  color: var(--ink);
}

.weekly-loading small,
.weekly-no-rows span {
  font-size: 11px;
}

.weekly-spinner {
  width: 34px;
  height: 34px;
  margin-bottom: 8px;
  border: 3px solid var(--green-bg);
  border-top-color: var(--green);
  border-radius: 50%;
  animation: weekly-spin .75s linear infinite;
}

.weekly-empty p {
  margin: 0;
}

.weekly-empty button {
  min-height: 38px;
  margin-top: 8px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: var(--green);
  color: white;
  cursor: pointer;
  font-weight: 800;
}

.analytics-entry-button {
  border-color: rgb(85 118 107 / 38%);
  background: var(--green);
  color: white;
  box-shadow: 0 7px 20px rgb(85 118 107 / 14%);
}

.analytics-entry-button:hover {
  border-color: var(--green-dark);
  background: var(--green-dark);
  color: white;
}

.insights-full-button {
  min-height: 68px;
  margin: 12px 14px 0;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid rgb(85 118 107 / 32%);
  border-radius: 13px;
  background: linear-gradient(115deg, var(--green-bg), #f4f1e7);
  color: var(--green-dark);
  cursor: pointer;
  text-align: left;
}

.insights-full-button:hover {
  border-color: var(--green);
  box-shadow: 0 8px 22px rgb(85 118 107 / 10%);
  transform: translateY(-1px);
}

.insights-full-button > span {
  display: grid;
  gap: 3px;
}

.insights-full-button strong {
  font-size: 12px;
}

.insights-full-button small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
}

.insights-full-button i {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-style: normal;
}

.analytics-shell {
  background:
    radial-gradient(circle at 92% 0%, rgb(85 118 107 / 11%), transparent 34rem),
    radial-gradient(circle at 4% 20%, rgb(181 107 77 / 7%), transparent 30rem);
}

.analytics-main {
  width: 100%;
  max-width: 1900px;
  margin: 0 auto;
  display: grid;
  gap: 16px;
}

.analytics-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(140px, 1fr));
  gap: 11px;
}

.analytics-kpi {
  position: relative;
  min-height: 126px;
  padding: 18px;
  overflow: hidden;
  display: grid;
  align-content: space-between;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--card);
  box-shadow: 0 8px 26px rgb(37 49 45 / 4%);
  animation: surface-rise .34s var(--ease-silk) both;
  transition: border-color .2s var(--ease-soft), box-shadow .24s var(--ease-silk), transform .24s var(--ease-silk);
}

.analytics-kpi::after {
  content: "";
  position: absolute;
  right: -18px;
  bottom: -26px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--green-bg);
  opacity: .62;
}

.analytics-kpi:nth-child(2) { animation-delay: 35ms; }
.analytics-kpi:nth-child(3) { animation-delay: 70ms; }
.analytics-kpi:nth-child(4) { animation-delay: 105ms; }
.analytics-kpi:nth-child(5) { animation-delay: 140ms; }
.analytics-kpi:nth-child(6) { animation-delay: 175ms; }

.analytics-kpi:hover {
  border-color: rgb(85 118 107 / 40%);
  box-shadow: 0 12px 30px rgb(37 49 45 / 7%);
  transform: translateY(-2px);
}

.analytics-kpi.tone-copper::after { background: var(--copper-bg); }
.analytics-kpi.tone-olive::after { background: var(--olive-bg); }
.analytics-kpi.tone-amber::after { background: var(--amber-bg); }

.analytics-kpi span,
.analytics-kpi small {
  position: relative;
  z-index: 1;
  color: var(--muted);
}

.analytics-kpi span {
  font-size: 11px;
  font-weight: 800;
}

.analytics-kpi strong {
  position: relative;
  z-index: 1;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(30px, 2.4vw, 40px);
  font-weight: 500;
  line-height: 1;
}

.analytics-kpi small {
  max-width: 150px;
  font-size: 9px;
  line-height: 1.45;
}

.analytics-card {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--card);
  box-shadow: 0 8px 28px rgb(37 49 45 / 4%);
  animation: surface-rise .34s var(--ease-silk) both;
}

.analytics-section-header,
.analytics-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
}

.analytics-section-header h2,
.analytics-card-header h3 {
  margin: 0;
  letter-spacing: -.02em;
}

.analytics-section-header h2 {
  font-size: 20px;
}

.analytics-card-header h3 {
  font-size: 15px;
}

.analytics-section-header > div:first-child > span,
.analytics-card-header p,
.analytics-card-header > small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.55;
}

.analytics-section-header > div:first-child > span {
  display: block;
  margin-top: 5px;
}

.analytics-card-header p {
  margin: 5px 0 0;
}

.analytics-section-metrics {
  display: flex;
  align-items: center;
  gap: 8px;
}

.analytics-section-metrics span {
  min-width: 118px;
  min-height: 58px;
  padding: 9px 12px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 6px;
  border-radius: 12px;
  background: var(--surface);
  color: var(--muted);
  font-size: 9px;
}

.analytics-section-metrics strong,
.analytics-card-header > strong {
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  font-weight: 500;
}

.analytics-trend-scroll {
  width: 100%;
  margin-top: 18px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #c6c3b9 transparent;
}

.analytics-chart-swipe-hint {
  display: none;
}

.analytics-trend-chart {
  min-width: 860px;
  height: 280px;
  padding: 18px 12px 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(50px, 1fr));
  gap: 11px;
  align-items: end;
  border-bottom: 1px solid var(--line);
  background: repeating-linear-gradient(to top, transparent 0 54px, rgb(216 213 202 / 52%) 54px 55px);
}

.analytics-week {
  height: 100%;
  min-width: 0;
  display: grid;
  grid-template-rows: 18px 1fr 18px 23px;
  align-items: end;
  justify-items: center;
}

.analytics-week > strong,
.analytics-week > small,
.analytics-week > span {
  color: var(--muted);
  font-size: 9px;
}

.analytics-week > strong {
  color: var(--ink);
  font-weight: 800;
}

.analytics-week > small {
  align-self: center;
  font-size: 8px;
}

.analytics-week > span {
  align-self: center;
}

.analytics-week-bar {
  width: min(34px, 72%);
  min-height: 2px;
  display: flex;
  overflow: hidden;
  flex-direction: column-reverse;
  border-radius: 7px 7px 2px 2px;
  background: #e5e2d8;
  box-shadow: inset 0 0 0 1px rgb(37 49 45 / 3%);
  transition: filter .2s var(--ease-soft), transform .22s var(--ease-silk);
}

.analytics-week:hover .analytics-week-bar {
  filter: saturate(1.12);
  transform: scaleX(1.06);
}

.analytics-week-bar i {
  width: 100%;
  min-height: 1px;
}

.analytics-week-bar .tone-copper,
.analytics-chart-legend .tone-copper { background: var(--copper); }
.analytics-week-bar .tone-green,
.analytics-chart-legend .tone-green { background: var(--green); }
.analytics-week-bar .tone-olive,
.analytics-chart-legend .tone-olive { background: var(--olive); }
.analytics-week-bar .tone-amber,
.analytics-chart-legend .tone-amber { background: var(--amber); }

.analytics-chart-legend {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 15px;
  color: var(--muted);
  font-size: 9px;
}

.analytics-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.analytics-chart-legend i {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 3px;
}

.analytics-diagnostic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.analytics-diagnostic-grid .analytics-card {
  min-height: 250px;
}

.analytics-diagnostic-grid .holder-visual,
.analytics-diagnostic-grid .insight-bars {
  margin-top: 22px;
}

.analytics-diagnostic-grid .holder-visual {
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 12px;
}

.analytics-diagnostic-grid .donut {
  width: 104px;
  height: 104px;
  padding: 16px;
}

.analytics-diagnostic-grid .insight-bar-row {
  grid-template-columns: 76px minmax(0, 1fr) 30px;
}

.analytics-card-header > small {
  align-self: center;
}

.analytics-quality-grid {
  margin-top: 22px;
  display: grid;
  gap: 10px;
}

.analytics-quality-grid > div {
  padding: 11px 12px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 10px;
  border-radius: 12px;
  background: var(--surface);
}

.analytics-quality-grid span,
.analytics-quality-grid small {
  color: var(--muted);
  font-size: 9px;
}

.analytics-quality-grid strong {
  grid-row: span 2;
  align-self: center;
  color: var(--green-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 500;
}

.analytics-discipline-section {
  padding: 0;
  overflow: hidden;
}

.analytics-discipline-section > .analytics-section-header {
  padding: 22px;
  border-bottom: 1px solid var(--line);
}

.analytics-table-scroll {
  width: 100%;
  overflow-x: auto;
}

.analytics-table {
  width: 100%;
  min-width: 930px;
  border-collapse: collapse;
}

.analytics-table th,
.analytics-table td {
  padding: 13px 16px;
  border-bottom: 1px solid rgb(216 213 202 / 72%);
  text-align: left;
  font-size: 11px;
}

.analytics-table th {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}

.analytics-table tbody tr:last-child td {
  border-bottom: 0;
}

.analytics-table tbody tr {
  transition: background-color .18s var(--ease-soft);
}

.analytics-table tbody tr:hover {
  background: #f8f7f1;
}

.discipline-load {
  min-width: 130px;
  display: grid;
  grid-template-columns: minmax(74px, 1fr) 28px;
  align-items: center;
  gap: 8px;
}

.discipline-load::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  height: 7px;
  border-radius: 99px;
  background: #ebe8df;
}

.discipline-load i {
  grid-column: 1;
  grid-row: 1;
  height: 7px;
  border-radius: 99px;
  background: var(--olive);
}

.discipline-load strong {
  text-align: right;
}

.analytics-followup-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
  gap: 12px;
  align-items: stretch;
}

.analytics-longest-card {
  grid-row: span 2;
}

.analytics-followup-card {
  padding: 0;
  overflow: hidden;
}

.analytics-followup-card > .analytics-card-header {
  min-height: 83px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.analytics-followup-list {
  display: grid;
}

.analytics-followup-list button {
  width: 100%;
  min-height: 64px;
  padding: 11px 16px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) minmax(120px, auto) 12px;
  align-items: center;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid rgb(216 213 202 / 65%);
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.analytics-followup-list button:last-child {
  border-bottom: 0;
}

.analytics-followup-list button:hover {
  background: var(--green-bg);
}

.analytics-rank {
  color: var(--muted);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 15px;
}

.analytics-document-copy,
.analytics-document-context {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.analytics-document-copy strong,
.analytics-document-copy small,
.analytics-document-context small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analytics-document-copy strong {
  color: var(--green-dark);
  font-size: 10px;
}

.analytics-document-copy small,
.analytics-document-context small {
  color: var(--muted);
  font-size: 9px;
}

.analytics-document-context {
  text-align: right;
}

.analytics-document-context strong {
  font-size: 11px;
}

.analytics-followup-list button > i {
  color: var(--green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
  font-style: normal;
}

.analytics-empty {
  min-height: 100px;
  padding: 24px;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 11px;
}

.analytics-method-note {
  padding: 14px 17px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgb(255 253 248 / 72%);
  color: var(--muted);
  font-size: 10px;
  line-height: 1.65;
}

.analytics-method-note strong {
  flex: 0 0 auto;
  color: var(--ink);
}

@keyframes weekly-spin {
  to { transform: rotate(360deg); }
}

@keyframes surface-rise {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.995);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes content-unfold {
  from {
    opacity: 0;
    transform: translateY(-8px);
    clip-path: inset(0 0 18% 0);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
  }
}

@keyframes backdrop-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (max-width: 1750px) {
  .dashboard-layout,
  .dashboard-layout.is-insights-open {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-insights {
    position: fixed;
    z-index: 60;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, calc(100% - 24px));
    max-height: none;
    display: flex;
    flex-direction: column;
    border-radius: 22px 0 0 22px;
    transform: translateX(105%);
    transition: transform .22s ease;
  }

  .dashboard-layout.is-insights-open .dashboard-insights {
    transform: translateX(0);
    animation: none;
  }

  .insights-backdrop {
    position: fixed;
    z-index: 55;
    inset: 0;
    border: 0;
    background: rgb(37 49 45 / 34%);
    cursor: default;
  }

  .dashboard-layout.is-insights-open .insights-backdrop {
    display: block;
    animation: backdrop-fade .22s var(--ease-soft) both;
  }
}

@media (max-width: 1100px) {
  .analytics-kpis {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .analytics-diagnostic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analytics-followup-grid {
    grid-template-columns: 1fr;
  }

  .analytics-longest-card {
    grid-row: auto;
  }

  .metric-strip {
    grid-template-columns: repeat(3, 1fr);
  }

  .weekly-metrics {
    grid-template-columns: repeat(3, 1fr);
  }

  .weekly-summary-card {
    grid-template-columns: 1fr 2fr;
  }

  .weekly-summary-card > span {
    grid-column: 1 / -1;
    max-width: none;
    text-align: left;
  }

  .weekly-time-header {
    grid-template-columns: 1fr;
  }

  .weekly-time-grid {
    grid-template-columns: 1fr;
  }

  .filter-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .inline-timeline {
    overflow-x: auto;
    grid-template-columns: repeat(var(--event-count), minmax(180px, 1fr));
  }
}

@media (max-width: 760px) {
  body {
    background: var(--surface);
  }

  .app-shell {
    padding: calc(84px + env(safe-area-inset-top)) 16px 32px;
  }

  .app-header {
    display: block;
    margin-bottom: 16px;
  }

  .app-header h1 {
    font-size: 27px;
  }

  .header-copy {
    font-size: 11px;
  }

  .header-actions {
    justify-content: flex-start;
    margin-top: 14px;
  }

  .header-actions .icon-button,
  .header-actions .text-button {
    display: none;
  }

  .weekly-query-card {
    padding: 15px;
    align-items: stretch;
    flex-direction: column;
  }

  .weekly-query-card > div:first-child {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
  }

  .weekly-query-card label {
    min-width: 0;
    align-items: stretch;
    flex-direction: column;
    gap: 6px;
  }

  .weekly-query-card input {
    width: 100%;
    min-height: 46px;
  }

  .weekly-query-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .weekly-query-actions button {
    min-height: 44px;
  }

  .weekly-summary-card {
    padding: 20px;
    display: block;
  }

  .weekly-summary-card h2 {
    font-size: 18px;
    white-space: normal;
  }

  .weekly-summary-card > p {
    margin-top: 14px;
    font-size: 12px;
  }

  .weekly-summary-card > span {
    display: block;
    margin-top: 12px;
  }

  .weekly-metrics {
    margin-right: -16px;
    padding-right: 16px;
    overflow-x: auto;
    grid-template-columns: repeat(5, 142px);
    scrollbar-width: none;
  }

  .weekly-metrics article {
    min-height: 104px;
    padding: 15px;
  }

  .weekly-metrics strong {
    font-size: 28px;
  }

  .weekly-time-header {
    padding: 18px;
  }

  .weekly-span-kpis {
    margin-right: -18px;
    padding-right: 18px;
    overflow-x: auto;
    grid-template-columns: repeat(4, 122px);
    scrollbar-width: none;
  }

  .weekly-time-grid {
    padding: 10px;
  }

  .weekly-time-card {
    padding: 16px 12px 8px;
  }

  .weekly-time-card > header {
    min-height: 74px;
    display: block;
  }

  .weekly-time-legend {
    margin-top: 9px;
  }

  .weekly-chart-swipe-hint {
    margin: -5px 0 5px;
    display: block;
    color: var(--muted);
    font-size: 9px;
    text-align: right;
  }

  .weekly-time-chart {
    width: 650px;
  }

  .weekly-time-note {
    padding: 0 18px 15px;
  }

  .weekly-list-header {
    align-items: stretch;
    flex-direction: column;
  }

  .weekly-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .weekly-tabs button {
    justify-content: center;
    gap: 6px;
    padding-inline: 10px;
  }

  .weekly-copy-button {
    display: none;
  }

  .weekly-groups {
    padding: 10px;
  }

  .weekly-table-scroll {
    overflow: visible;
  }

  .weekly-table {
    min-width: 0;
    display: block;
  }

  .weekly-table thead {
    display: none;
  }

  .weekly-table tbody {
    display: grid;
  }

  .weekly-table tr {
    padding: 14px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    border-bottom: 1px solid var(--line);
  }

  .weekly-table tr:last-child {
    border-bottom: 0;
  }

  .weekly-table td {
    padding: 0;
    display: block;
    border: 0;
    font-size: 11px;
  }

  .weekly-table td::before {
    content: attr(data-label);
    margin-right: 7px;
    color: var(--muted);
    font-size: 9px;
  }

  .weekly-table td:nth-child(1) {
    grid-column: 2;
    grid-row: 1;
    color: var(--muted);
    text-align: right;
  }

  .weekly-table td:nth-child(2) {
    grid-column: 1;
    grid-row: 1;
  }

  .weekly-table td:nth-child(3),
  .weekly-table td:nth-child(4) {
    grid-column: 1 / -1;
  }

  .weekly-table td:nth-child(3) {
    margin-top: 4px;
  }

  .weekly-table td:nth-child(4) {
    color: var(--ink);
    font-size: 12px;
    line-height: 1.5;
  }

  .weekly-table td:nth-child(5) {
    grid-column: 1 / -1;
  }

  .metric-strip {
    margin-right: -16px;
    padding-right: 16px;
    overflow-x: auto;
    grid-template-columns: repeat(5, 116px);
    scrollbar-width: none;
  }

  .metric-card {
    min-height: 82px;
    padding: 13px;
  }

  .metric-card strong {
    font-size: 25px;
  }

  .metric-card small {
    display: none;
  }

  .ledger {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .ledger-toolbar {
    padding: 16px 0;
    grid-template-columns: 1fr auto;
    background: transparent;
  }

  .ledger-toolbar > div {
    display: none;
  }

  .search-field {
    min-height: 48px;
    background: var(--card);
  }

  .filter-button {
    min-height: 48px;
  }

  .filter-panel {
    position: fixed;
    z-index: 30;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 78vh;
    padding: 22px 18px calc(22px + env(safe-area-inset-bottom));
    overflow-y: auto;
    border: 1px solid var(--line);
    border-radius: 22px 22px 0 0;
    box-shadow: 0 -18px 50px rgb(37 49 45 / 18%);
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(100% + 18px));
    visibility: hidden;
    transition:
      opacity .22s var(--ease-soft),
      transform .34s var(--ease-silk),
      visibility 0s linear .34s;
  }

  .filter-panel.is-open {
    max-height: 78vh;
    padding: 22px 18px calc(22px + env(safe-area-inset-bottom));
    overflow-y: auto;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
    transition-delay: 0s;
  }

  .filter-grid {
    grid-template-columns: 1fr 1fr;
  }

  .filter-grid > label:last-child {
    grid-column: 1 / -1;
  }

  .multi-filter.is-open {
    grid-column: 1 / -1;
  }

  .multi-filter-menu {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    max-height: 0;
    padding: 0 8px;
    border-width: 0;
    box-shadow: none;
    opacity: 0;
    transform: translateY(-5px);
    transition:
      max-height .3s var(--ease-silk),
      margin .28s var(--ease-silk),
      padding .28s var(--ease-silk),
      opacity .18s var(--ease-soft),
      transform .28s var(--ease-silk),
      visibility 0s linear .28s;
  }

  .multi-filter.is-open .multi-filter-menu {
    max-height: 310px;
    margin-top: 1px;
    padding: 8px;
    border-width: 1px;
    box-shadow: 0 12px 30px rgb(37 49 45 / 10%);
    opacity: 1;
    transform: translateY(0);
  }

  .ledger-table {
    overflow: visible;
  }

  .table-head {
    display: none;
  }

  .ledger-row {
    min-width: 0;
    margin-bottom: 12px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 15px;
  }

  .row-main {
    min-width: 0;
    min-height: 150px;
    padding: 16px;
    grid-template-columns: 1fr auto;
    gap: 7px 12px;
    align-content: start;
  }

  .row-main .cell {
    display: none;
  }

  .row-main .document-number,
  .row-main .document-title,
  .row-main .holder-cell,
  .row-main .stay-cell,
  .row-main .cell:nth-child(7),
  .row-main .expand-label {
    display: block;
  }

  .row-main .document-number {
    padding-top: 2px;
    font-size: 12px;
  }

  .row-main .document-title {
    grid-column: 1 / -1;
    margin: 6px 0 15px;
    font-size: 14px;
    white-space: normal;
  }

  .row-main .holder-cell {
    grid-column: 1;
    grid-row: 3;
  }

  .row-main .stay-cell {
    grid-column: 2;
    grid-row: 3;
    color: var(--copper);
    font-weight: 800;
    text-align: right;
  }

  .row-main .cell:nth-child(7) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  .row-main .expand-label {
    grid-column: 1 / -1;
    margin-top: 10px;
    text-align: right;
  }

  .row-expanded {
    padding: 16px;
  }

  .expanded-heading {
    align-items: flex-start;
  }

  .expanded-heading h3,
  .attention-chip {
    display: none;
  }

  .inline-timeline {
    display: block;
    overflow: visible;
    padding-left: 18px;
    border-left: 2px solid var(--green);
  }

  .preview-event {
    margin-bottom: 10px;
  }

  .preview-event::after {
    content: "";
    position: absolute;
    top: 24px;
    left: -26px;
    width: 12px;
    height: 12px;
    border: 3px solid var(--surface);
    border-radius: 50%;
    background: var(--green);
  }

  .preview-event i {
    display: none;
  }

  .mobile-actions {
    position: fixed;
    z-index: 70;
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    padding: calc(7px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) 7px calc(8px + env(safe-area-inset-left));
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border: 1px solid var(--line);
    border-width: 0 0 1px;
    border-radius: 0 0 18px 18px;
    background: rgb(255 253 248 / 94%);
    box-shadow: 0 12px 32px rgb(37 49 45 / 16%);
    backdrop-filter: blur(16px);
  }

  .mobile-actions button {
    min-height: 48px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .mobile-actions strong {
    color: var(--green-dark);
    font-size: 12px;
  }

  .mobile-actions span {
    color: var(--muted);
    font-size: 9px;
  }

  .weekly-mobile-actions {
    grid-template-columns: repeat(5, 1fr);
  }

  .analytics-mobile-actions {
    grid-template-columns: repeat(4, 1fr);
  }

  .analytics-kpis {
    margin-right: -16px;
    padding-right: 16px;
    overflow-x: auto;
    grid-template-columns: repeat(6, 148px);
    scrollbar-width: none;
  }

  .analytics-kpi {
    min-height: 112px;
    padding: 16px;
  }

  .analytics-kpi strong {
    font-size: 31px;
  }

  .analytics-card {
    padding: 18px;
  }

  .analytics-section-header {
    display: block;
  }

  .analytics-section-metrics {
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .analytics-section-metrics span {
    min-width: 0;
  }

  .analytics-trend-section {
    padding-right: 0;
  }

  .analytics-trend-section > .analytics-section-header,
  .analytics-trend-section > .analytics-chart-legend {
    margin-right: 18px;
  }

  .analytics-chart-swipe-hint {
    margin: 12px 18px -6px 0;
    display: block;
    color: var(--muted);
    font-size: 9px;
    text-align: right;
  }

  .analytics-trend-chart {
    min-width: 780px;
    height: 250px;
  }

  .analytics-chart-legend {
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: wrap;
  }

  .analytics-diagnostic-grid {
    grid-template-columns: 1fr;
  }

  .analytics-diagnostic-grid .analytics-card {
    min-height: 0;
  }

  .analytics-diagnostic-grid .holder-visual {
    max-width: 420px;
  }

  .analytics-discipline-section {
    padding: 0;
  }

  .analytics-discipline-section > .analytics-section-header {
    padding: 18px;
  }

  .analytics-table-scroll {
    overflow: visible;
  }

  .analytics-table {
    min-width: 0;
    display: block;
  }

  .analytics-table thead {
    display: none;
  }

  .analytics-table tbody {
    padding: 8px;
    display: grid;
    gap: 8px;
  }

  .analytics-table tr {
    padding: 14px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px 16px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface);
  }

  .analytics-table td {
    padding: 0;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px;
    border: 0;
    text-align: right;
  }

  .analytics-table td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 9px;
    text-align: left;
  }

  .analytics-table td:first-child,
  .analytics-table td:nth-child(4) {
    grid-column: 1 / -1;
  }

  .analytics-table td:first-child {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
    text-align: left;
  }

  .analytics-table td:first-child::before {
    display: none;
  }

  .analytics-table td:nth-child(4) {
    grid-template-columns: 76px 1fr;
    align-items: center;
  }

  .discipline-load {
    min-width: 0;
  }

  .analytics-followup-card > .analytics-card-header {
    min-height: 78px;
    padding: 17px;
  }

  .analytics-followup-list button {
    padding: 12px 14px;
    grid-template-columns: 20px minmax(0, 1fr) 12px;
  }

  .analytics-document-context {
    grid-column: 2;
    text-align: left;
  }

  .analytics-followup-list button > i {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .analytics-method-note {
    display: grid;
    gap: 4px;
  }

  .login-card {
    padding: 34px 24px;
  }

  .code-field {
    grid-template-columns: 1fr;
  }

  .code-field button {
    min-height: 48px;
  }

  .detail-header {
    min-height: 60px;
    padding: 0 16px;
  }

  .detail-main {
    width: calc(100% - 32px);
    padding: 28px 0 70px;
  }

  .detail-hero {
    display: block;
  }

  .detail-hero h1 {
    font-size: 21px;
    overflow-wrap: anywhere;
  }

  .detail-title {
    font-size: 15px;
  }

  .detail-status {
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .attention-summary {
    display: grid;
    gap: 5px;
  }

  .detail-controls {
    top: 60px;
    display: block;
    overflow-x: auto;
  }

  .detail-controls > span {
    display: none;
  }

  .detail-chips {
    width: max-content;
    flex-wrap: nowrap;
  }

  .full-timeline::before {
    left: 24px;
  }

  .timeline-entry {
    grid-template-columns: 40px 1fr;
    gap: 20px;
  }

  .timeline-rail {
    padding-top: 18px;
    writing-mode: vertical-rl;
    text-align: left;
  }

  .timeline-dot {
    top: 21px;
    left: 17px;
  }

  .event-card summary {
    min-height: 82px;
    padding: 13px;
    grid-template-columns: 1fr 20px;
    gap: 6px 10px;
  }

  .event-role {
    grid-column: 1;
  }

  .event-title {
    grid-column: 1;
  }

  .interval-chip {
    grid-column: 1;
    width: fit-content;
  }

  .summary-chevron {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
  }

  .event-body dl div {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  .event-links {
    align-items: stretch;
    flex-direction: column;
  }

  .dashboard-insights {
    width: 100%;
    border: 0;
    border-radius: 0;
  }

  .insights-header {
    padding-top: calc(20px + env(safe-area-inset-top));
  }

  .insights-scroll {
    padding-bottom: calc(24px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 640px) {
  .loading-frame {
    width: 88vw;
    height: 54vh;
  }

  .loading-stage {
    width: min(92vw, 460px);
  }

  .loading-kicker {
    font-size: 7px;
    letter-spacing: .22em;
  }

  .loading-wordmark {
    font-size: clamp(58px, 22vw, 86px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }

  .entry-curtain {
    display: none !important;
  }

  .loading-frame > i {
    transform: none !important;
  }

  .loading-kicker,
  .loading-wordmark > span,
  .loading-copy h1,
  .loading-copy > p:last-child,
  .loading-progress,
  .loading-phases {
    opacity: 1 !important;
    transform: none !important;
  }

  .loading-rule {
    width: min(220px, 54vw) !important;
  }

  .loading-scan {
    display: none !important;
  }
}

/* Integrated TUY assistant */
.dashboard-assistant-launcher {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 89;
  min-height: 46px;
  padding: 6px 14px 6px 7px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid color-mix(in srgb, var(--green) 58%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--green-dark) 92%, #101915);
  color: #fff;
  box-shadow: 0 13px 34px rgba(19, 28, 24, .2);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.dashboard-assistant-launcher:hover { transform: translateY(-2px); box-shadow: 0 16px 42px rgba(19, 28, 24, .27); }
.dashboard-assistant-launcher.is-open { opacity: 0; pointer-events: none; }
.dashboard-assistant-launcher span,
.dashboard-assistant-mark {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 6px;
  background: color-mix(in srgb, var(--green) 28%, #fff);
  color: var(--green-dark);
  font-size: 11px;
  font-weight: 900;
}
.assistant-pixel-avatar {
  position: relative;
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: end center;
  flex: 0 0 auto;
  overflow: visible;
  border: 0;
  border-radius: 7px;
  background: color-mix(in srgb, var(--green-bg) 78%, transparent);
  isolation: isolate;
}
.assistant-pixel-avatar::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: 7px;
  bottom: 3px;
  left: 7px;
  height: 4px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--green-dark) 16%, transparent);
  filter: blur(2px);
  opacity: .48;
}
.assistant-pixel-avatar img {
  width: 40px;
  height: 40px;
  display: block;
  object-fit: contain;
  object-position: center bottom;
  image-rendering: pixelated;
  user-select: none;
  transform-origin: 50% 96%;
  animation: assistant-pixel-idle 3.2s steps(2, end) infinite;
}
.dashboard-assistant-mark.assistant-pixel-avatar {
  width: 42px;
  height: 42px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--green) 16%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--green) 18%, var(--line));
}
.dashboard-assistant-avatar.assistant-pixel-avatar {
  width: 34px;
  height: 34px;
  border: 0;
  background: color-mix(in srgb, var(--green-bg) 76%, transparent);
}
.dashboard-assistant-avatar.assistant-pixel-avatar img {
  width: 34px;
  height: 34px;
}
.assistant-pixel-avatar.is-thinking img { animation: assistant-pixel-thinking .92s steps(4, end) infinite; }
.assistant-pixel-avatar.is-speaking img { animation: assistant-pixel-speaking .62s steps(3, end) infinite; }
.dashboard-assistant-launcher strong { font-size: 11px; letter-spacing: .02em; }
.dashboard-assistant-backdrop {
  position: fixed;
  inset: 0;
  z-index: 89;
  border: 0;
  background: rgba(16, 21, 19, .2);
  backdrop-filter: blur(2px);
  cursor: default;
}
.dashboard-assistant-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  width: min(510px, calc(100vw - 28px));
  border-left: 1px solid var(--line-strong);
  background: var(--card);
  box-shadow: -24px 0 70px rgba(21, 27, 24, .18);
  transform: translateX(100%);
  transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
.dashboard-assistant-drawer.is-open { transform: translateX(0); }
.dashboard-assistant-surface {
  min-width: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--green-bg) 42%, transparent), transparent 180px),
    var(--card);
}
.dashboard-assistant-header {
  min-height: 72px;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 92%, transparent);
  backdrop-filter: blur(14px);
}
.dashboard-assistant-header > div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dashboard-assistant-header strong,
.dashboard-assistant-header small { display: block; }
.dashboard-assistant-header strong { color: var(--ink); font-size: 13px; }
.dashboard-assistant-header small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.dashboard-assistant-header > div:last-child { justify-content: flex-end; gap: 6px; }
.dashboard-assistant-header button,
.assistant-action-list button,
.assistant-export-list button,
.dashboard-assistant-prompts button {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--green-dark);
  cursor: pointer;
  font-size: 9px;
  font-weight: 750;
}
.dashboard-assistant-header button:hover,
.assistant-action-list button:hover,
.assistant-export-list button:hover,
.dashboard-assistant-prompts button:hover { border-color: var(--green); background: var(--green-bg); }
.dashboard-assistant-header .assistant-mode-toggle {
  min-width: 86px;
  padding: 0 8px 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  color: var(--muted);
}
.assistant-mode-toggle > i {
  position: relative;
  width: 27px;
  height: 16px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--line-strong);
  transition: background .2s var(--ease-soft);
}
.assistant-mode-toggle > i::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--card);
  box-shadow: 0 1px 4px rgb(37 49 45 / 22%);
  transition: transform .22s var(--ease-silk);
}
.dashboard-assistant-header .assistant-mode-toggle.is-on {
  border-color: color-mix(in srgb, var(--green) 48%, var(--line));
  background: var(--green-bg);
  color: var(--green-dark);
}
.assistant-mode-toggle.is-on > i { background: var(--green); }
.assistant-mode-toggle.is-on > i::after { transform: translateX(11px); }
.assistant-mode-toggle > span { white-space: nowrap; }
.dashboard-assistant-prompts {
  padding: 10px 14px;
  display: flex;
  gap: 7px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.dashboard-assistant-prompts::-webkit-scrollbar { display: none; }
.dashboard-assistant-prompts button { flex: 0 0 auto; white-space: nowrap; }
.dashboard-assistant-conversation {
  min-height: 0;
  padding: 18px 16px 28px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.dashboard-assistant-message {
  margin: 0 0 18px;
  display: flex;
  align-items: flex-start;
  gap: 9px;
}
.dashboard-assistant-message.is-user { flex-direction: row-reverse; }
.dashboard-assistant-avatar {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--green-bg);
  color: var(--green-dark);
  font-size: 8px;
  font-weight: 900;
}
.dashboard-assistant-message.is-user .dashboard-assistant-avatar { background: var(--green-dark); color: #fff; }
.dashboard-assistant-bubble {
  min-width: 0;
  max-width: calc(100% - 38px);
  padding: 12px 13px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 5px 16px rgba(25, 31, 28, .045);
}
.dashboard-assistant-message.is-user .dashboard-assistant-bubble {
  max-width: 86%;
  border-color: color-mix(in srgb, var(--green-dark) 82%, var(--line));
  background: var(--green-dark);
  color: #fff;
}
.assistant-message-copy { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.75; }
.assistant-message-copy:empty::after {
  content: '';
  width: 5px;
  height: 14px;
  display: inline-block;
  background: var(--green);
  animation: assistant-caret .7s steps(1) infinite;
}
.assistant-message-meta { margin-top: 7px; display: block; color: var(--quiet); font-size: 8px; text-align: right; }
.dashboard-assistant-message.is-user .assistant-message-meta { color: rgba(255, 255, 255, .58); }
.assistant-thinking { min-height: 30px; display: flex; align-items: center; gap: 5px; color: var(--muted); }
.assistant-thinking span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--green);
  animation: assistant-dot 1.1s ease-in-out infinite;
}
.assistant-thinking span:nth-child(2) { animation-delay: .14s; }
.assistant-thinking span:nth-child(3) { animation-delay: .28s; }
.assistant-thinking i { margin-left: 5px; font-size: 9px; font-style: normal; }
.assistant-result-list { margin-top: 11px; display: grid; gap: 6px; }
.assistant-result-list > button {
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: color-mix(in srgb, var(--card) 88%, var(--green-bg));
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}
.assistant-result-list > button:hover { border-color: var(--green); transform: translateY(-1px); }
.assistant-result-list span,
.assistant-result-list strong,
.assistant-result-list small { min-width: 0; display: block; }
.assistant-result-list strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.assistant-result-list small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.assistant-result-list i { color: var(--green-dark); font-size: 8px; font-style: normal; }
.assistant-action-list,
.assistant-export-list { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; }
.assistant-action-list button { border-color: color-mix(in srgb, var(--green) 55%, var(--line)); background: var(--green-bg); }
.assistant-export-list button { color: var(--muted); }
.dashboard-assistant-composer {
  padding: 12px 14px max(12px, env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 9px;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 94%, transparent);
  backdrop-filter: blur(14px);
}
.dashboard-assistant-composer textarea {
  width: 100%;
  min-height: 46px;
  max-height: 150px;
  padding: 13px 14px;
  resize: vertical;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  outline: none;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: 11px;
  line-height: 1.55;
}
.dashboard-assistant-composer textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 13%, transparent); }
.dashboard-assistant-composer button {
  min-width: 60px;
  min-height: 46px;
  padding: 0 13px;
  border: 0;
  border-radius: 8px;
  background: var(--green-dark);
  color: #fff;
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
}
.dashboard-assistant-composer button:disabled,
.dashboard-assistant-composer textarea:disabled { opacity: .58; cursor: wait; }
.assistant-page-shell { min-height: 100vh; }
.assistant-page-main {
  width: min(1500px, calc(100% - 40px));
  height: calc(100dvh - 174px);
  min-height: 480px;
  margin: 18px auto 24px;
}
.dashboard-assistant-surface.is-module {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 18px 52px rgba(22, 28, 25, .08);
}
.dashboard-assistant-surface.is-module .dashboard-assistant-conversation { padding: 28px clamp(20px, 8vw, 130px); }
.dashboard-assistant-surface.is-module .dashboard-assistant-message { max-width: 1120px; margin-left: auto; margin-right: auto; }
.dashboard-assistant-surface.is-module .dashboard-assistant-bubble { max-width: min(880px, calc(100% - 38px)); }
.dashboard-assistant-surface.is-module .dashboard-assistant-message.is-user .dashboard-assistant-bubble { max-width: min(680px, 80%); }
.dashboard-assistant-surface.is-module .dashboard-assistant-composer { padding-left: clamp(20px, 8vw, 130px); padding-right: clamp(20px, 8vw, 130px); }
.assistant-focus-banner {
  margin: 0 0 12px;
  padding: 10px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid color-mix(in srgb, var(--green) 48%, var(--line));
  border-radius: 7px;
  background: var(--green-bg);
  color: var(--green-dark);
  font-size: 10px;
  font-weight: 750;
}
.assistant-focus-banner button { border: 0; background: transparent; color: inherit; cursor: pointer; font-size: 9px; font-weight: 800; text-decoration: underline; }
@keyframes assistant-dot { 0%, 60%, 100% { transform: translateY(0); opacity: .35; } 30% { transform: translateY(-4px); opacity: 1; } }
@keyframes assistant-caret { 50% { opacity: 0; } }
@keyframes assistant-pixel-idle {
  0%, 100% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-1px) scaleY(1.018); }
}
@keyframes assistant-pixel-thinking {
  0%, 100% { transform: translate(0, 0) rotate(0); }
  25% { transform: translate(-1px, -2px) rotate(-2deg); }
  50% { transform: translate(0, -1px) rotate(0); }
  75% { transform: translate(1px, -2px) rotate(2deg); }
}
@keyframes assistant-pixel-speaking {
  0%, 100% { transform: translateY(0) scale(1); }
  40% { transform: translateY(-3px) scale(1.025); }
  70% { transform: translateY(-1px) scale(.99, 1.02); }
}

/* Independent instrument + assistant docking workspace. */
.dashboard-workspace {
  --workspace-side-size: clamp(280px, 22vw, 420px);
  --workspace-horizontal-size: clamp(300px, 38dvh, 380px);
  width: 100%;
  height: 100dvh;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: 56px minmax(0, 1fr);
  overflow: hidden;
  background: var(--bg);
}
.workspace-layout-bar {
  position: relative;
  z-index: 10;
  min-width: 0;
  padding: 0 12px 0 18px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line-strong);
  background: color-mix(in srgb, var(--card) 94%, transparent);
  box-shadow: 0 8px 24px rgb(37 49 45 / 5%);
  backdrop-filter: blur(18px);
}
.workspace-layout-summary,
.workspace-command-strip {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.workspace-command-strip {
  justify-content: flex-end;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  white-space: nowrap;
}
.workspace-command-strip > * { flex: 0 0 auto; }
.workspace-layout-summary strong {
  margin-right: 2px;
  font-size: 11px;
}
.workspace-layout-summary span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
}
.workspace-command {
  min-height: 32px;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
  font-size: 10px;
  font-weight: 900;
}
.workspace-command:hover {
  border-color: var(--green);
  background: var(--green-bg);
  color: var(--green-dark);
}
.workspace-command:disabled { opacity: .55; cursor: wait; }
.workspace-command.is-active {
  border-color: color-mix(in srgb, var(--green) 72%, var(--line));
  background: var(--green-dark);
  color: #fff;
}
.workspace-command.is-instrument-toggle {
  border-color: color-mix(in srgb, var(--green) 58%, var(--line));
}
.workspace-settings-command {
  flex: 0 0 auto;
  border-color: var(--green);
  background: var(--green-bg);
  color: var(--green-dark);
}
.workspace-command.is-logout { border-color: transparent; background: transparent; color: var(--muted); }
.workspace-layout-bar .source-status,
.workspace-layout-bar .freshness { min-height: 32px; }
.workspace-layout-bar .freshness { padding-inline: 10px; font-size: 9px; }
.dashboard-workspace .workspace-main-host .app-header .header-actions,
.dashboard-workspace .workspace-main-host .detail-header-actions { display: none; }
.workspace-stage {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
}
.workspace-stage:has(> .workspace-dock-zone.is-top:not(:empty)):has(> .workspace-dock-zone.is-bottom:not(:empty)) {
  --workspace-horizontal-size: clamp(230px, 30dvh, 300px);
}
.workspace-stage:has(.workspace-dock-zone.is-left:not(:empty)):has(.workspace-dock-zone.is-right:not(:empty)) {
  --workspace-side-size: clamp(244px, 19vw, 300px);
}
.workspace-middle {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  overflow: hidden;
}
.workspace-middle > .workspace-dock-zone.is-left { grid-column: 1; }
.workspace-middle > .workspace-main-host { grid-column: 2; }
.workspace-middle > .workspace-dock-zone.is-right { grid-column: 3; }
.workspace-main-host {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  container-name: workspace-main;
  container-type: inline-size;
}
.workspace-main-host > .app-shell,
.workspace-main-host > .detail-shell {
  width: 100%;
  min-width: 0;
}
.workspace-dock-zone {
  min-width: 0;
  min-height: 0;
  display: grid;
  overflow: hidden;
  background: var(--surface);
}
.workspace-dock-zone:empty { display: none; }
.workspace-dock-zone.is-left,
.workspace-dock-zone.is-right {
  width: var(--workspace-side-size);
  grid-auto-flow: row;
  grid-auto-rows: minmax(0, 1fr);
}
.workspace-dock-zone.is-left { border-right: 1px solid var(--line-strong); }
.workspace-dock-zone.is-right { border-left: 1px solid var(--line-strong); }
.workspace-dock-zone.is-top,
.workspace-dock-zone.is-bottom {
  height: var(--workspace-horizontal-size);
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
}
.workspace-dock-zone.is-top { border-bottom: 1px solid var(--line-strong); }
.workspace-dock-zone.is-bottom { border-top: 1px solid var(--line-strong); }
.workspace-tool-panel {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--card);
  container-name: workspace-tool;
  container-type: inline-size;
}
.workspace-dock-zone.is-left > .workspace-tool-panel + .workspace-tool-panel,
.workspace-dock-zone.is-right > .workspace-tool-panel + .workspace-tool-panel { border-top: 1px solid var(--line-strong); }
.workspace-dock-zone.is-top > .workspace-tool-panel + .workspace-tool-panel,
.workspace-dock-zone.is-bottom > .workspace-tool-panel + .workspace-tool-panel { border-left: 1px solid var(--line-strong); }
.workspace-tool-panel .dashboard-insights {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  max-height: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: var(--surface);
  box-shadow: none;
  transform: none;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .dashboard-insights {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header {
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  padding: 15px 14px 8px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  border-right: 1px solid var(--line);
  border-bottom: 0;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header h2 {
  margin-top: 2px;
  font-size: 20px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header > div > span {
  margin-top: 4px;
  font-size: 9px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-close {
  width: 30px;
  height: 30px;
  border-radius: 7px;
  font-size: 17px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button {
  grid-column: 1;
  grid-row: 2;
  min-height: 50px;
  margin: 0 10px 10px;
  padding: 9px 10px;
  border-radius: 7px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button strong { font-size: 10px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button small {
  max-width: 132px;
  overflow: hidden;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button i { font-size: 17px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-scroll {
  grid-column: 2;
  grid-row: 1 / -1;
  padding: 14px;
  grid-auto-flow: column;
  grid-auto-columns: clamp(300px, 26vw, 390px);
  align-items: stretch;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 14px;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-scroll > * {
  min-width: 0;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-snap-align: start;
  scrollbar-width: thin;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-kpis {
  min-width: 390px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-kpis article {
  min-height: 0;
  padding: 12px;
  gap: 2px 7px;
  border-radius: 8px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-kpis strong { font-size: 25px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-kpis small {
  overflow: hidden;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-section {
  padding: 14px;
  border-radius: 8px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-title {
  margin-bottom: 8px;
  gap: 8px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-title span { font-size: 12px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-title small,
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .coverage-section p { font-size: 9px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .weekly-chart {
  height: calc(100% - 55px);
  min-height: 86px;
  padding-top: 5px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .chart-legend {
  max-height: 20px;
  margin-top: 5px;
  overflow: hidden;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .holder-visual {
  height: calc(100% - 36px);
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 10px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .donut {
  width: 82px;
  height: 82px;
  padding: 13px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .donut strong { font-size: 18px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-bars { gap: 6px; }
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-bar-row {
  grid-template-columns: 82px minmax(0, 1fr) 28px;
  gap: 6px;
  font-size: 9px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-pair {
  min-width: 278px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-pair article {
  min-height: 0;
  padding: 11px;
  border-radius: 8px;
}
.workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .coverage-section p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.dashboard-assistant-surface.is-dock { height: 100%; }
.dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-prompts {
  max-height: 124px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(42px, auto);
  align-items: stretch;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
}
.dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-prompts button {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  height: auto;
  padding-block: 8px;
  line-height: 1.35;
  white-space: normal;
}
.dashboard-assistant-surface.is-dock-horizontal {
  grid-template-columns: minmax(205px, 238px) minmax(320px, 1fr) minmax(260px, 318px);
  grid-template-rows: minmax(76px, auto) minmax(0, 1fr);
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header {
  grid-column: 1;
  grid-row: 1 / -1;
  min-height: 0;
  padding: 13px 12px;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-between;
  border-right: 1px solid var(--line);
  border-bottom: 0;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header > div:first-child {
  align-items: flex-start;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header > div:last-child {
  justify-content: flex-start;
  flex-wrap: wrap;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header button {
  min-height: 28px;
  padding-inline: 8px;
  font-size: 8px;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts {
  grid-column: 2;
  grid-row: 1;
  padding: 5px 10px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-auto-rows: minmax(32px, auto);
  align-items: stretch;
  overflow-x: hidden;
  overflow-y: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: thin;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts button {
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding-inline: 9px;
  line-height: 1.3;
  white-space: normal;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-conversation {
  grid-column: 2;
  grid-row: 2;
  padding: 11px 13px 16px;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer {
  grid-column: 3;
  grid-row: 1 / -1;
  padding: 12px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(76px, 1fr) auto;
  border-top: 0;
  border-left: 1px solid var(--line);
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer textarea {
  height: 100%;
  min-height: 76px;
  max-height: none;
  resize: none;
}
.dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer button {
  width: 100%;
  min-height: 40px;
}

@container workspace-tool (max-width: 860px) {
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .dashboard-insights {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 50px minmax(0, 1fr);
  }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header {
    grid-column: 1;
    grid-row: 1;
    padding: 8px 154px 8px 11px;
    flex-direction: row;
    align-items: center;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header .eyebrow { display: none; }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header h2 { margin: 0; font-size: 13px; }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-header > div > span { margin-top: 2px; }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-close {
    position: absolute;
    top: 9px;
    right: 10px;
    z-index: 2;
    width: 31px;
    height: 31px;
  }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button {
    position: absolute;
    top: 9px;
    right: 48px;
    z-index: 2;
    grid-column: auto;
    grid-row: auto;
    width: 96px;
    min-height: 31px;
    margin: 0;
    padding: 0 9px;
  }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button small,
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-full-button i { display: none; }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insights-scroll {
    grid-column: 1;
    grid-row: 2;
    grid-auto-columns: minmax(280px, 88%);
  }
  .workspace-tool-panel.is-instrument:is(.dock-top, .dock-bottom) .insight-kpis { min-width: 340px; }

  .dashboard-assistant-surface.is-dock-horizontal {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 52px minmax(74px, auto) minmax(0, 1fr) 58px;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    padding: 7px 9px;
    flex-direction: row;
    align-items: center;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header > div:first-child { align-items: center; }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header > div:last-child {
    justify-content: flex-end;
    flex-wrap: nowrap;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header [data-assistant-clear] { display: none; }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts {
    grid-column: 1;
    grid-row: 2;
    display: grid;
    padding: 7px 9px;
    border-bottom: 1px solid var(--line);
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-conversation {
    grid-column: 1;
    grid-row: 3;
    padding: 9px 10px 13px;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer {
    grid-column: 1;
    grid-row: 4;
    padding: 6px 8px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto;
    border-top: 1px solid var(--line);
    border-left: 0;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer textarea {
    height: auto;
    min-height: 44px;
    max-height: 44px;
    padding: 10px 11px;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer button {
    width: auto;
    min-width: 54px;
    min-height: 44px;
  }
}

@container workspace-tool (max-width: 310px) {
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-header {
    padding: 10px 11px;
    align-items: stretch;
    flex-direction: column;
  }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-header > div:last-child {
    justify-content: flex-start;
  }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-header [data-assistant-clear] { display: none; }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-prompts { padding-inline: 10px; }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-conversation { padding-inline: 11px; }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-composer { padding-inline: 9px; }
}

/* Main views respond to the space left after docking, not only to the browser width. */
@container workspace-main (max-width: 1100px) {
  .analytics-kpis { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .analytics-diagnostic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-followup-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-longest-card { grid-row: auto; }
  .metric-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .weekly-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .weekly-time-header,
  .weekly-time-grid { grid-template-columns: minmax(0, 1fr); }
  .filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@container workspace-main (max-width: 780px) {
  .app-shell,
  .detail-shell { padding-inline: 18px; }
  .app-header {
    display: block;
    margin-bottom: 18px;
  }
  .header-actions {
    margin-top: 13px;
    justify-content: flex-start;
  }
  .analytics-kpis,
  .metric-strip,
  .weekly-metrics,
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-diagnostic-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-section-header,
  .analytics-card-header {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }
  .analytics-section-metrics {
    width: 100%;
    padding-bottom: 3px;
    overflow-x: auto;
  }
  .analytics-section-metrics span { min-width: 108px; }
  .analytics-card { padding: 17px; border-radius: 10px; }
  .analytics-discipline-section { padding: 0; }
  .analytics-followup-list button {
    grid-template-columns: 22px minmax(0, 1fr) minmax(88px, auto) 10px;
    gap: 7px;
  }
  .weekly-summary-card { grid-template-columns: minmax(0, 1fr); }
  .weekly-summary-card > span { grid-column: 1; max-width: none; text-align: left; }
}

@container workspace-main (max-width: 500px) {
  .app-shell,
  .detail-shell { padding-inline: 13px; }
  .analytics-kpis { gap: 8px; }
  .analytics-kpi { min-height: 108px; padding: 14px; }
  .analytics-kpi strong { font-size: 27px; }
  .metric-strip,
  .weekly-metrics,
  .filter-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-followup-list button {
    grid-template-columns: 20px minmax(0, 1fr) 10px;
  }
  .analytics-followup-list .analytics-document-context { display: none; }
}

.assistant-dock-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.assistant-dock-choice {
  min-width: 0;
  min-height: 64px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}
.assistant-dock-choice > i {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: var(--green-dark);
  font-size: 15px;
  font-style: normal;
}
.assistant-dock-choice span,
.assistant-dock-choice strong,
.assistant-dock-choice small { min-width: 0; display: block; }
.assistant-dock-choice strong { font-size: 10px; }
.assistant-dock-choice small { margin-top: 3px; color: var(--quiet); font-size: 8px; }
.assistant-dock-choice.is-active {
  border-color: var(--green);
  background: var(--green-bg);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--green) 28%, transparent);
}
.assistant-dock-choice.is-active > i { border-color: var(--green); background: var(--card); }

@media (max-width: 900px) {
  .dashboard-workspace { height: 100dvh; }
  .workspace-stage { display: flex; flex-direction: column; overflow-y: auto; }
  .workspace-middle { display: contents; }
  .workspace-main-host { min-height: max(520px, 68dvh); flex: 0 0 auto; overflow: auto; }
  .workspace-dock-zone.is-left,
  .workspace-dock-zone.is-right,
  .workspace-dock-zone.is-top,
  .workspace-dock-zone.is-bottom {
    width: 100%;
    height: auto;
    flex: 0 0 auto;
    grid-auto-flow: row;
    grid-auto-rows: clamp(310px, 46dvh, 380px);
    border: 0;
    border-bottom: 1px solid var(--line-strong);
  }
  .workspace-dock-zone.is-right,
  .workspace-dock-zone.is-bottom { border-top: 1px solid var(--line-strong); border-bottom: 0; }
  .workspace-dock-zone > .workspace-tool-panel + .workspace-tool-panel { border-top: 1px solid var(--line-strong); border-left: 0; }
  .workspace-tool-panel.is-instrument .insights-scroll {
    grid-auto-flow: row;
    grid-auto-columns: auto;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .workspace-tool-panel.is-instrument .insight-kpis { min-width: 0; }
  .dashboard-assistant-surface.is-dock-horizontal {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 54px 39px minmax(0, 1fr) 62px;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header,
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts,
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-conversation,
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer {
    grid-column: 1;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header {
    grid-row: 1;
    padding: 7px 10px;
    flex-direction: row;
    align-items: center;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header > div:last-child { flex-wrap: nowrap; }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-header [data-assistant-clear] { display: none; }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts {
    grid-row: 2;
    padding: 8px 12px;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-prompts button {
    width: auto;
    min-height: 32px;
    white-space: nowrap;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-conversation { grid-row: 3; padding: 14px 12px 20px; }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer {
    grid-row: 4;
    padding: 7px 9px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto;
    border-top: 1px solid var(--line);
    border-left: 0;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer textarea {
    height: auto;
    min-height: 46px;
    max-height: 46px;
    resize: none;
  }
  .dashboard-assistant-surface.is-dock-horizontal .dashboard-assistant-composer button {
    width: auto;
    min-height: 46px;
  }

  /* Only the assistant remains fixed at the bottom on phones. An instrument
     sharing the same dock stays in document flow so neither tool is clipped. */
  .dashboard-workspace[data-assistant-dock="bottom"] {
    --mobile-bottom-tool-size: clamp(300px, 44dvh, 370px);
  }
  .dashboard-workspace[data-assistant-dock="bottom"] .workspace-stage {
    position: relative;
    padding-bottom: calc(var(--mobile-bottom-tool-size) + env(safe-area-inset-bottom));
  }
  .dashboard-workspace[data-assistant-dock="bottom"] .workspace-dock-zone.is-bottom:not(:empty) {
    position: static;
    width: 100%;
    height: auto;
    max-height: none;
    overflow: visible;
    border-top: 1px solid var(--line-strong);
    background: var(--card);
    box-shadow: none;
  }
  .dashboard-workspace[data-assistant-dock="bottom"] .workspace-dock-zone.is-bottom[data-panel-count="1"]:has(> .workspace-tool-panel.is-assistant) {
    height: 0;
    min-height: 0;
    border: 0;
  }
  .dashboard-workspace[data-assistant-dock="bottom"] .workspace-dock-zone.is-bottom > .workspace-tool-panel.is-instrument {
    grid-row: 1;
  }
  .dashboard-workspace[data-assistant-dock="bottom"] .workspace-dock-zone.is-bottom > .workspace-tool-panel.is-assistant {
    position: fixed;
    z-index: 20;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--mobile-bottom-tool-size);
    min-height: 0;
    overflow: hidden;
    border-top: 1px solid var(--line-strong);
    background: var(--card);
    box-shadow: 0 -16px 38px rgb(22 28 25 / 13%);
  }
}

@media (max-width: 760px) {
  .dashboard-workspace { grid-template-rows: 50px minmax(0, 1fr); }
  .workspace-layout-bar { padding-inline: 8px; grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px; }
  .workspace-layout-summary strong { font-size: 10px; }
  .workspace-layout-summary span { display: none; }
  .workspace-command-strip { gap: 5px; }
  .workspace-command { min-height: 30px; padding-inline: 9px; font-size: 9px; }
  .workspace-layout-bar .source-status { width: auto; min-height: 30px; padding-inline: 8px; }
  .workspace-layout-bar .source-status > span { display: inline; }
  .workspace-layout-bar .freshness { display: none; }
  .dashboard-assistant-launcher { right: 12px; bottom: calc(76px + env(safe-area-inset-bottom)); }
  .dashboard-assistant-backdrop { display: none; }
  .dashboard-assistant-drawer { left: 0; right: 0; width: auto; border-left: 0; }
  .dashboard-assistant-header { min-height: 64px; padding: 10px 12px; }
  .dashboard-assistant-header [data-assistant-clear] { display: none; }
  .dashboard-assistant-prompts { padding: 8px 12px; }
  .dashboard-assistant-conversation { padding: 14px 11px 22px; }
  .dashboard-assistant-bubble { max-width: calc(100% - 34px); }
  .dashboard-assistant-composer { padding: 9px 10px max(9px, env(safe-area-inset-bottom)); }
  .assistant-page-shell { min-height: 100dvh; padding: 0 !important; overflow: hidden; }
  .assistant-page-header {
    min-height: 76px;
    margin-bottom: 0;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  .assistant-page-header .eyebrow,
  .assistant-page-header .header-copy,
  .assistant-page-header .header-actions { display: none; }
  .assistant-page-header h1 { margin: 0; font-size: 24px; }
  .assistant-page-main { width: 100%; height: calc(100dvh - 76px); min-height: 0; margin: 0; }
  .dashboard-assistant-surface.is-module { border: 0; border-radius: 0; box-shadow: none; }
  .dashboard-assistant-surface.is-module .dashboard-assistant-conversation { padding: 16px 11px 22px; }
  .dashboard-assistant-surface.is-module .dashboard-assistant-composer { padding-left: 10px; padding-right: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-assistant-drawer,
  .dashboard-assistant-launcher,
  .assistant-result-list > button { transition: none; }
  .assistant-thinking span,
  .assistant-message-copy:empty::after,
  .assistant-pixel-avatar img { animation: none; opacity: 1; }
}

/* 2026-08-04 fine-tuning: holder semantics, appearance settings and interactive analytics */
.source-status {
  min-height: 30px;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.source-status > i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--source-ok);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--source-ok) 14%, transparent);
}

.source-status.is-refreshing > i {
  background: var(--source-refreshing);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--source-refreshing) 14%, transparent);
  animation: source-pulse 1.2s ease-in-out infinite;
}

.source-status.is-offline > i {
  background: var(--source-offline);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--source-offline) 14%, transparent);
}

.account-role-badge {
  min-height: 30px;
  padding: 5px 9px 5px 6px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.account-role-badge > i {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 8px;
  font-style: normal;
}
.account-role-badge.is-admin { border-color: color-mix(in srgb, var(--green) 42%, var(--line)); color: var(--green-dark); }
.account-role-badge.is-admin > i { background: var(--green-bg); color: var(--green-dark); }

@keyframes source-pulse {
  50% { opacity: .42; transform: scale(.8); }
}

.holder-pill {
  max-width: 100%;
  min-height: 25px;
  padding: 4px 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--holder-color) 20%, transparent);
  border-radius: 999px;
  background: var(--holder-bg);
  color: var(--holder-color);
  font-size: 9px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.holder-pill > i:first-child {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--holder-color);
}

.holder-pill.is-unassigned { --holder-color: var(--stone); --holder-bg: var(--stone-bg); }
.holder-pill.is-design { --holder-color: var(--copper); --holder-bg: var(--copper-bg); }
.holder-pill.is-review { --holder-color: var(--green-dark); --holder-bg: var(--green-bg); }
.holder-pill.is-owner { --holder-color: var(--amber); --holder-bg: var(--amber-bg); }
.holder-pill.is-precomplete { --holder-color: var(--olive); --holder-bg: var(--olive-bg); }
.holder-pill.is-complete { --holder-color: var(--green-dark); --holder-bg: var(--green-bg); }
.holder-pill.is-hold { --holder-color: var(--mauve); --holder-bg: var(--mauve-bg); }

.detail-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.settings-backdrop,
.week-detail-backdrop,
.planning-list-backdrop {
  position: fixed;
  z-index: 80;
  inset: 0;
  border: 0;
  background: rgb(28 25 20 / 28%);
  backdrop-filter: blur(2px);
  animation: veil-in .2s var(--ease-soft) both;
}

.settings-panel,
.week-detail-drawer,
.planning-list-drawer {
  position: fixed;
  z-index: 81;
  top: 14px;
  right: 14px;
  bottom: 14px;
  width: min(410px, calc(100vw - 28px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
  box-shadow: 0 24px 70px rgb(22 20 15 / 24%);
  animation: drawer-in .32s var(--ease-silk) both;
}

.settings-panel > header,
.week-detail-drawer > header,
.planning-list-drawer > header {
  position: sticky;
  z-index: 3;
  top: 0;
  padding: 20px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 92%, transparent);
  backdrop-filter: blur(14px);
}

.settings-panel h2,
.week-detail-drawer h2,
.planning-list-drawer h2 {
  margin: 0;
  font-size: 20px;
}

.settings-panel > header > button,
.week-detail-drawer > header > button,
.planning-list-drawer > header > button {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  cursor: pointer;
  color: var(--muted);
  font-size: 20px;
}

.settings-panel > section {
  padding: 20px;
  border-bottom: 1px solid var(--line);
}

.settings-label {
  display: block;
  margin-bottom: 11px;
  font-size: 11px;
}

.theme-options,
.palette-presets {
  display: grid;
  gap: 8px;
}

.theme-options { grid-template-columns: repeat(3, 1fr); }
.palette-presets { grid-template-columns: repeat(4, 1fr); }

.theme-option,
.palette-choice {
  min-width: 0;
  min-height: 42px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  cursor: pointer;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.theme-option:hover,
.palette-choice:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.theme-option.is-active,
.palette-choice.is-active { border-color: var(--green); background: var(--green-bg); color: var(--green-dark); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 12%, transparent); }

.palette-choice > i {
  height: 17px;
  margin-bottom: 6px;
  display: flex;
  overflow: hidden;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--swatch-soft) 0 33%, var(--swatch) 33% 67%, var(--swatch-dark) 67%);
}

.custom-color-row {
  margin-top: 10px;
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.custom-color-row input { width: 38px; height: 30px; padding: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--card); cursor: pointer; }
.custom-color-row output { min-width: 62px; font-family: Georgia, serif; text-align: right; }
.settings-help { margin: 10px 0 0; color: var(--quiet); font-size: 9px; line-height: 1.55; }
.settings-panel footer { padding: 16px 20px; color: var(--muted); font-size: 9px; line-height: 1.55; }

.account-role-summary {
  min-height: 52px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.account-role-summary span,
.account-role-summary strong,
.account-role-summary small { display: block; }
.account-role-summary strong { font-size: 11px; }
.account-role-summary small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.account-role-summary i { color: var(--muted); font-size: 9px; font-style: normal; font-weight: 900; letter-spacing: 0; }
.account-role-summary.is-admin { border-color: color-mix(in srgb, var(--green) 48%, var(--line)); background: color-mix(in srgb, var(--green-bg) 36%, var(--surface)); }
.account-role-summary.is-admin i { color: var(--green-dark); }

.admin-entry-button {
  width: 100%;
  min-height: 58px;
  padding: 11px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.admin-entry-button:hover { border-color: var(--green); background: color-mix(in srgb, var(--green-bg) 46%, var(--surface)); }
.admin-entry-button span { min-width: 0; }
.admin-entry-button strong,
.admin-entry-button small { display: block; }
.admin-entry-button strong { font-size: 11px; }
.admin-entry-button small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.admin-entry-button i { flex: 0 0 auto; color: var(--green-dark); font-size: 10px; font-style: normal; font-weight: 800; }

.admin-fault-backdrop {
  position: fixed;
  z-index: 90;
  inset: 0;
  border: 0;
  background: rgb(20 22 19 / 48%);
  backdrop-filter: blur(5px);
  animation: veil-in .2s var(--ease-soft) both;
}

.admin-fault-panel {
  position: fixed;
  z-index: 91;
  top: 50%;
  left: 50%;
  width: min(720px, calc(100vw - 36px));
  max-height: min(82dvh, 760px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--card);
  box-shadow: 0 28px 90px rgb(14 17 14 / 34%);
  transform: translate(-50%, -50%);
  animation: admin-panel-in .28s var(--ease-silk) both;
}

.admin-fault-panel > header {
  min-height: 86px;
  padding: 18px 20px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 94%, transparent);
}

.admin-fault-panel > header h2 { margin: 2px 0 4px; font-size: 20px; }
.admin-fault-panel > header span { color: var(--muted); font-size: 9px; }
.admin-fault-panel > header > button {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  font-size: 20px;
}

.admin-fault-content { min-height: 190px; padding: 18px 20px; overflow: auto; }
.admin-login-form { max-width: 420px; margin: 18px auto; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.admin-login-form label { grid-column: 1 / -1; color: var(--muted); font-size: 10px; font-weight: 800; }
.admin-login-form input,
.fault-exclusion-form input {
  min-width: 0;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}
.admin-login-form button,
.fault-exclusion-form > button {
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid var(--green-dark);
  border-radius: 8px;
  background: var(--green-dark);
  color: white;
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
}
.admin-login-form button:disabled,
.fault-exclusion-form > button:disabled { opacity: .48; cursor: not-allowed; }
.admin-form-message { grid-column: 1 / -1; min-height: 18px; margin: 2px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.admin-form-message.is-error { color: var(--danger, #a5453d); }

.admin-tool-tabs { margin-bottom: 16px; display: flex; gap: 4px; border-bottom: 1px solid var(--line); }
.admin-tool-tabs button { min-height: 36px; padding: 7px 12px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); cursor: pointer; font-size: 10px; font-weight: 800; }
.admin-tool-tabs button.is-active { border-bottom-color: var(--green-dark); color: var(--ink); }
.correction-form { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(130px, .65fr) auto; align-items: end; gap: 10px; }
.correction-form label { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; }
.correction-form label.is-wide { grid-column: 1 / 3; }
.correction-form input,
.correction-form textarea { min-width: 0; min-height: 42px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; resize: vertical; }
.correction-form textarea { min-height: 64px; line-height: 1.5; }
.correction-form > button,
.correction-confirm-form button { min-height: 42px; padding: 9px 14px; border: 1px solid var(--green-dark); border-radius: 8px; background: var(--green-dark); color: #fff; cursor: pointer; font-size: 10px; font-weight: 800; }
.correction-preview { margin-top: 14px; padding: 14px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); }
.correction-preview > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.correction-preview > header div { min-width: 0; }
.correction-preview > header strong,
.correction-preview > header span { display: block; }
.correction-preview > header strong { font-size: 12px; }
.correction-preview > header span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.correction-preview > header b { flex: 0 0 auto; padding: 5px 7px; border: 1px solid color-mix(in srgb, var(--green) 40%, var(--line)); border-radius: 6px; background: var(--green-bg); color: var(--green-dark); font-size: 9px; }
.correction-target-list { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.correction-target { min-width: 0; min-height: 58px; padding: 9px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 7px; background: var(--card); }
.correction-target i { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--green-bg); color: var(--green-dark); font-style: normal; font-size: 11px; font-weight: 900; }
.correction-target.is-noop { opacity: .64; }
.correction-target strong,
.correction-target span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.correction-target strong { font-size: 9px; }
.correction-target span { margin-top: 3px; color: var(--muted); font-size: 8px; }
.correction-preview > p { margin: 11px 0 0; color: var(--quiet); font-size: 8px; line-height: 1.6; }
.correction-confirm-form { margin-top: 12px; padding-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); }
.correction-confirm-form label { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 9px; }
.correction-confirm-form input { accent-color: var(--green-dark); }
.correction-aligned { margin-top: 12px; padding: 9px; border-radius: 7px; background: var(--green-bg); color: var(--green-dark); text-align: center; font-size: 9px; font-weight: 800; }
.correction-history { margin-top: 18px; }
.correction-history h3 { margin: 0 0 8px; font-size: 10px; }
.correction-history > article { min-height: 66px; padding: 10px 11px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.correction-history > article + article { margin-top: 7px; }
.correction-history article div { min-width: 0; }
.correction-history article strong,
.correction-history article span,
.correction-history article small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.correction-history article strong { font-size: 10px; }
.correction-history article span { margin-top: 3px; color: var(--muted); font-size: 9px; }
.correction-history article small { margin-top: 3px; color: var(--quiet); font-size: 8px; }
.correction-history article > b { padding: 4px 6px; border-radius: 5px; background: var(--green-bg); color: var(--green-dark); font-size: 8px; }
.correction-history article > b.is-partial_failed,
.correction-history article > b.is-failed { background: color-mix(in srgb, #a5453d 12%, var(--surface)); color: #a5453d; }
.correction-history article > button { min-height: 30px; padding: 6px 8px; border: 1px solid var(--line-strong); border-radius: 7px; background: var(--card); color: var(--ink); cursor: pointer; font-size: 8px; font-weight: 800; }

.fault-exclusion-form { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr) auto; align-items: end; gap: 10px; }
.fault-exclusion-form label { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 9px; font-weight: 800; }
.fault-exclusion-list { margin-top: 14px; display: grid; gap: 7px; }
.fault-exclusion-item {
  min-height: 66px;
  padding: 10px 11px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.fault-exclusion-item div { min-width: 0; }
.fault-exclusion-item strong,
.fault-exclusion-item span,
.fault-exclusion-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fault-exclusion-item strong { font-size: 11px; }
.fault-exclusion-item span { margin-top: 3px; color: var(--muted); font-size: 9px; }
.fault-exclusion-item small { margin-top: 4px; color: var(--quiet); font-size: 8px; }
.fault-exclusion-item button,
.admin-fault-panel > footer button {
  min-height: 32px;
  padding: 7px 9px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--card);
  color: var(--ink);
  cursor: pointer;
  font-size: 9px;
  font-weight: 800;
}
.fault-exclusion-item button:hover { border-color: var(--green); color: var(--green-dark); }
.admin-fault-empty,
.admin-fault-status { min-height: 160px; display: grid; place-content: center; justify-items: center; gap: 7px; color: var(--muted); text-align: center; }
.admin-fault-empty strong,
.admin-fault-status strong { color: var(--ink); font-size: 12px; }
.admin-fault-empty span,
.admin-fault-status span { font-size: 9px; }
.admin-fault-status > i { width: 22px; height: 22px; border: 2px solid var(--line); border-top-color: var(--green); border-radius: 50%; animation: admin-spin .8s linear infinite; }
.admin-fault-status.is-error strong { color: var(--danger, #a5453d); }
.admin-fault-panel > footer { min-height: 52px; padding: 10px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 9px; }

@keyframes admin-spin { to { transform: rotate(360deg); } }
@keyframes admin-panel-in { from { opacity: 0; transform: translate(-50%, calc(-50% + 18px)) scale(.985); } }

@keyframes veil-in { from { opacity: 0; } }
@keyframes drawer-in { from { opacity: 0; transform: translateX(24px); } }

.analytics-kpis { grid-template-columns: repeat(7, minmax(130px, 1fr)); }
.analytics-kpi.tone-muted::after { background: var(--mauve-bg); }
.analytics-shell { background: radial-gradient(circle at 92% 0%, color-mix(in srgb, var(--green) 13%, transparent), transparent 34rem), radial-gradient(circle at 4% 20%, color-mix(in srgb, var(--copper) 7%, transparent), transparent 30rem); }

.analytics-week {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  border-radius: 9px 9px 0 0;
}

.analytics-week:hover,
.analytics-week.is-selected { background: color-mix(in srgb, var(--green-bg) 56%, transparent); }
.analytics-week:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

.week-detail-drawer { width: min(580px, calc(100vw - 28px)); }
.week-detail-drawer > header span { display: block; margin-top: 6px; color: var(--muted); font-size: 10px; }
.week-detail-summary { padding: 14px 20px; display: flex; gap: 7px; overflow-x: auto; border-bottom: 1px solid var(--line); }
.week-detail-summary > span { flex: 0 0 auto; padding: 7px 9px; display: inline-flex; align-items: center; gap: 5px; border-radius: 9px; background: var(--surface); color: var(--muted); font-size: 9px; }
.week-detail-summary i { width: 7px; height: 7px; border-radius: 3px; }
.week-detail-summary .tone-copper i { background: var(--copper); }
.week-detail-summary .tone-green i { background: var(--green); }
.week-detail-summary .tone-olive i { background: var(--olive); }
.week-detail-summary .tone-amber i { background: var(--amber); }
.week-detail-list { padding: 10px; display: grid; gap: 8px; }
.week-detail-list > button { padding: 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto 12px; gap: 9px 12px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); cursor: pointer; text-align: left; }
.week-detail-list > button:hover { border-color: var(--green); background: color-mix(in srgb, var(--green-bg) 48%, var(--surface)); transform: translateY(-1px); }
.week-detail-copy { min-width: 0; }
.week-detail-copy strong,
.week-detail-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.week-detail-copy strong { font-size: 11px; }
.week-detail-copy small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.week-detail-events { grid-column: 1 / -2; display: flex; gap: 5px; flex-wrap: wrap; }
.week-detail-events i { padding: 4px 6px; border-radius: 6px; background: var(--card); color: var(--muted); font-size: 8px; font-style: normal; }
.week-detail-events .tone-copper { border-left: 3px solid var(--copper); }
.week-detail-events .tone-green { border-left: 3px solid var(--green); }
.week-detail-events .tone-olive { border-left: 3px solid var(--olive); }
.week-detail-events .tone-amber { border-left: 3px solid var(--amber); }
.week-detail-state { display: grid; justify-items: end; gap: 5px; }
.week-detail-state > small { color: var(--muted); font-size: 8px; }
.week-detail-list > button > b { grid-column: 3; grid-row: 1 / span 2; color: var(--green-dark); font-size: 20px; }

.planning-list-drawer { width: min(820px, calc(100vw - 28px)); }
.planning-list-drawer > header span { display: block; margin-top: 6px; color: var(--muted); font-size: 10px; }
.planning-list-form { padding: 18px 20px; display: grid; grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr) auto auto; align-items: end; gap: 10px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 76%, transparent); }
.planning-list-form label { min-width: 0; display: grid; gap: 7px; color: var(--muted); font-size: 9px; font-weight: 800; }
.planning-list-form input { width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid var(--line-strong); border-radius: 11px; outline: 0; background: var(--card); color: var(--ink); color-scheme: inherit; }
.planning-list-form input:focus { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 14%, transparent); }
.planning-list-form > i { align-self: center; margin-top: 17px; color: var(--quiet); font-size: 10px; font-style: normal; }
.planning-list-form > button { min-height: 42px; padding: 0 14px; border: 1px solid var(--green); border-radius: 11px; background: var(--green); color: white; cursor: pointer; font-size: 10px; font-weight: 800; white-space: nowrap; }
.planning-list-form > button.is-quiet { border-color: var(--line); background: var(--card); color: var(--muted); }
.planning-list-form > small { grid-column: 1 / -1; color: var(--quiet); font-size: 9px; line-height: 1.5; }
.planning-list-form > p { grid-column: 1 / -1; margin: -3px 0 0; color: var(--copper); font-size: 10px; font-weight: 800; }
.planning-list-results { min-height: 240px; }
.planning-list-results > header { position: sticky; z-index: 2; top: 83px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--card) 94%, transparent); backdrop-filter: blur(12px); }
.planning-list-results > header > div { min-width: 0; }
.planning-list-results > header p,
.planning-list-results > header strong,
.planning-list-results > header span { display: block; }
.planning-list-results > header p { margin: 0 0 4px; overflow: hidden; color: var(--green-dark); font: 600 10px/1.35 Georgia, "Times New Roman", serif; text-overflow: ellipsis; white-space: nowrap; }
.planning-list-results > header strong { color: var(--ink); font-size: 18px; }
.planning-list-results > header span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.planning-list-results > header > button { min-height: 36px; padding: 0 12px; flex: 0 0 auto; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface); color: var(--green-dark); cursor: pointer; font-size: 9px; font-weight: 800; }
.planning-list-results > header > button:hover { border-color: var(--green); background: var(--green-bg); transform: translateY(-1px); }
.planning-list-results > header > button:disabled { opacity: .42; cursor: default; }
.planning-list-copy-status { min-height: 0; margin: 0; padding: 0 20px; color: var(--muted); font-size: 9px; transition: min-height .2s var(--ease-silk), padding .2s var(--ease-silk); }
.planning-list-copy-status:not(:empty) { min-height: 34px; padding-top: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.planning-list-copy-status.is-success { color: var(--green-dark); }
.planning-list-items { padding: 10px; display: grid; gap: 7px; }
.planning-list-items > button { min-width: 0; min-height: 67px; padding: 11px 13px; display: grid; grid-template-columns: 128px minmax(0, 1fr) 55px 112px 12px; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); cursor: pointer; text-align: left; }
.planning-list-items > button:hover { border-color: var(--green); background: color-mix(in srgb, var(--green-bg) 42%, var(--surface)); transform: translateY(-1px); }
.planning-list-items time { color: var(--green-dark); font: 600 10px/1.35 Georgia, "Times New Roman", serif; }
.planning-list-document { min-width: 0; }
.planning-list-document strong,
.planning-list-document small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.planning-list-document strong { color: var(--ink); font-size: 10px; }
.planning-list-document small { margin-top: 5px; color: var(--muted); font-size: 9px; }
.planning-list-items > button > i { color: var(--muted); font-size: 9px; font-style: normal; font-weight: 800; text-align: center; }
.planning-list-result { padding: 6px 7px; border-radius: 8px; background: var(--green-bg); color: var(--green-dark); font-size: 9px; font-weight: 800; text-align: center; }
.planning-list-result.is-late,
.planning-list-result.is-overdue { background: var(--copper-bg); color: var(--copper); }
.planning-list-result.is-upcoming { background: var(--amber-bg); color: var(--amber); }
.planning-list-result.is-on-hold { background: var(--mauve-bg); color: var(--mauve); }
.planning-list-items > button > b { color: var(--green-dark); font-size: 19px; }
.planning-list-empty { min-height: 190px; padding: 32px 20px; display: grid; place-content: center; gap: 8px; color: var(--muted); text-align: center; }
.planning-list-empty strong { color: var(--ink); font-size: 13px; }
.planning-list-empty span { font-size: 10px; line-height: 1.6; }
.planning-list-empty.is-guide { min-height: 290px; }

.schedule-section { padding: 0; overflow: hidden; }
.schedule-section > .analytics-section-header { padding: 22px; }
.schedule-summary { max-width: 540px; display: flex; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.schedule-summary span { padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--muted); font-size: 9px; }
.schedule-summary .is-early strong { color: var(--green-dark); }
.schedule-summary .is-late strong,
.schedule-summary .is-overdue strong { color: var(--copper); }
.schedule-summary .is-hold strong { color: var(--mauve); }
.schedule-searchbar { padding: 12px 22px; display: grid; grid-template-columns: minmax(260px, 520px) auto 1fr; align-items: center; gap: 10px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--card) 88%, transparent); }
.schedule-searchbar label { min-height: 38px; padding: 0 12px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: 11px; background: var(--surface); transition: border-color .2s var(--ease-soft), box-shadow .2s var(--ease-soft), background .2s var(--ease-soft); }
.schedule-searchbar label:focus-within { border-color: var(--green); background: var(--card); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 14%, transparent); }
.schedule-searchbar label > span { color: var(--green-dark); font: 700 18px/1 Georgia, serif; transform: rotate(-18deg); }
.schedule-searchbar input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; }
.schedule-searchbar input::placeholder { color: var(--quiet); }
.schedule-searchbar small { color: var(--muted); font-size: 9px; white-space: nowrap; }
.schedule-searchbar button { padding: 7px 10px; border: 0; border-radius: 8px; background: var(--green-bg); color: var(--green-dark); font-size: 9px; font-weight: 800; cursor: pointer; transition: transform .18s var(--ease-soft), background .18s var(--ease-soft); }
.schedule-searchbar button:hover { transform: translateY(-1px); background: color-mix(in srgb, var(--green-bg) 70%, var(--green) 30%); }
.schedule-search-actions { display: flex; justify-content: flex-end; gap: 7px; }
.schedule-search-actions button.is-primary { background: var(--green); color: white; }
.schedule-search-actions button.is-primary:hover { background: var(--green-dark); }
.schedule-legend { padding: 12px 22px; display: flex; align-items: center; gap: 16px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); font-size: 9px; }
.schedule-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.schedule-legend > span > i { width: 10px; height: 10px; display: inline-block; }
.schedule-legend .is-plan { border: 2px solid var(--green-dark); background: var(--card); transform: rotate(45deg); }
.schedule-legend .is-actual { border: 2px solid var(--card); border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 1px var(--amber); }
.schedule-legend .is-today { width: 1px; height: 14px; border-left: 1px dashed var(--copper); }
.schedule-legend small { margin-left: auto; color: var(--quiet); }

.schedule-timeline-scroll { max-height: 640px; overflow: auto; scrollbar-color: var(--green) transparent; scrollbar-width: thin; }
.schedule-timeline-canvas { min-width: 1080px; }
.schedule-axis,
.schedule-row { display: grid; grid-template-columns: 250px minmax(700px, 1fr) 130px; }
.schedule-axis { position: sticky; z-index: 8; top: 0; min-height: 48px; align-items: end; border-bottom: 1px solid var(--line-strong); background: var(--card); }
.schedule-doc-heading,
.schedule-result-heading { padding: 0 14px 12px; color: var(--muted); font-size: 9px; font-weight: 800; }
.schedule-doc-heading { position: sticky; z-index: 10; left: 0; background: var(--card); }
.schedule-result-heading { text-align: right; }
.schedule-axis-dates { position: relative; height: 48px; }
.schedule-axis-dates span { position: absolute; bottom: 12px; color: var(--quiet); font: 600 9px/1 Georgia, serif; transform: translateX(-50%); }
.schedule-axis-dates span:first-child { transform: none; }
.schedule-axis-dates span:last-child { transform: translateX(-100%); }

.schedule-row { width: 100%; min-height: 76px; padding: 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left; }
.schedule-row:hover { background: color-mix(in srgb, var(--green-bg) 38%, transparent); }
.schedule-doc { position: sticky; z-index: 5; left: 0; padding: 12px 14px; display: flex; flex-direction: column; justify-content: center; overflow: hidden; background: var(--card); box-shadow: 13px 0 15px -18px rgb(58 48 31 / 50%); }
.schedule-row:hover .schedule-doc { background: color-mix(in srgb, var(--green-bg) 35%, var(--card)); }
.schedule-doc strong,
.schedule-doc small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.schedule-doc strong { font-size: 10px; }
.schedule-doc small { margin-top: 5px; color: var(--muted); font-size: 8px; }
.schedule-lane { position: relative; min-height: 75px; background-image: repeating-linear-gradient(to right, transparent 0, transparent calc(10% - 1px), color-mix(in srgb, var(--line) 60%, transparent) calc(10% - 1px), color-mix(in srgb, var(--line) 60%, transparent) 10%); }
.schedule-today { position: absolute; z-index: 1; top: 7px; bottom: 7px; left: var(--today); border-left: 1px dashed var(--copper); opacity: .58; }
.schedule-connector { position: absolute; z-index: 2; top: 38px; height: 3px; border-radius: 999px; background: var(--green); }
.schedule-row.is-late .schedule-connector,
.schedule-row.is-overdue .schedule-connector { background: var(--copper); }
.schedule-row.is-overdue .schedule-connector { height: 2px; border-top: 2px dashed var(--copper); background: transparent; }
.schedule-marker { position: absolute; z-index: 3; transform: translateX(-50%); }
.schedule-marker.is-plan { top: 27px; width: 11px; height: 11px; border: 2px solid var(--green-dark); background: var(--card); transform: translateX(-50%) rotate(45deg); }
.schedule-marker.is-actual { top: 48px; width: 12px; height: 12px; border: 2px solid var(--card); border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 1px var(--amber); }
.schedule-row.is-early .schedule-marker.is-actual,
.schedule-row.is-on-time .schedule-marker.is-actual { background: var(--green-dark); box-shadow: 0 0 0 1px var(--green-dark); }
.schedule-marker.is-hold { top: 48px; width: 12px; height: 12px; border: 2px solid var(--card); border-radius: 3px; background: var(--mauve); box-shadow: 0 0 0 1px var(--mauve); }
.schedule-date { position: absolute; z-index: 3; color: var(--muted); font: 600 8px/1 Georgia, serif; transform: translateX(-50%); white-space: nowrap; }
.schedule-date.is-plan { top: 12px; }
.schedule-date.is-actual { top: 63px; }
.schedule-result { padding: 12px 14px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; text-align: right; }
.schedule-result strong { color: var(--green-dark); font-size: 10px; }
.schedule-row.is-late .schedule-result strong,
.schedule-row.is-overdue .schedule-result strong { color: var(--copper); }
.schedule-row.is-on-hold .schedule-result strong { color: var(--mauve); }
.schedule-result small { margin-top: 5px; color: var(--quiet); font-size: 8px; line-height: 1.4; }
.schedule-search-empty { position: sticky; left: 0; width: min(100vw, 1080px); padding: 38px 20px; color: var(--muted); text-align: center; font-size: 11px; }

/* Plan-centered deviation view (selected layout B). */
.schedule-search-actions button.is-grand { border: 1px solid color-mix(in srgb, var(--amber) 55%, var(--line)); background: var(--amber-bg); color: color-mix(in srgb, var(--amber) 76%, var(--ink)); }
.schedule-search-actions button.is-grand:hover { background: color-mix(in srgb, var(--amber-bg) 72%, var(--amber) 28%); }
.schedule-legend .is-early-deviation { width: 13px; height: 3px; border-radius: 99px; background: var(--green-dark); }
.schedule-legend .is-plan-zero { width: 1px; height: 15px; border-left: 1px solid var(--ink); }
.schedule-legend .is-late-deviation { width: 13px; height: 3px; border-radius: 99px; background: var(--copper); }
.schedule-legend .is-pending-deviation { border: 1px solid var(--quiet); border-radius: 50%; background: var(--card); }

.schedule-deviation-scroll { max-height: 640px; overflow: auto; scrollbar-color: var(--green) transparent; scrollbar-width: thin; }
.schedule-deviation-canvas { min-width: 960px; }
.schedule-deviation-axis,
.schedule-deviation-row { display: grid; grid-template-columns: minmax(270px, 1fr) minmax(520px, 1.6fr) 150px; }
.schedule-deviation-axis { position: sticky; z-index: 8; top: 0; min-height: 48px; align-items: center; border-bottom: 1px solid var(--line-strong); background: color-mix(in srgb, var(--card) 94%, transparent); backdrop-filter: blur(12px); }
.schedule-deviation-doc-heading,
.schedule-deviation-result-heading { padding: 0 14px; color: var(--muted); font-size: 9px; font-weight: 800; }
.schedule-deviation-result-heading { text-align: right; }
.schedule-deviation-axis-scale { position: relative; height: 48px; background-image: linear-gradient(90deg, transparent 5.8%, color-mix(in srgb, var(--line) 68%, transparent) 5.8% 6%, transparent 6% 27.8%, color-mix(in srgb, var(--line) 68%, transparent) 27.8% 28%, transparent 28% 49.9%, color-mix(in srgb, var(--ink) 48%, transparent) 49.9% 50.1%, transparent 50.1% 71.9%, color-mix(in srgb, var(--line) 68%, transparent) 71.9% 72.1%, transparent 72.1% 93.9%, color-mix(in srgb, var(--line) 68%, transparent) 93.9% 94.1%, transparent 94.1%); }
.schedule-deviation-axis-scale span { position: absolute; bottom: 14px; color: var(--quiet); font: 600 8px/1 Georgia, serif; white-space: nowrap; transform: translateX(-50%); }
.schedule-deviation-axis-scale span.is-zero { color: var(--ink); font-weight: 800; }
.schedule-deviation-row { width: 100%; min-height: 70px; padding: 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left; transition: background .2s var(--ease-soft); }
.schedule-deviation-row:hover { background: color-mix(in srgb, var(--green-bg) 34%, transparent); }
.schedule-deviation-row[hidden] { display: none; }
.schedule-deviation-doc { min-width: 0; padding: 10px 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: center; gap: 4px 10px; }
.schedule-deviation-doc strong,
.schedule-deviation-doc small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.schedule-deviation-doc strong { font-size: 10px; }
.schedule-deviation-doc small { grid-column: 1; color: var(--muted); font-size: 8px; }
.schedule-deviation-doc i { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--quiet); font-size: 8px; font-style: normal; text-align: right; white-space: nowrap; }
.schedule-deviation-lane { position: relative; min-height: 69px; display: block; background-image: linear-gradient(90deg, transparent 5.8%, color-mix(in srgb, var(--line) 60%, transparent) 5.8% 6%, transparent 6% 27.8%, color-mix(in srgb, var(--line) 60%, transparent) 27.8% 28%, transparent 28% 71.9%, color-mix(in srgb, var(--line) 60%, transparent) 71.9% 72.1%, transparent 72.1% 93.9%, color-mix(in srgb, var(--line) 60%, transparent) 93.9% 94.1%, transparent 94.1%); }
.schedule-deviation-zero { position: absolute; top: 8px; bottom: 8px; left: 50%; border-left: 1px solid color-mix(in srgb, var(--ink) 62%, transparent); }
.schedule-deviation-bar { position: absolute; top: 34px; left: var(--bar-start); width: var(--bar-width); height: 3px; border-radius: 99px; background: var(--green-dark); }
.schedule-deviation-row.is-late .schedule-deviation-bar,
.schedule-deviation-row.is-overdue .schedule-deviation-bar { background: var(--copper); }
.schedule-deviation-row.is-overdue .schedule-deviation-bar { height: 2px; border-top: 2px dashed var(--copper); background: transparent; }
.schedule-deviation-marker { position: absolute; z-index: 2; top: 23px; left: var(--marker); min-width: 25px; min-height: 23px; padding: 6px 7px; border: 1px solid var(--card); border-radius: 99px; background: var(--green-dark); color: white; box-shadow: 0 0 0 1px var(--green-dark); font: 800 8px/1 Georgia, serif; text-align: center; transform: translateX(-50%); }
.schedule-deviation-row.is-late .schedule-deviation-marker { border-radius: 7px; background: var(--copper); box-shadow: 0 0 0 1px var(--copper); }
.schedule-deviation-row.is-overdue .schedule-deviation-marker { border-radius: 5px; border-style: dashed; background: var(--card); color: var(--copper); box-shadow: 0 0 0 1px var(--copper); }
.schedule-deviation-row.is-upcoming .schedule-deviation-marker { background: var(--card); color: var(--quiet); box-shadow: 0 0 0 1px var(--line-strong); }
.schedule-deviation-row.is-on-hold .schedule-deviation-marker { border-radius: 5px; background: var(--surface); color: var(--mauve); box-shadow: 0 0 0 1px var(--mauve); }
.schedule-deviation-row.is-clipped .schedule-deviation-marker::after { content: ""; position: absolute; top: 50%; width: 5px; border-top: 1px solid currentColor; }
.schedule-deviation-row.is-clipped .schedule-deviation-marker::after { right: -7px; }
.schedule-deviation-row.is-clipped.is-early .schedule-deviation-marker::after { right: auto; left: -7px; }
.schedule-deviation-result { padding: 10px 14px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; text-align: right; }
.schedule-deviation-result strong { color: var(--green-dark); font-size: 10px; }
.schedule-deviation-row.is-late .schedule-deviation-result strong,
.schedule-deviation-row.is-overdue .schedule-deviation-result strong { color: var(--copper); }
.schedule-deviation-row.is-on-hold .schedule-deviation-result strong { color: var(--mauve); }
.schedule-deviation-result small { margin-top: 5px; color: var(--quiet); font-size: 8px; line-height: 1.35; }

/* Immersive planning deviation view. */
.planning-fullscreen { position: fixed; z-index: 240; inset: 0; overflow: auto; isolation: isolate; background: var(--bg); color: var(--ink); outline: 0; scrollbar-color: var(--green) transparent; }
.planning-fullscreen:fullscreen { width: 100vw; height: 100vh; }
.planning-fullscreen-ambient { position: fixed; z-index: -1; inset: 0; pointer-events: none; opacity: .58; background-image: linear-gradient(color-mix(in srgb, var(--line) 42%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--line) 42%, transparent) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, black, transparent 72%); }
.planning-fullscreen-ambient i { position: absolute; border: 1px solid color-mix(in srgb, var(--green) 18%, transparent); border-radius: 50%; }
.planning-fullscreen-ambient i:nth-child(1) { width: 38vw; height: 38vw; top: -22vw; right: -8vw; }
.planning-fullscreen-ambient i:nth-child(2) { width: 22vw; height: 22vw; top: -12vw; right: 2vw; }
.planning-fullscreen-ambient i:nth-child(3) { width: 9vw; height: 9vw; top: 1vw; right: 8.5vw; background: color-mix(in srgb, var(--amber-bg) 46%, transparent); }
.planning-fullscreen-header { min-height: 148px; padding: 28px clamp(22px, 4vw, 68px); display: grid; grid-template-columns: minmax(420px, 1fr) auto auto; align-items: end; gap: 34px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(14px); }
.planning-fullscreen-title h2 { margin: 0; font: 700 clamp(32px, 4.2vw, 72px)/.98 Georgia, "Songti SC", serif; letter-spacing: -.055em; }
.planning-fullscreen-title > span { display: block; margin-top: 14px; color: var(--muted); font-size: 11px; }
.planning-fullscreen-hero { display: grid; justify-items: end; }
.planning-fullscreen-hero strong { font: 500 clamp(54px, 6vw, 98px)/.75 Georgia, serif; letter-spacing: -.06em; }
.planning-fullscreen-hero span { margin-top: 13px; color: var(--green-dark); font-size: 10px; font-weight: 850; }
.planning-fullscreen-hero small { margin-top: 5px; color: var(--quiet); font-size: 8px; }
.planning-fullscreen-actions { align-self: start; }
.planning-fullscreen-actions button { min-height: 42px; padding: 0 15px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--card); color: var(--ink); font-size: 10px; font-weight: 850; cursor: pointer; transition: transform .18s var(--ease-soft), border-color .18s ease; }
.planning-fullscreen-actions button:hover { transform: translateY(-2px); border-color: var(--green); }
.planning-fullscreen-metrics { padding: 14px clamp(22px, 4vw, 68px); display: grid; grid-template-columns: repeat(5, minmax(88px, 130px)) minmax(250px, 1fr) auto; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); background: var(--card); }
.planning-fullscreen-metrics > span { min-height: 46px; padding: 8px 10px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.planning-fullscreen-metrics > span i { color: var(--muted); font-size: 9px; font-style: normal; }
.planning-fullscreen-metrics > span strong { font: 700 18px/1 Georgia, serif; }
.planning-fullscreen-metrics .is-early strong { color: var(--green-dark); }
.planning-fullscreen-metrics .is-late strong,
.planning-fullscreen-metrics .is-overdue strong { color: var(--copper); }
.planning-fullscreen-metrics .is-hold strong { color: var(--mauve); }
.planning-fullscreen-metrics label { min-height: 42px; padding: 0 13px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); }
.planning-fullscreen-metrics label:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 14%, transparent); }
.planning-fullscreen-metrics label i { color: var(--green-dark); font: 700 19px/1 Georgia, serif; font-style: normal; }
.planning-fullscreen-metrics input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); }
.planning-fullscreen-metrics > small { color: var(--muted); font-size: 9px; white-space: nowrap; }
.planning-fullscreen-cloud { margin: 22px clamp(22px, 4vw, 68px) 18px; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 20px; background: var(--card); box-shadow: var(--shadow); }
.planning-fullscreen-cloud > header,
.planning-fullscreen-detail > header { min-height: 70px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 22px; border-bottom: 1px solid var(--line); }
.planning-fullscreen-cloud h3,
.planning-fullscreen-detail h3 { margin: 0; font: 700 19px/1.1 Georgia, serif; }
.planning-fullscreen-cloud > header > span,
.planning-fullscreen-detail > header > span { max-width: 520px; color: var(--muted); font-size: 9px; line-height: 1.55; text-align: right; }
.planning-cloud-plot { position: relative; height: clamp(240px, 34vh, 420px); overflow: hidden; background-image: linear-gradient(90deg, transparent 5.8%, color-mix(in srgb, var(--line) 62%, transparent) 5.8% 6%, transparent 6% 27.8%, color-mix(in srgb, var(--line) 62%, transparent) 27.8% 28%, transparent 28% 71.9%, color-mix(in srgb, var(--line) 62%, transparent) 71.9% 72.1%, transparent 72.1% 93.9%, color-mix(in srgb, var(--line) 62%, transparent) 93.9% 94.1%, transparent 94.1%); }
.planning-cloud-plot > .schedule-deviation-axis-scale { position: absolute; z-index: 4; top: 0; right: 0; left: 0; height: 42px; background: color-mix(in srgb, var(--card) 88%, transparent); }
.planning-cloud-plot > .schedule-deviation-axis-scale span { bottom: 14px; }
.planning-cloud-zero { position: absolute; z-index: 1; top: 42px; bottom: 0; left: 50%; border-left: 1px solid color-mix(in srgb, var(--ink) 72%, transparent); }
.planning-cloud-point { position: absolute; z-index: 2; width: 9px; height: 9px; padding: 0; border: 1px solid var(--card); border-radius: 50%; background: var(--green-dark); box-shadow: 0 0 0 1px var(--green-dark); cursor: pointer; transform: translate(-50%, -50%); transition: transform .18s var(--ease-soft), box-shadow .18s ease, opacity .18s ease; }
.planning-cloud-point:hover { z-index: 5; transform: translate(-50%, -50%) scale(1.8); box-shadow: 0 0 0 1px currentColor, 0 0 0 5px color-mix(in srgb, var(--card) 78%, transparent); }
.planning-cloud-point[hidden] { display: none; }
.planning-cloud-point span { position: absolute; left: 50%; bottom: 13px; display: none; padding: 5px 6px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); color: var(--ink); font: 700 8px/1 Georgia, serif; white-space: nowrap; transform: translateX(-50%); }
.planning-cloud-point:hover span { display: block; }
.planning-cloud-point.is-late { border-radius: 2px; background: var(--copper); box-shadow: 0 0 0 1px var(--copper); }
.planning-cloud-point.is-overdue { border-radius: 1px; background: var(--card); box-shadow: 0 0 0 1px var(--copper); transform: translate(-50%, -50%) rotate(45deg); }
.planning-cloud-point.is-overdue:hover { transform: translate(-50%, -50%) rotate(45deg) scale(1.8); }
.planning-cloud-point.is-upcoming { background: var(--card); box-shadow: 0 0 0 1px var(--quiet); }
.planning-cloud-point.is-on-hold { border-radius: 2px; background: var(--surface); box-shadow: 0 0 0 1px var(--mauve); }
.planning-cloud-point.is-clipped { width: 12px; height: 12px; }
.planning-fullscreen-detail { margin: 0 clamp(22px, 4vw, 68px) 34px; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 20px; background: var(--card); box-shadow: var(--shadow); }
.schedule-deviation-scroll.is-fullscreen-list { max-height: 52vh; }
.schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-canvas { min-width: 1120px; }
.schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-axis,
.schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-row { grid-template-columns: minmax(330px, 1fr) minmax(650px, 1.6fr) 170px; }
.planning-fullscreen .schedule-search-empty { width: 100%; }
.analytics-quality-grid .is-secondary { opacity: .66; }

:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .metric-card,
:root[data-theme="dark"] .filter-panel,
:root[data-theme="dark"] .multi-filter-menu,
:root[data-theme="dark"] .row-expanded,
:root[data-theme="dark"] .detail-header,
:root[data-theme="dark"] .event-body,
:root[data-theme="dark"] .weekly-time-card,
:root[data-theme="dark"] .weekly-list-status,
:root[data-theme="dark"] .weekly-groups,
:root[data-theme="dark"] .mobile-actions { background: var(--card); }
:root[data-theme="dark"] .insight-bar-track,
:root[data-theme="dark"] .discipline-load,
:root[data-theme="dark"] .analytics-week-bar { background: var(--line); }
:root[data-theme="dark"] .multi-filter-option:hover,
:root[data-theme="dark"] .weekly-table tbody tr:hover,
:root[data-theme="dark"] .analytics-table tbody tr:hover { background: var(--surface); }

@media (max-width: 1400px) {
  .analytics-kpis { grid-template-columns: repeat(4, minmax(145px, 1fr)); }
}

@media (max-width: 760px) {
  .source-status { width: 30px; padding: 6px; justify-content: center; }
  .source-status > span { display: none; }
  .settings-panel,
  .week-detail-drawer,
  .planning-list-drawer { top: auto; right: 0; bottom: 0; left: 0; width: 100%; max-height: min(88vh, 760px); border-radius: 22px 22px 0 0; animation-name: sheet-in; }
  .palette-presets { grid-template-columns: repeat(4, minmax(62px, 1fr)); }
  .admin-fault-panel { top: auto; right: 0; bottom: 0; left: 0; width: 100%; max-height: 90dvh; border-right: 0; border-bottom: 0; border-left: 0; border-radius: 8px 8px 0 0; transform: none; animation-name: sheet-in; }
  .admin-fault-panel > header { min-height: 78px; padding: 15px 16px; }
  .admin-fault-content { padding: 14px 16px; }
  .admin-login-form { margin: 8px auto; grid-template-columns: minmax(0, 1fr); }
  .admin-login-form button { width: 100%; }
  .fault-exclusion-form { grid-template-columns: minmax(0, 1fr); }
  .correction-form { grid-template-columns: minmax(0, 1fr); }
  .correction-form label.is-wide { grid-column: 1; }
  .correction-target-list { grid-template-columns: minmax(0, 1fr); }
  .correction-confirm-form { align-items: stretch; flex-direction: column; }
  .correction-history > article { grid-template-columns: minmax(0, 1fr) auto; }
  .correction-history article > button { grid-column: 1 / -1; }
  .fault-exclusion-item { align-items: start; }
  .admin-fault-panel > footer { padding: 9px 16px; }
  .analytics-kpis { grid-template-columns: repeat(7, 148px); }
  .schedule-section > .analytics-section-header { padding: 18px; display: block; }
  .schedule-summary { margin-top: 12px; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .schedule-summary span { flex: 0 0 auto; }
  .schedule-searchbar { padding: 11px 18px; grid-template-columns: minmax(0, 1fr) auto; }
  .schedule-searchbar label { min-height: 42px; }
  .schedule-searchbar small { grid-column: 1; grid-row: 2; }
  .schedule-search-actions { grid-column: 2; grid-row: 1 / span 2; flex-direction: column; align-items: stretch; }
  .schedule-search-actions button { min-height: 31px; }
  .schedule-legend { padding: 11px 18px; overflow-x: auto; white-space: nowrap; }
  .schedule-legend small { margin-left: 12px; }
  .schedule-timeline-scroll { max-height: 520px; }
  .schedule-timeline-canvas { min-width: 1000px; }
  .schedule-axis,
  .schedule-row { grid-template-columns: 172px 700px 128px; }
  .schedule-doc-heading,
  .schedule-doc { padding-left: 12px; }
  .week-detail-list > button { grid-template-columns: minmax(0, 1fr) 12px; }
  .week-detail-state { grid-column: 1; justify-items: start; }
  .week-detail-list > button > b { grid-column: 2; }
  .planning-list-drawer > header { padding-top: 18px; }
  .planning-list-form { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); padding: 15px 16px; }
  .planning-list-form > button { grid-row: 2; }
  .planning-list-form > button[type="submit"] { grid-column: 1 / 3; }
  .planning-list-form > button.is-quiet { grid-column: 3; }
  .planning-list-form > small,
  .planning-list-form > p { grid-column: 1 / -1; }
  .planning-list-results > header { top: 80px; padding: 14px 16px; }
  .planning-list-results > header strong { font-size: 16px; }
  .planning-list-items { padding: 8px; }
  .planning-list-items > button { min-height: 103px; padding: 12px; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 7px 10px; }
  .planning-list-items time { grid-column: 1; }
  .planning-list-items > button > i { grid-column: 2; grid-row: 1; }
  .planning-list-document { grid-column: 1 / -1; }
  .planning-list-result { grid-column: 1; width: fit-content; }
  .planning-list-items > button > b { grid-column: 2; grid-row: 3; justify-self: end; }
}

@keyframes sheet-in { from { opacity: 0; transform: translateY(28px); } }

@media (max-width: 1180px) {
  .planning-fullscreen-header { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .planning-fullscreen-hero { grid-column: 2; grid-row: 1; }
  .planning-fullscreen-actions { grid-column: 1 / -1; grid-row: 2; justify-self: end; }
  .planning-fullscreen-metrics { grid-template-columns: repeat(5, minmax(80px, 1fr)); }
  .planning-fullscreen-metrics label { grid-column: 1 / 5; }
  .planning-fullscreen-metrics > small { grid-column: 5; justify-self: end; }
}

@media (max-width: 760px) {
  .schedule-search-actions { grid-column: 1 / -1; grid-row: 3; flex-direction: row; justify-content: flex-start; overflow-x: auto; }
  .schedule-search-actions button { flex: 0 0 auto; }
  .schedule-deviation-scroll { max-height: 580px; padding: 8px; background: var(--surface); }
  .schedule-deviation-canvas { min-width: 0; }
  .schedule-deviation-axis { display: none; }
  .schedule-deviation-rows { display: grid; gap: 8px; }
  .schedule-deviation-row { min-height: 150px; display: grid; grid-template-columns: 1fr; grid-template-rows: auto 58px auto; border: 1px solid var(--line); border-radius: 12px; background: var(--card); overflow: hidden; }
  .schedule-deviation-doc { padding: 11px 12px 6px; grid-template-columns: minmax(0, 1fr); }
  .schedule-deviation-doc i { grid-column: 1; grid-row: 3; margin-top: 2px; text-align: left; }
  .schedule-deviation-lane { min-height: 58px; margin: 0 8px; }
  .schedule-deviation-zero { top: 5px; bottom: 5px; }
  .schedule-deviation-bar { top: 29px; }
  .schedule-deviation-marker { top: 18px; }
  .schedule-deviation-result { padding: 6px 12px 11px; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; text-align: left; }
  .schedule-deviation-result small { margin: 0; text-align: right; }
  .schedule-search-empty { position: static; width: 100%; }

  .planning-fullscreen-header { min-height: 0; padding: 20px 16px; display: grid; grid-template-columns: 1fr auto; gap: 15px; }
  .planning-fullscreen-title h2 { font-size: clamp(31px, 10vw, 46px); }
  .planning-fullscreen-title > span { font-size: 9px; line-height: 1.55; }
  .planning-fullscreen-hero { align-self: end; }
  .planning-fullscreen-hero strong { font-size: 52px; }
  .planning-fullscreen-hero span { font-size: 8px; }
  .planning-fullscreen-hero small { display: none; }
  .planning-fullscreen-actions { grid-column: 1 / -1; justify-self: stretch; }
  .planning-fullscreen-actions button { width: 100%; }
  .planning-fullscreen-metrics { padding: 10px 12px; display: flex; align-items: stretch; overflow-x: auto; }
  .planning-fullscreen-metrics > span { min-width: 82px; flex: 0 0 auto; }
  .planning-fullscreen-metrics label { min-width: 230px; flex: 1 0 230px; }
  .planning-fullscreen-metrics > small { align-self: center; flex: 0 0 auto; }
  .planning-fullscreen-cloud,
  .planning-fullscreen-detail { margin: 12px 8px; border-radius: 15px; }
  .planning-fullscreen-cloud > header,
  .planning-fullscreen-detail > header { min-height: 0; padding: 13px 14px; display: block; }
  .planning-fullscreen-cloud > header > span,
  .planning-fullscreen-detail > header > span { display: block; margin-top: 7px; text-align: left; }
  .planning-cloud-plot { height: 240px; }
  .planning-cloud-point { width: 8px; height: 8px; }
  .planning-fullscreen-detail .schedule-deviation-scroll { max-height: 68vh; }
  .schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-canvas { min-width: 0; }
  .schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-axis,
  .schedule-deviation-scroll.is-fullscreen-list .schedule-deviation-row { grid-template-columns: 1fr; }
}

/* Final workspace visibility overrides. Keep these after legacy viewport rules. */
@container workspace-main (max-width: 1100px) {
  .analytics-kpis { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .analytics-diagnostic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-followup-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-longest-card { grid-row: auto; }
  .metric-strip,
  .weekly-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .weekly-time-header,
  .weekly-time-grid { grid-template-columns: minmax(0, 1fr); }
  .filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@container workspace-main (max-width: 780px) {
  .app-shell,
  .detail-shell { padding-inline: 18px; }
  .app-header { display: block; margin-bottom: 18px; }
  .header-actions { margin-top: 13px; justify-content: flex-start; flex-wrap: wrap; }
  .analytics-kpis,
  .metric-strip,
  .weekly-metrics,
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytics-diagnostic-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-section-header,
  .analytics-card-header { align-items: flex-start; flex-direction: column; }
  .analytics-section-metrics { width: 100%; justify-content: flex-start; overflow-x: auto; }
  .analytics-section,
  .analytics-card { padding: 16px; border-radius: 8px; }
  .analytics-followup-list { gap: 8px; }
  .analytics-followup-item { padding: 12px; }
  .weekly-summary-card { grid-template-columns: minmax(0, 1fr); }
  .weekly-summary-card > span { grid-column: 1; max-width: none; text-align: left; }
}

@container workspace-main (max-width: 500px) {
  .app-shell,
  .detail-shell { padding-inline: 13px; }
  .analytics-kpis { gap: 8px; }
  .analytics-kpi { min-height: 108px; padding: 14px; }
  .analytics-kpi strong { font-size: 27px; }
  .metric-strip,
  .weekly-metrics,
  .filter-grid { grid-template-columns: minmax(0, 1fr); }
  .analytics-followup-context { display: none; }
}

/* Final mobile workspace rules. Keep these last so legacy route styles cannot
   cover the shared toolbar or reintroduce nested scrolling. */
@media (max-width: 900px) {
  html,
  body { width: 100%; max-width: 100%; overflow-x: hidden; }

  .dashboard-workspace {
    --mobile-tool-size: clamp(280px, 38dvh, 330px);
  }
  .dashboard-workspace .workspace-stage {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: auto;
  }
  .dashboard-workspace .workspace-main-host {
    width: 100%;
    height: auto;
    min-height: 0;
    flex: 0 0 auto;
    overflow: visible;
    scrollbar-gutter: auto;
  }
  .dashboard-workspace .workspace-main-host > .app-shell,
  .dashboard-workspace .workspace-main-host > .detail-shell {
    min-height: 0;
    padding-top: 18px;
    padding-bottom: 28px;
  }
  .dashboard-workspace .workspace-main-host .mobile-actions { display: none; }

  .dashboard-workspace .workspace-dock-zone.is-left,
  .dashboard-workspace .workspace-dock-zone.is-right,
  .dashboard-workspace .workspace-dock-zone.is-top,
  .dashboard-workspace .workspace-dock-zone.is-bottom {
    grid-auto-rows: var(--mobile-tool-size);
  }
  .dashboard-workspace .workspace-tool-panel { max-width: 100vw; }
  .workspace-tool-panel.is-instrument .insights-scroll {
    overscroll-behavior-y: contain;
    scrollbar-gutter: auto;
  }

  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-prompts {
    max-height: none;
    padding: 7px 10px;
    display: flex;
    grid-template-columns: none;
    grid-auto-rows: auto;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
  }
  .dashboard-assistant-surface.is-dock:not(.is-dock-horizontal) .dashboard-assistant-prompts button {
    width: auto;
    min-width: max-content;
    min-height: 34px;
    padding: 0 10px;
    line-height: 1.2;
    white-space: nowrap;
    scroll-snap-align: start;
  }
}

@media (max-width: 760px) {
  .workspace-layout-bar {
    padding-inline: max(7px, env(safe-area-inset-left)) max(7px, env(safe-area-inset-right));
    gap: 6px;
  }
  .workspace-layout-summary { gap: 0; }
  .workspace-layout-summary strong { margin: 0; font-size: 9px; }
  .workspace-command-strip {
    justify-content: flex-start;
    gap: 5px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .workspace-command-strip::-webkit-scrollbar { display: none; }
  .workspace-command-strip > * { scroll-snap-align: start; }
  .workspace-command {
    min-height: 34px;
    padding-inline: 10px;
    font-size: 9px;
    touch-action: manipulation;
  }
  .workspace-layout-bar .source-status {
    width: 30px;
    min-width: 30px;
    min-height: 30px;
    padding: 6px;
    justify-content: center;
  }
  .workspace-layout-bar .source-status > span { display: none; }
  .workspace-settings-command { min-width: 58px; padding-inline: 7px; }

  .dashboard-assistant-header {
    min-height: 56px;
    padding: 8px 10px;
    gap: 7px;
  }
  .dashboard-assistant-header > div { gap: 7px; }
  .dashboard-assistant-header small { display: none; }
  .dashboard-assistant-header .assistant-mode-toggle {
    min-width: 78px;
    padding-right: 7px;
  }
  .dashboard-assistant-header button { min-height: 34px; padding-inline: 8px; }
  .dashboard-assistant-prompts { padding: 7px 10px; }
  .dashboard-assistant-prompts button { min-height: 34px; }
  .dashboard-assistant-conversation {
    padding: 13px 10px 18px;
    scrollbar-gutter: auto;
  }
  .dashboard-assistant-message { margin-bottom: 14px; gap: 7px; }
  .dashboard-assistant-bubble {
    max-width: calc(100% - 31px);
    padding: 11px 12px 8px;
  }
  .dashboard-assistant-message.is-user .dashboard-assistant-bubble { max-width: 90%; }
  .assistant-message-copy { font-size: 11px; line-height: 1.68; }
  .dashboard-assistant-composer {
    padding: 8px max(9px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(9px, env(safe-area-inset-left));
    gap: 7px;
  }
  .dashboard-assistant-composer textarea {
    min-height: 44px;
    max-height: 112px;
    padding: 11px 12px;
    resize: none;
    font-size: 11px;
  }
  .dashboard-assistant-composer button {
    min-width: 54px;
    min-height: 44px;
    padding-inline: 10px;
  }

  .assistant-page-header {
    min-height: 56px;
    height: 56px;
    padding: 8px 12px;
  }
  .assistant-page-header h1 { font-size: 20px; }
  .assistant-page-main { height: calc(100dvh - 56px); }
  .dashboard-assistant-surface.is-module .dashboard-assistant-conversation { padding: 13px 10px 18px; }
  .dashboard-assistant-surface.is-module .dashboard-assistant-composer { padding-inline: 9px; }
}

@media (max-width: 460px) {
  .workspace-layout-bar { grid-template-columns: minmax(0, 1fr) auto; }
  .workspace-layout-summary { display: none; }
  .workspace-command-strip { grid-column: 1; }
  .workspace-settings-command { grid-column: 2; }
  .dashboard-assistant-header strong { font-size: 12px; }
  .dashboard-assistant-avatar.assistant-pixel-avatar,
  .dashboard-assistant-avatar.assistant-pixel-avatar img {
    width: 32px;
    height: 32px;
  }
}

/* Wang Gong: persistent in-page assistant character */
.assistant-pet-host {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 86;
  width: 104px;
  height: 132px;
  pointer-events: none;
}

.assistant-pet-shell {
  position: relative;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.assistant-pet-character {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 96px;
  height: 122px;
  padding: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--green-dark);
  cursor: pointer;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
  filter: drop-shadow(0 10px 8px rgb(24 39 33 / 18%));
  transition: filter .2s ease;
}

.assistant-pet-character:hover,
.assistant-pet-character:focus-visible {
  filter: drop-shadow(0 13px 10px rgb(24 39 33 / 25%));
}

.assistant-pet-character:focus-visible {
  border-radius: 8px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 30%, transparent);
}

.wang-gong-sprite {
  position: absolute;
  right: 2px;
  bottom: 16px;
  width: 94px;
  height: 94px;
  display: block;
  pointer-events: none;
}

.wang-gong-sprite::after {
  content: '';
  position: absolute;
  right: 19px;
  bottom: 4px;
  left: 19px;
  height: 5px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--green-dark) 18%, transparent);
  filter: blur(2px);
  opacity: .7;
}

.wang-gong-sprite-viewport {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
}

.wang-gong-sprite-viewport img {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 1200%;
  height: 100%;
  display: block;
  image-rendering: pixelated;
  user-select: none;
  will-change: transform;
}

.assistant-pet-action-label,
.assistant-pet-hint {
  position: absolute;
  right: 50%;
  display: block;
  white-space: nowrap;
  transform: translateX(50%);
  pointer-events: none;
}

.assistant-pet-action-label {
  top: 0;
  min-width: 44px;
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--green) 34%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--card) 94%, transparent);
  color: var(--green-dark);
  box-shadow: 0 5px 14px rgb(26 39 34 / 10%);
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
}

.assistant-pet-hint {
  bottom: 0;
  color: var(--muted);
  font-size: 8px;
  opacity: .78;
}

.assistant-pet-character:hover .assistant-pet-hint { color: var(--green-dark); opacity: 1; }

.assistant-pet-popover {
  position: absolute;
  right: 14px;
  bottom: 116px;
  width: min(410px, calc(100vw - 38px));
  height: min(560px, calc(100dvh - 166px));
  min-height: 360px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--card);
  box-shadow: 0 24px 70px rgb(20 31 27 / 22%);
  pointer-events: auto;
  transform-origin: calc(100% - 45px) 100%;
  animation: wang-gong-popover-in .24s cubic-bezier(.22, 1, .36, 1) both;
}

.assistant-pet-popover[hidden] { display: none; }

.assistant-pet-popover::after {
  content: '';
  position: absolute;
  right: 34px;
  bottom: -7px;
  width: 13px;
  height: 13px;
  border-right: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  background: var(--card);
  transform: rotate(45deg);
}

.assistant-pet-popover > header {
  min-width: 0;
  min-height: 58px;
  padding: 9px 11px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--card) 92%, var(--green-bg));
}

.assistant-pet-popover > header > div { min-width: 0; display: flex; align-items: center; gap: 8px; }
.assistant-pet-popover > header span,
.assistant-pet-popover > header strong,
.assistant-pet-popover > header small { min-width: 0; display: block; }
.assistant-pet-popover > header strong { color: var(--ink); font-size: 12px; }
.assistant-pet-popover > header small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.assistant-pet-popover > header > div:last-child { justify-content: flex-end; gap: 5px; }

.assistant-pet-popover > header button,
.assistant-pet-prompts button {
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--green-dark);
  cursor: pointer;
  font-size: 9px;
  font-weight: 750;
}

.assistant-pet-popover > header button:hover,
.assistant-pet-prompts button:hover { border-color: var(--green); background: var(--green-bg); }
.assistant-pet-popover > header [data-assistant-close-bubble] { width: 30px; padding: 0; font-size: 16px; }

.assistant-pet-popover-mark.assistant-pixel-avatar,
.assistant-pet-popover-mark.assistant-pixel-avatar img { width: 36px; height: 36px; }

.assistant-pet-prompts {
  padding: 8px 10px;
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}

.assistant-pet-prompts::-webkit-scrollbar { display: none; }
.assistant-pet-prompts button { flex: 0 0 auto; white-space: nowrap; }
.assistant-pet-popover .dashboard-assistant-conversation { padding: 12px 10px 16px; scrollbar-gutter: auto; }
.assistant-pet-popover .dashboard-assistant-message { margin-bottom: 12px; gap: 6px; }
.assistant-pet-popover .dashboard-assistant-avatar.assistant-pixel-avatar,
.assistant-pet-popover .dashboard-assistant-avatar.assistant-pixel-avatar img { width: 28px; height: 28px; }
.assistant-pet-popover .dashboard-assistant-bubble { padding: 9px 10px 7px; }
.assistant-pet-popover .assistant-message-copy { font-size: 10px; line-height: 1.65; }
.assistant-pet-popover .dashboard-assistant-composer { padding: 8px 9px max(8px, env(safe-area-inset-bottom)); gap: 7px; }
.assistant-pet-popover .dashboard-assistant-composer textarea { min-height: 42px; max-height: 92px; padding: 10px 11px; resize: none; font-size: 10px; }
.assistant-pet-popover .dashboard-assistant-composer button { min-width: 50px; min-height: 42px; padding-inline: 9px; }

.assistant-pet-shell.is-idle .wang-gong-sprite-viewport img {
  animation: wang-sprite-idle 7.2s step-end infinite;
}

.assistant-pet-shell.is-waving .wang-gong-sprite-viewport img {
  animation: wang-sprite-once .96s steps(11, end) both;
}

.assistant-pet-shell.is-thinking .wang-gong-sprite-viewport img {
  animation: wang-sprite-loop 1.65s steps(11, end) infinite;
}

.assistant-pet-shell.is-speaking .wang-gong-sprite-viewport img {
  animation: wang-sprite-loop .96s steps(11, end) infinite;
}

.assistant-pet-shell.is-acting .wang-gong-sprite-viewport img {
  animation: wang-sprite-loop .84s steps(11, end) infinite;
}

.assistant-pet-shell.is-success .wang-gong-sprite-viewport img {
  animation: wang-sprite-once .98s steps(11, end) both;
}

.assistant-pet-shell.is-success .wang-gong-sprite::after {
  animation: wang-sprite-success-shadow .98s step-end both;
}

.assistant-pet-shell.is-failed .wang-gong-sprite-viewport img {
  animation: wang-sprite-once 1.22s steps(11, end) both;
}

@keyframes wang-sprite-loop {
  from { transform: translateX(0); }
  to { transform: translateX(-91.666667%); }
}

@keyframes wang-sprite-once {
  from { transform: translateX(0); }
  to { transform: translateX(-91.666667%); }
}

@keyframes wang-sprite-idle {
  0%, 50% { transform: translateX(0); }
  53% { transform: translateX(-8.333333%); }
  56% { transform: translateX(-16.666667%); }
  59% { transform: translateX(-25%); }
  62% { transform: translateX(-33.333333%); }
  65% { transform: translateX(-41.666667%); }
  68% { transform: translateX(-50%); }
  71% { transform: translateX(-58.333333%); }
  74% { transform: translateX(-66.666667%); }
  77% { transform: translateX(-75%); }
  80% { transform: translateX(-83.333333%); }
  83% { transform: translateX(-91.666667%); }
  86%, 100% { transform: translateX(0); }
}

@keyframes wang-sprite-success-shadow {
  0%, 22%, 72%, 100% { transform: scaleX(1); opacity: .7; }
  38% { transform: scaleX(.62); opacity: .28; }
  54% { transform: scaleX(.78); opacity: .46; }
}

@keyframes wang-puppet-patrol {
  0%, 54%, 100% { transform: translate(0, 0); }
  60% { transform: translate(-8px, -2px); }
  66% { transform: translate(-14px, 0); }
  72% { transform: translate(-8px, -2px); }
  78% { transform: translate(0, 0); }
}

@keyframes wang-puppet-shadow {
  0%, 54%, 100% { transform: scaleX(1); opacity: .56; }
  60%, 72% { transform: scaleX(.82); opacity: .42; }
  66% { transform: scaleX(.94); opacity: .5; }
}

@keyframes wang-puppet-breathe {
  0%, 100% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-1px) scaleY(1.018); }
}

@keyframes wang-puppet-look {
  0%, 52%, 100% { transform: rotate(0) translateY(0); }
  58%, 66% { transform: rotate(-5deg) translateY(-1px); }
  72%, 80% { transform: rotate(4deg) translateY(0); }
}

@keyframes wang-puppet-idle-left-arm {
  0%, 54%, 100% { transform: rotate(0); }
  60%, 72% { transform: rotate(10deg); }
  66%, 78% { transform: rotate(-8deg); }
}

@keyframes wang-puppet-idle-right-arm {
  0%, 54%, 100% { transform: rotate(0); }
  60%, 72% { transform: rotate(-10deg); }
  66%, 78% { transform: rotate(8deg); }
}

@keyframes wang-puppet-idle-left-leg {
  0%, 54%, 100% { transform: rotate(0); }
  60%, 72% { transform: rotate(-7deg) translateY(-1px); }
  66%, 78% { transform: rotate(5deg); }
}

@keyframes wang-puppet-idle-right-leg {
  0%, 54%, 100% { transform: rotate(0); }
  60%, 72% { transform: rotate(5deg); }
  66%, 78% { transform: rotate(-7deg) translateY(-1px); }
}

@keyframes wang-puppet-wave-body {
  0%, 100% { transform: translateY(0) rotate(0); }
  38% { transform: translateY(-4px) rotate(-3deg); }
  72% { transform: translateY(-2px) rotate(2deg); }
}

@keyframes wang-puppet-wave-arm {
  from { transform: rotate(-82deg) translateY(-1px); }
  to { transform: rotate(-132deg) translateY(-2px); }
}

@keyframes wang-puppet-wave-head {
  0%, 100% { transform: rotate(0); }
  35% { transform: rotate(-7deg) translateY(-2px); }
  70% { transform: rotate(4deg); }
}

@keyframes wang-puppet-thinking-body {
  0%, 100% { transform: translateX(-7px); }
  50% { transform: translateX(7px); }
}

@keyframes wang-puppet-thinking-head {
  0%, 100% { transform: rotate(-8deg) translateY(-1px); }
  50% { transform: rotate(7deg) translateY(-2px); }
}

@keyframes wang-puppet-thinking-arm {
  0%, 100% { transform: rotate(78deg) translate(-2px, -1px); }
  50% { transform: rotate(92deg) translate(-3px, -2px); }
}

@keyframes wang-puppet-step-left {
  0%, 100% { transform: rotate(-8deg) translateY(-2px); }
  50% { transform: rotate(5deg) translateY(0); }
}

@keyframes wang-puppet-step-right {
  0%, 100% { transform: rotate(5deg) translateY(0); }
  50% { transform: rotate(-8deg) translateY(-2px); }
}

@keyframes wang-puppet-speaking-body {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@keyframes wang-puppet-speaking-head {
  0%, 100% { transform: rotate(-3deg) translateY(0); }
  50% { transform: rotate(4deg) translateY(-2px); }
}

@keyframes wang-puppet-speaking-left {
  0%, 100% { transform: rotate(12deg); }
  50% { transform: rotate(48deg) translateY(-2px); }
}

@keyframes wang-puppet-speaking-right {
  0%, 100% { transform: rotate(-38deg) translateY(-2px); }
  50% { transform: rotate(-8deg); }
}

@keyframes wang-puppet-dash {
  0%, 100% { transform: translate(-10px, 0) rotate(-3deg); }
  50% { transform: translate(10px, -3px) rotate(3deg); }
}

@keyframes wang-puppet-run-left {
  from { transform: rotate(-24deg); }
  to { transform: rotate(28deg) translateY(-2px); }
}

@keyframes wang-puppet-run-right {
  from { transform: rotate(24deg); }
  to { transform: rotate(-28deg) translateY(-2px); }
}

@keyframes wang-puppet-celebrate {
  0%, 100% { transform: translateY(0) scale(1); }
  35% { transform: translateY(-17px) scale(1.04); }
  62% { transform: translateY(-7px) scale(1.02); }
}

@keyframes wang-puppet-celebrate-shadow {
  0%, 100% { transform: scaleX(1); opacity: .56; }
  35% { transform: scaleX(.62); opacity: .22; }
  62% { transform: scaleX(.8); opacity: .38; }
}

@keyframes wang-puppet-cheer-left {
  0%, 100% { transform: rotate(0); }
  28%, 72% { transform: rotate(132deg) translateY(-2px); }
}

@keyframes wang-puppet-cheer-right {
  0%, 100% { transform: rotate(0); }
  28%, 72% { transform: rotate(-132deg) translateY(-2px); }
}

@keyframes wang-puppet-cheer-head {
  0%, 100% { transform: rotate(0); }
  35% { transform: rotate(-5deg) translateY(-3px); }
  62% { transform: rotate(5deg) translateY(-1px); }
}

@keyframes wang-puppet-failed-body {
  0%, 100% { transform: translate(0, 0); }
  18% { transform: translate(-5px, 2px) rotate(-3deg); }
  36% { transform: translate(5px, 3px) rotate(3deg); }
  54% { transform: translate(-4px, 4px) rotate(-2deg); }
  72% { transform: translate(3px, 5px) rotate(2deg); }
}

@keyframes wang-puppet-failed-head {
  0% { transform: rotate(0) translateY(0); }
  35%, 100% { transform: rotate(10deg) translateY(5px); }
}

@keyframes wang-puppet-failed-left {
  0% { transform: rotate(0); }
  45%, 100% { transform: rotate(-18deg) translateY(4px); }
}

@keyframes wang-puppet-failed-right {
  0% { transform: rotate(0); }
  45%, 100% { transform: rotate(18deg) translateY(4px); }
}

@keyframes wang-gong-popover-in {
  from { opacity: 0; transform: translateY(8px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes wang-gong-idle {
  0%, 72%, 100% { transform: translate(0, 0) rotate(0); }
  78% { transform: translate(-4px, -1px) rotate(-1deg); }
  86% { transform: translate(3px, 0) rotate(1deg); }
  92% { transform: translate(0, -2px) rotate(0); }
}

@keyframes wang-gong-thinking {
  0%, 100% { transform: translateX(-6px) rotate(-2deg); }
  50% { transform: translateX(6px) rotate(2deg); }
}

@keyframes wang-gong-speaking {
  0%, 100% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-4px) scaleY(1.02); }
}

@keyframes wang-gong-acting {
  0% { transform: translateX(-8px) skewX(-3deg); }
  50% { transform: translateX(8px) skewX(3deg); }
  100% { transform: translateX(-8px) skewX(-3deg); }
}

@keyframes wang-gong-success {
  0%, 100% { transform: translateY(0) rotate(0); }
  35% { transform: translateY(-14px) rotate(-3deg); }
  62% { transform: translateY(-4px) rotate(3deg); }
}

@keyframes wang-gong-failed {
  0%, 100% { transform: translateX(0) rotate(0); }
  20% { transform: translateX(-5px) rotate(-3deg); }
  40% { transform: translateX(5px) rotate(3deg); }
  60% { transform: translateX(-4px) rotate(-2deg); }
  80% { transform: translateX(4px) rotate(2deg); }
}

@keyframes wang-gong-wave {
  0%, 100% { transform: translateY(0) rotate(0); }
  30% { transform: translateY(-5px) rotate(-4deg); }
  60% { transform: translateY(-2px) rotate(4deg); }
}

@media (max-width: 760px) {
  .assistant-pet-host {
    right: max(7px, env(safe-area-inset-right));
    bottom: max(7px, env(safe-area-inset-bottom));
    width: 82px;
    height: 104px;
  }
  .assistant-pet-character { width: 78px; height: 102px; }
  .wang-gong-sprite { right: 1px; bottom: 15px; width: 76px; height: 76px; }
  .assistant-pet-action-label { top: 1px; padding: 4px 7px; }
  .assistant-pet-popover {
    position: fixed;
    right: max(7px, env(safe-area-inset-right));
    bottom: max(88px, calc(env(safe-area-inset-bottom) + 82px));
    width: calc(100vw - max(14px, env(safe-area-inset-left) + env(safe-area-inset-right)));
    height: min(66dvh, 540px);
    min-height: 330px;
  }
  .assistant-pet-popover::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .assistant-pet-popover { animation: none !important; }
}
