@font-face {
  font-family: "Inter Variable";
  src: url("/fonts/InterVariable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --bg-deep: #0b0c0e;
  --bg-main: #101113;
  --bg-panel: #16171a;
  --bg-raised: #1c1e22;
  --bg-hover: #23262b;
  --line: #292c31;
  --line-strong: #3b3f46;
  --text: #f5f6f7;
  --text-soft: #d7d9dd;
  --text-faint: #a7abb3;
  --accent: #e1e5ea;
  --accent-soft: rgba(225, 229, 234, 0.1);
  --candidate: #d9e0eb;
  --question: #cbd8df;
  --danger: #ff0055;
  --sidebar-width: 238px;
  --context-width: 286px;
  --sidebar-min-width: 190px;
  --context-min-width: 220px;
  --main-min-width: 420px;
  --titlebar-height: 38px;
  --composer-height: 152px;
  --radius-control: 8px;
  --radius-surface: 14px;
  --radius-composer: 20px;
  --radius-pill: 999px;
  --scrollbar-size: 10px;
  --scrollbar-thumb-size: 6px;
  --scrollbar-thumb: #4c5057;
  --scrollbar-thumb-hover: #70767f;
  --font-ui: "Inter Variable", -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI Variable Text", "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  font-family: var(--font-ui);
  font-synthesis: none;
  font-kerning: normal;
  font-optical-sizing: auto;
  text-rendering: auto;
  color: var(--text);
  background: var(--bg-deep);
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  min-width: 320px;
  overflow: hidden;
  background: var(--bg-deep);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

button, input, textarea, select { font: inherit; }
button { color: inherit; }

button,
input,
textarea {
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

button:disabled { cursor: not-allowed; opacity: .38; }

.sr-only,
.skip-link:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 8px 12px;
  color: var(--bg-deep);
  background: var(--accent);
}

.app-shell { height: 100%; }

.titlebar {
  height: var(--titlebar-height);
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr auto;
  align-items: stretch;
  background: var(--bg-panel);
  border-bottom: 1px solid var(--line);
  user-select: none;
  transition: grid-template-columns 180ms cubic-bezier(.22, 1, .36, 1);
}

.titlebar-brand,
.titlebar-status {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 0 12px;
  color: var(--text-soft);
  font-size: 12px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: var(--text);
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
}

.tab-strip { display: flex; align-items: end; min-width: 0; }

.app-tab {
  height: 34px;
  min-width: 190px;
  max-width: 320px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 13px;
  color: var(--text-soft);
  background: var(--bg-main);
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
}

.app-tab > span:nth-child(2) {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-sidebar-toggle {
  width: 32px;
  height: 32px;
  min-width: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: var(--text-faint);
  background: transparent;
  border: 0;
  border-radius: 7px;
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 650;
}

.titlebar-brand .project-sidebar-toggle { margin-left: auto; }
.project-sidebar-toggle-mobile { display: none; margin-left: 6px; }

.project-sidebar-toggle svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}

.project-sidebar-toggle:hover,
.project-sidebar-toggle:focus-visible { color: var(--accent-strong); background: var(--accent-soft); }

body.sidebar-collapsed .titlebar { grid-template-columns: 56px minmax(0, 1fr) auto; }
body.sidebar-collapsed .titlebar-brand { justify-content: center; padding-inline: 8px; }
body.sidebar-collapsed .titlebar-brand .brand-mark,
body.sidebar-collapsed .titlebar-brand .brand-label { display: none; }
body.sidebar-collapsed .titlebar-brand .project-sidebar-toggle { margin-left: 0; }

.tab-dot,
.connection-dot,
.status-pip {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--accent);
}

.connection-dot { background: #9db8a3; }

.titlebar-status { justify-content: flex-end; padding-right: 16px; }

.workspace-frame {
  height: calc(100% - var(--titlebar-height));
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr) var(--context-width);
  background: var(--bg-main);
  transition: grid-template-columns 180ms cubic-bezier(.22, 1, .36, 1);
}

.activity-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 8px 5px;
  background: var(--bg-panel);
  border-right: 1px solid var(--line);
}

.rail-spacer { flex: 1; }

.rail-button,
.icon-button,
.send-button {
  display: inline-grid;
  place-items: center;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.rail-button {
  width: 33px;
  height: 33px;
  color: var(--text-faint);
  border-radius: var(--radius-control);
}

.rail-button:hover:not(:disabled),
.rail-button.is-active { color: var(--text); background: var(--bg-hover); }

.rail-button svg,
.icon-button svg,
.send-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.project-sidebar,
.context-pane {
  position: relative;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--bg-panel);
}

.project-sidebar {
  border-right: 1px solid var(--line);
  opacity: 1;
  transition: opacity 120ms ease;
}
.context-pane { border-left: 1px solid var(--line); }

.panel-resizer {
  position: absolute;
  z-index: 8;
  top: 0;
  bottom: 0;
  width: 9px;
  cursor: col-resize;
  touch-action: none;
}

.panel-resizer-right { right: -5px; }
.panel-resizer-left { left: -5px; }

.panel-resizer::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 4px;
  width: 1px;
  background: transparent;
  transition: background-color 100ms ease;
}

.panel-resizer:hover::after,
.panel-resizer:focus-visible::after,
.panel-resizer.is-dragging::after { background: #777d86; }

.panel-resizer:focus-visible { outline: none; }
body.is-resizing-panels { cursor: col-resize; user-select: none; }
body.is-resizing-panels * { cursor: col-resize !important; }

.pane-header {
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 0 13px;
  color: var(--text-soft);
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}

.icon-button {
  width: 28px;
  height: 28px;
  color: var(--text-faint);
  border-radius: var(--radius-control);
  font-size: 18px;
}

.icon-button.compact { width: 22px; height: 22px; }
.icon-button:hover:not(:disabled) { color: var(--text); background: var(--bg-hover); }

.sidebar-section-label {
  padding: 12px 12px 5px;
  color: var(--text-faint);
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.project-list-shell {
  position: relative;
  min-height: 0;
  flex: 1;
  overflow: hidden;
}

.project-list {
  position: relative;
  height: 100%;
  overflow-y: scroll;
  padding: 5px 14px 24px 7px;
  scrollbar-width: none;
}

.project-list::-webkit-scrollbar { display: none; }

.project-list-scrollbar {
  position: absolute;
  z-index: 6;
  top: 6px;
  right: 1px;
  bottom: 6px;
  width: var(--scrollbar-size);
  cursor: default;
}

.project-list-scrollbar[hidden] { display: none; }

.project-list-scrollbar-thumb {
  position: absolute;
  top: 0;
  left: calc((var(--scrollbar-size) - var(--scrollbar-thumb-size)) / 2);
  width: var(--scrollbar-thumb-size);
  min-height: 38px;
  background: var(--scrollbar-thumb);
  border-radius: 999px;
  transition: background-color 120ms ease;
  will-change: transform;
  cursor: grab;
}

.project-list-scrollbar:hover .project-list-scrollbar-thumb,
.project-list-scrollbar-thumb.is-dragging { background: var(--scrollbar-thumb-hover); }

.project-list-scrollbar-thumb.is-dragging { cursor: grabbing; }

.tree-active-indicator {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 2px;
  height: 16px;
  opacity: 0;
  background: #f4f5f6;
  border-radius: 999px;
  box-shadow: 0 0 7px rgba(255, 255, 255, .2);
  pointer-events: none;
  transition: transform 230ms cubic-bezier(.22, 1, .36, 1), opacity 140ms ease;
  will-change: transform;
}

.tree-active-indicator.is-visible { opacity: 1; }
.tree-active-indicator.is-tracking { transition: opacity 140ms ease; }
.tree-active-indicator.without-motion { transition: none; }

.project-list-gradient {
  position: absolute;
  z-index: 2;
  right: 0;
  left: 0;
  height: 38px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.project-list-gradient-top {
  top: 0;
  background: linear-gradient(to bottom, var(--bg-panel) 8%, rgba(22, 23, 26, 0));
}

.project-list-gradient-bottom {
  bottom: 0;
  height: 54px;
  background: linear-gradient(to top, var(--bg-panel) 8%, rgba(22, 23, 26, 0));
}

.project-tree { margin-bottom: 7px; }
.project-tree.is-entering { animation: project-item-in 180ms ease-out both; animation-delay: calc(var(--item-index) * 28ms); }
.tree-folder.is-entering,
.tree-file.is-entering { animation: tree-node-in 220ms cubic-bezier(.22, 1, .36, 1) both; }

.project-item,
.tree-folder,
.tree-file {
  color: var(--text-soft);
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.project-item {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: 38px;
  padding: 8px 11px;
  background: #191a1d;
  border-radius: 10px;
  font-size: 14.5px;
  font-weight: 550;
}

.project-item:hover,
.project-item:focus-visible { color: var(--text); background: #202226; border-color: #34383e; }
.project-item.is-active { color: #ffffff; background: #282b30; border-color: #454a52; }

.project-tree-content {
  display: grid;
  gap: 1px;
  margin: 4px 0 4px 13px;
  padding-left: 11px;
  border-left: 1px solid #272a2f;
}

.project-tree-shell,
.tree-children-shell {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transform: translateY(-3px);
  transition: grid-template-rows 220ms cubic-bezier(.22, 1, .36, 1), opacity 160ms ease, transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.project-tree-shell.is-expanded,
.tree-children-shell.is-expanded {
  grid-template-rows: 1fr;
  opacity: 1;
  transform: translateY(0);
}

.project-tree-shell > .project-tree-content,
.tree-children-shell > .tree-children {
  min-height: 0;
  overflow: hidden;
}

.project-tree-loading {
  margin: 5px 0 7px 24px;
  padding-left: 11px;
  color: var(--text-faint);
  border-left: 1px solid #30333a;
  font-size: 11px;
}

.tree-folder,
.tree-file {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  display: grid;
  align-items: center;
  gap: 6px;
  padding: 4px 7px;
  border-radius: var(--radius-control);
  font-size: 13px;
  line-height: 1.45;
}

.tree-folder {
  grid-template-columns: minmax(0, 1fr) auto;
  padding-left: 10px;
  color: #c4c8cf;
  font-weight: 400;
}

.tree-folder.depth-1 {
  min-height: 31px;
  margin-top: 5px;
  color: #e1e3e6;
  font-size: 13.5px;
  font-weight: 500;
}

.project-tree-content > .tree-folder:first-child { margin-top: 0; }
.tree-folder.depth-2,
.tree-file.depth-2 {
  min-height: 29px;
  font-size: 13px;
}

.tree-folder.depth-3,
.tree-file.depth-3,
.tree-folder.depth-4,
.tree-file.depth-4 {
  min-height: 27px;
  color: #b5bac2;
  font-size: 12.5px;
}
.tree-file {
  --file-effect: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  padding-left: 10px;
  color: color-mix(in srgb, #f5f6f7 calc(var(--file-effect) * 100%), var(--text-faint));
}
.tree-children {
  display: grid;
  gap: 1px;
  margin-left: 9px;
  padding-left: 8px;
  border-left: 1px solid #24272c;
}

.tree-folder:hover,
.tree-folder:focus-visible { color: var(--text); background: var(--bg-hover); border-color: #30333a; }
.tree-folder.depth-1.is-expanded { color: #f0f1f2; }
.tree-folder:not(.depth-1).is-expanded { color: #d1d4d9; }

.tree-file:hover { color: var(--text); background: transparent; border-color: transparent; }
.tree-file:focus-visible { color: var(--text); background: transparent; border-color: transparent; }

.tree-file.is-active { --file-effect: 1; color: #ffffff; background: transparent; border-color: transparent; }
.tree-file.is-empty { color: var(--text-faint); }
.tree-file.is-empty:hover,
.tree-file.is-empty:focus-visible { color: var(--text-soft); }
.tree-file.is-active.is-empty { color: #ffffff; }

.tree-file .tree-label {
  transition: color 180ms ease, opacity 180ms ease, font-weight 180ms ease;
}

.tree-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@keyframes project-item-in {
  from { opacity: 0; transform: scale(.97) translateY(4px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes tree-node-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.sidebar-empty {
  padding: 14px 20px;
  color: var(--text-faint);
  font-size: 12px;
  line-height: 1.7;
}

.sidebar-footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 13px;
  color: var(--text-faint);
  border-top: 1px solid var(--line);
  font-size: 11px;
}

.main-pane {
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--bg-main);
  container-type: inline-size;
  container-name: main-pane;
}

.document-header {
  height: 42px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 18px;
  border-bottom: 1px solid var(--line);
}

.document-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.document-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  background: #17181b;
  border: 1px solid #30333a;
  border-radius: 10px;
}

.document-view-switch[hidden] { display: none; }

.document-view-button {
  min-height: 28px;
  padding: 0 10px;
  color: var(--text-faint);
  background: transparent;
  border: 0;
  border-radius: 7px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 650;
  transition: color 160ms ease, background-color 160ms ease;
}

.document-view-button:hover { color: var(--text-soft); }
.document-view-button.is-selected { color: #ffffff; background: #2a2d32; }

.breadcrumbs {
  overflow: hidden;
  color: var(--text-faint);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.welcome-view {
  width: min(680px, calc(100% - 48px));
  margin: auto;
  padding-bottom: 7vh;
}

.welcome-copy { margin-bottom: 35px; }

.eyebrow,
.block-label {
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.welcome-copy h1,
.project-heading h1 {
  margin: 12px 0 13px;
  color: #ffffff;
  font-family: var(--font-ui);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 700;
  letter-spacing: normal;
}

.welcome-copy p,
.project-subtitle {
  max-width: 580px;
  margin: 0;
  color: var(--text-soft);
  line-height: 1.8;
}

.new-project-form {
  padding: 22px;
  background: var(--bg-panel);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-surface);
  box-shadow: 0 18px 40px rgba(0,0,0,.24);
}

.new-project-form label {
  display: flex;
  justify-content: space-between;
  margin: 0 0 7px;
  color: var(--text-soft);
  font-size: 12px;
}

.new-project-form label:not(:first-child) { margin-top: 17px; }
.new-project-form label span { color: var(--text-faint); }

input,
textarea {
  width: 100%;
  color: var(--text);
  background: var(--bg-main);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-control);
}

input { height: 37px; padding: 0 10px; }
textarea { padding: 10px 11px; line-height: 1.65; resize: vertical; }
input::placeholder, textarea::placeholder { color: #7d838c; }

.form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 16px;
  color: var(--text-faint);
  font-size: 12px;
}

.primary-button {
  min-height: 36px;
  padding: 0 16px;
  color: #101113;
  background: var(--accent);
  border: 1px solid #f4f5f6;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 700;
}

.primary-button:hover { background: #ffffff; }

.project-view {
  position: relative;
  min-height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.project-view[hidden], .welcome-view[hidden] { display: none; }

.conversation-minimap {
  position: absolute;
  z-index: 4;
  top: 58px;
  bottom: calc(var(--composer-height) + 30px);
  left: 18px;
  width: 44px;
  display: flex;
  align-items: center;
  pointer-events: none;
}

.conversation-minimap[hidden] { display: none; }

.conversation-minimap-track {
  width: 44px;
  max-height: 100%;
  display: grid;
  justify-items: start;
  align-content: center;
  gap: 3px;
  overflow-y: auto;
  padding: 16px 0;
  scrollbar-width: none;
  mask-image: linear-gradient(to bottom, transparent, #000 18px, #000 calc(100% - 18px), transparent);
  pointer-events: auto;
}

.conversation-minimap-track::-webkit-scrollbar { display: none; }

.conversation-minimap-tick {
  position: relative;
  width: 44px;
  height: 9px;
  padding: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.conversation-minimap-tick::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: var(--tick-length, 8px);
  height: var(--tick-height, 2px);
  background: #484b51;
  border-radius: 999px;
  transform: translateY(-50%);
  transform-origin: left center;
  transition: width 80ms ease-out, height 80ms ease-out, background-color 70ms ease-out;
}

.conversation-minimap-tick.is-active::before {
  background: #f4f5f6;
}

.conversation-minimap-tick:focus-visible {
  outline: 1px solid #dfe2e7;
  outline-offset: 1px;
}

.conversation-minimap-preview {
  position: fixed;
  z-index: 60;
  width: 276px;
  padding: 13px 14px;
  color: var(--text);
  background: #24262a;
  border: 1px solid #3b3f46;
  border-radius: 14px;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .36);
  opacity: 0;
  transform: translateX(-5px) scale(.985);
  transform-origin: left center;
  transition: opacity 70ms ease-out, transform 80ms ease-out;
  pointer-events: none;
}

.conversation-minimap-preview[hidden] { display: none; }
.conversation-minimap-preview.is-visible { opacity: 1; transform: translateX(0) scale(1); }
.conversation-minimap-preview strong { display: block; margin-bottom: 5px; color: #ffffff; font-size: 13px; }
.conversation-minimap-preview span { display: block; color: #bdc1c8; font-size: 12px; line-height: 1.6; }

.detail-thread-view {
  width: 100%;
  min-height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 28px 0 18px;
}

.detail-thread-view[hidden] { display: none; }

.world-document-view,
.relationship-view {
  width: 100%;
  min-height: 0;
  flex: 1;
  margin: 0;
  padding: 48px 24px 36px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.world-document-view[hidden],
.relationship-view[hidden] { display: none; }

/* These two records can be substantially longer than ordinary document pages.
   Promote their existing enter animation before it starts so first-frame paint
   does not compete with the small horizontal transform. */
.world-document-view[data-document-kind="validation"],
.world-document-view[data-document-kind="release-readiness"] {
  will-change: transform, opacity;
}

.world-document-heading {
  width: min(860px, 100%);
  margin-right: auto;
  margin-bottom: 28px;
  margin-left: auto;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--line);
}

.world-document-heading h1 {
  margin: 9px 0 8px;
  color: #ffffff;
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 700;
}

.world-document-heading p {
  max-width: 650px;
  margin: 0;
  color: var(--text-soft);
  line-height: 1.7;
}

.world-document-content {
  width: min(860px, 100%);
  margin-right: auto;
  margin-left: auto;
}

.relationship-view .world-document-heading,
.relationship-canvas {
  width: min(1240px, 100%);
  margin-right: auto;
  margin-left: auto;
}

.relationship-view .world-document-heading {
  margin-bottom: 20px;
  padding-bottom: 16px;
}

.world-document-content { display: grid; gap: 14px; }

.progressive-dom-item {
  content-visibility: auto;
  contain-intrinsic-size: auto 240px;
}

.document-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.document-summary-grid article {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 16px;
  background: #17191c;
  border: 1px solid #32363d;
  border-radius: 12px;
}

.document-summary-grid span { color: var(--text-soft); font-size: 12px; }
.document-summary-grid strong { color: #ffffff; font-size: 22px; font-variant-numeric: tabular-nums; }

.document-section-card,
.document-entry-card,
.document-empty {
  padding: 18px 19px;
  background: #15171a;
  border: 1px solid #30343b;
  border-radius: 12px;
}

.document-entry-list { display: grid; gap: 10px; }
.document-entry-card.is-pending { border-color: #494f59; }

.document-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  color: var(--text-faint);
  font-size: 11px;
}

.document-section-card h2,
.document-entry-card h2 {
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 16px;
}

.document-section-card p,
.document-entry-card p,
.document-empty p {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.75;
}

.document-empty { padding: 28px; text-align: center; }
.document-empty strong { display: block; margin-bottom: 7px; color: #ffffff; }
.document-empty p { max-width: 560px; margin-inline: auto; font-size: 12px; }

.text-status { color: #ffffff; font-weight: 650; }
.text-status.is-confirmed::before,
.text-status.is-pending::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: #a8b8aa;
  vertical-align: 1px;
}
.text-status.is-pending::before { background: #b9a98f; }

.document-entry-open {
  width: 100%;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.document-entry-open:hover {
  background: #1a1c20;
  border-color: #4a4f57;
}

.document-entry-open:active { background: #202329; }

.overview-section,
.setting-identity {
  padding: 18px 19px;
  background: #15171a;
  border: 1px solid #30343b;
  border-radius: 12px;
}

.overview-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.overview-section-heading span { color: var(--text-faint); font-size: 11px; }
.overview-section-heading h2 { margin: 4px 0 0; color: #ffffff; font-size: 17px; }
.overview-section-heading > strong { color: var(--text-soft); font-size: 13px; font-variant-numeric: tabular-nums; }
.overview-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

.overview-setting-card {
  min-width: 0;
  padding: 15px;
  color: inherit;
  text-align: left;
  background: #191b1f;
  border: 1px solid #343840;
  border-radius: 10px;
}

.overview-setting-card h3 { margin: 11px 0 7px; color: #ffffff; font-size: 15px; }
.overview-setting-card p { margin: 0; color: var(--text-soft); line-height: 1.65; }
.setting-metadata { display: flex; flex-wrap: wrap; gap: 6px; }
.setting-metadata span { padding: 3px 7px; color: #dfe1e5; font-size: 10px; line-height: 1.2; background: #25282e; border-radius: 999px; }

.overview-change-list { display: grid; gap: 0; }
.overview-change-list article { padding: 12px 0; border-top: 1px solid var(--line); }
.overview-change-list article:first-child { padding-top: 0; border-top: 0; }
.overview-change-list article:last-child { padding-bottom: 0; }
.overview-change-list article > div { display: flex; justify-content: space-between; gap: 12px; }
.overview-change-list strong { color: #ffffff; font-size: 13px; }
.overview-change-list span { color: var(--text-faint); font-size: 11px; }
.overview-change-list p { margin: 6px 0 0; color: var(--text-soft); font-size: 12px; }
.overview-next-action { border-color: #41464f; }

.setting-identity { display: grid; gap: 14px; }
.setting-identity dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; margin: 0; }
.setting-identity dl > div { min-width: 0; }
.setting-identity dt { color: var(--text-faint); font-size: 10px; }
.setting-identity dd { overflow: hidden; margin: 4px 0 0; color: #f5f6f7; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.setting-identity > p { margin: 0; color: var(--text-faint); font-size: 11px; line-height: 1.6; }

.text-status.is-draft { color: var(--text-soft); }
.text-status.is-draft::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: #d7d9dd;
  vertical-align: 1px;
}

.setting-editor-toolbar {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 2px;
}

.setting-back-button {
  min-height: 36px;
  padding: 0 12px;
  color: var(--text-soft);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-control);
  cursor: pointer;
}

.setting-back-button:hover { color: #ffffff; background: var(--bg-hover); }

.setting-save-state {
  color: var(--text-faint);
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}

.setting-save-state::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 50%;
  background: #7d828a;
  vertical-align: 1px;
}

.setting-save-state[data-state="saving"]::before { animation: setting-save-pulse 900ms ease-in-out infinite alternate; }
.setting-save-state[data-state="pending"]::before { background: #bfc3c9; }
.setting-save-state[data-state="error"] { color: var(--danger); }
.setting-save-state[data-state="error"]::before { background: currentColor; }

@keyframes setting-save-pulse {
  from { opacity: .35; }
  to { opacity: 1; }
}

.setting-editor,
.setting-relation-panel,
.setting-history-panel,
.setting-checkpoint-panel {
  padding: 22px;
  background: #15171a;
  border: 1px solid #30343b;
  border-radius: var(--radius-surface);
}

.setting-editor { display: grid; gap: 18px; }

.setting-relation-panel { display: grid; gap: 14px; }

.relation-proposal-form {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(120px, .8fr) minmax(110px, .7fr) auto;
  align-items: end;
  gap: 10px;
}

.relation-proposal-form label { display: grid; gap: 7px; min-width: 0; }
.relation-proposal-form label > span { color: var(--text-faint); font-size: 11px; }
.relation-temporal-field { grid-column: 1 / 4; }
.relation-temporal-field[hidden] { display: none; }
.relation-proposal-form select,
.relation-proposal-form input,
.relationship-filter select {
  min-height: 44px;
  padding: 0 12px;
  color: #f7f7f8;
  background: #1b1d21;
  border: 1px solid #3b4048;
  border-radius: 9px;
}

.relation-proposal-form select:focus-visible,
.relation-proposal-form input:focus-visible,
.relationship-filter select:focus-visible,
.relation-confirm-button:focus-visible,
.relation-open-graph:focus-visible,
.relation-node:focus-visible,
.relationship-index-card button:focus-visible {
  outline: 2px solid #d9dce1;
  outline-offset: 2px;
}

.pending-relation-list,
.confirmed-relation-list { display: grid; gap: 8px; }
.pending-relation-list article,
.confirmed-relation-list > article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 13px;
  background: #191b1f;
  border: 1px solid #343840;
  border-radius: 10px;
}

.pending-relation-list article > div,
.confirmed-relation-list article > div { display: grid; gap: 5px; min-width: 0; }
.pending-relation-list strong,
.confirmed-relation-list strong { color: #f5f6f7; font-size: 12px; line-height: 1.5; }
.confirmed-relation-list article span { color: var(--text-faint); font-size: 10px; }
.relation-confirm-button,
.relation-open-graph {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 0 13px;
  color: #f3f4f6;
  background: transparent;
  border: 1px solid #4c525c;
  border-radius: 9px;
  cursor: pointer;
  transition: color .16s ease, background .16s ease, border-color .16s ease;
}
.relation-confirm-button:hover,
.relation-open-graph:hover { color: #ffffff; background: #292d33; border-color: #707783; }

.setting-field,
.setting-summary-field,
.checkpoint-form label {
  display: grid;
  gap: 7px;
  color: var(--text-soft);
  font-size: 12px;
}

.setting-field input,
.setting-field textarea,
.setting-summary-field input,
.checkpoint-form input {
  width: 100%;
  color: #ffffff;
  background: #101215;
  border: 1px solid #393d45;
  border-radius: 10px;
}

.setting-field input,
.setting-summary-field input,
.checkpoint-form input {
  min-height: 42px;
  padding: 0 13px;
}

.setting-field textarea {
  min-height: 240px;
  padding: 12px 13px;
  resize: vertical;
  line-height: 1.75;
}

.setting-field input:hover,
.setting-field textarea:hover,
.setting-summary-field input:hover,
.checkpoint-form input:hover { border-color: #505660; }

.setting-field input::placeholder,
.setting-field textarea::placeholder,
.setting-summary-field input::placeholder,
.checkpoint-form input::placeholder { color: #7f848c; }

.setting-helper {
  margin: -4px 0 0;
  color: var(--text-faint);
  font-size: 12px;
  line-height: 1.65;
}

.setting-commit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  padding-top: 2px;
}

.setting-primary-button,
.setting-secondary-button {
  min-height: 42px;
  padding: 0 15px;
  border-radius: 11px;
  cursor: pointer;
  white-space: nowrap;
}

.setting-primary-button {
  color: #101113;
  background: var(--accent);
  border: 1px solid #f4f5f6;
  font-weight: 650;
}

.setting-primary-button:hover { background: #ffffff; }

.setting-secondary-button {
  color: var(--text-soft);
  background: #202328;
  border: 1px solid #41464f;
}

.setting-secondary-button:hover { color: #ffffff; background: #292d33; border-color: #5e6570; }

.setting-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 17px;
}

.setting-section-heading span { color: var(--text-faint); font-size: 11px; }
.setting-section-heading h2 { margin: 4px 0 0; color: #ffffff; font-size: 17px; font-weight: 600; }
.setting-section-heading > strong {
  min-width: 28px;
  color: var(--text-soft);
  font-size: 13px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.setting-history-list,
.checkpoint-list { display: grid; gap: 1px; }

.setting-history-list > article,
.checkpoint-list > article {
  padding: 14px 0;
  border-top: 1px solid var(--line);
}

.sidebar-footer > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.setting-history-list > article:first-child,
.checkpoint-list > article:first-child { border-top: 0; }

.setting-history-list article > div,
.checkpoint-list article > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.setting-history-list strong,
.checkpoint-list strong { color: var(--text); font-size: 13px; font-weight: 550; }
.setting-history-list span,
.checkpoint-list span,
.setting-history-list time { color: var(--text-faint); font-size: 11px; }
.setting-history-list p,
.checkpoint-list p { margin: 6px 0 0; color: var(--text-soft); line-height: 1.65; }
.setting-history-list time { display: block; margin-top: 7px; }

.checkpoint-form {
  display: grid;
  grid-template-columns: minmax(150px, .75fr) minmax(220px, 1fr) auto;
  align-items: end;
  gap: 10px;
  margin-bottom: 13px;
}

.checkpoint-list:empty::before {
  content: "还没有保存点";
  display: block;
  padding-top: 13px;
  color: var(--text-faint);
  border-top: 1px solid var(--line);
  font-size: 12px;
}

.relationship-canvas { display: grid; gap: 14px; }

.relationship-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.relationship-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  color: var(--text-faint);
  font-size: 11px;
}

.relationship-legend span::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 1px;
  margin-right: 6px;
  background: #5d626b;
  vertical-align: 3px;
}

.relationship-filter { display: flex; align-items: center; gap: 8px; color: var(--text-faint); font-size: 11px; }
.relationship-filter select { min-height: 38px; }

.relationship-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

#relationship-reset-layout {
  min-height: 38px;
  padding: 0 12px;
  color: var(--text-soft);
  background: #1b1d20;
  border: 1px solid #383d45;
  border-radius: 9px;
  cursor: pointer;
  transition: color .16s ease, background .16s ease, border-color .16s ease;
}

#relationship-reset-layout:hover { color: #ffffff; background: #24272c; border-color: #5b626d; }

.relationship-drift-field {
  --graph-pointer-x: 50%;
  --graph-pointer-y: 50%;
  position: relative;
  min-height: clamp(560px, calc(100dvh - 285px), 820px);
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,255,255,.018), transparent 42%),
    #111315;
  border: 1px solid #30343b;
  border-radius: 14px;
  outline: none;
  isolation: isolate;
  touch-action: none;
}

.relationship-drift-field::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: radial-gradient(circle 100px at var(--graph-pointer-x) var(--graph-pointer-y), rgba(255,255,255,.045), rgba(255,255,255,.01) 34%, transparent 72%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .1s ease;
}

.relationship-drift-field.has-pointer::before { opacity: 1; }
.relationship-drift-field:focus-visible { border-color: #6a717c; box-shadow: 0 0 0 2px rgba(255,255,255,.09); }

.relationship-drift-links,
.relationship-drift-labels,
.relationship-drift-nodes {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.relationship-drift-links { z-index: 1; overflow: visible; pointer-events: none; }
.relationship-drift-links line {
  stroke: #4c5159;
  stroke-width: 1.1;
  stroke-linecap: round;
  opacity: .58;
  transition: stroke .18s ease, stroke-width .18s ease, opacity .18s ease;
}
.relationship-drift-links marker path { fill: #626872; }
.relationship-drift-links line.is-active { stroke: #d5d8dd; stroke-width: 1.45; opacity: .9; }
.relationship-drift-links line.is-pulsing { animation: relationship-thread-pulse .34s ease-out; }

@keyframes relationship-thread-pulse {
  0% { stroke-dasharray: 4 11; stroke-dashoffset: 30; opacity: .38; }
  55% { stroke-dasharray: 9 6; stroke-dashoffset: 8; opacity: .95; }
  100% { stroke-dasharray: 0; stroke-dashoffset: 0; opacity: .58; }
}

.relationship-drift-labels { z-index: 2; pointer-events: none; }
.relationship-drift-labels span {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 120px;
  padding: 3px 7px;
  overflow: hidden;
  color: #9298a2;
  font-size: 10px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(17,19,21,.88);
  border: 1px solid rgba(76,81,89,.55);
  border-radius: 999px;
  opacity: .78;
  transition: color .16s ease, border-color .16s ease, opacity .16s ease;
  will-change: transform;
}
.relationship-drift-labels span.is-active { color: #ffffff; border-color: #777e89; opacity: 1; }

.relationship-drift-nodes { z-index: 3; pointer-events: none; }
.relationship-drift-node {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 104px;
  max-width: 184px;
  min-height: 48px;
  padding: 0 15px;
  overflow: hidden;
  color: #f1f2f4;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(28,30,34,.96);
  border: 1px solid #41464f;
  border-radius: 12px;
  box-shadow: 0 10px 26px rgba(0,0,0,.16);
  cursor: grab;
  pointer-events: auto;
  user-select: none;
  will-change: transform;
  transition: color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.relationship-drift-node strong {
  display: block;
  overflow: hidden;
  font-size: 13px;
  font-weight: 560;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.relationship-drift-node:hover,
.relationship-drift-node.is-hovered,
.relationship-drift-node:focus-visible {
  color: #ffffff;
  background: #272a2f;
  border-color: #777e89;
  box-shadow: 0 15px 34px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.035);
  outline: none;
}
.relationship-drift-node.is-center { min-height: 54px; border-color: #717781; background: #24272b; }
.relationship-drift-node.is-secondary { opacity: .76; }
.relationship-drift-node.is-related { color: #ffffff; border-color: #626873; opacity: 1; }
.relationship-drift-node.is-muted { opacity: .34; }
.relationship-drift-node.is-dragging { z-index: 6; cursor: grabbing; background: #2b2e33; border-color: #9198a3; box-shadow: 0 20px 42px rgba(0,0,0,.36); }

.relationship-drift-preview {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  width: min(280px, calc(100% - 28px));
  padding: 14px 15px 15px;
  background: rgba(29,31,35,.97);
  border: 1px solid #505660;
  border-radius: 13px;
  box-shadow: 0 20px 46px rgba(0,0,0,.38);
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease, border-color .14s ease;
  will-change: transform, opacity;
}
.relationship-drift-preview.is-visible { opacity: 1; }
.relationship-drift-preview > span { color: #9da3ad; font-size: 10px; }
.relationship-drift-preview strong { display: block; margin-top: 5px; color: #ffffff; font-size: 14px; font-weight: 590; }
.relationship-drift-preview p { margin: 8px 0 0; color: #d3d6db; font-size: 12px; line-height: 1.65; }

.relationship-drift-hint {
  position: absolute;
  right: 16px;
  bottom: 12px;
  z-index: 4;
  margin: 0;
  color: #777d87;
  font-size: 10px;
  pointer-events: none;
}

.relationship-list-fallback {
  background: #15171a;
  border: 1px solid #30343b;
  border-radius: 11px;
}
.relationship-list-fallback summary { padding: 12px 14px; color: var(--text-soft); font-size: 12px; cursor: pointer; }
.relationship-list-fallback > div { display: grid; gap: 7px; padding: 0 12px 12px; }
.relationship-list-fallback article { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 10px; }
.relationship-list-fallback article span { color: var(--text-faint); font-size: 10px; text-align: center; }
.relationship-list-fallback article button {
  min-height: 40px;
  padding: 0 11px;
  overflow: hidden;
  color: #eef0f2;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #1c1e22;
  border: 1px solid #393e46;
  border-radius: 9px;
  cursor: pointer;
}
.relationship-list-fallback article button:last-child { text-align: right; }
.relationship-list-fallback p { margin: 0; padding: 4px 2px 2px; color: var(--text-faint); font-size: 11px; }

.relationship-index-list { display: grid; gap: 8px; }
.relationship-index-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 11px 13px;
  background: #15171a;
  border: 1px solid #30343b;
  border-radius: 11px;
}
.relationship-index-card > span { color: var(--text-faint); font-size: 11px; text-align: center; }
.relationship-index-card button {
  min-height: 44px;
  padding: 0 12px;
  overflow: hidden;
  color: #f5f6f7;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #1b1d20;
  border: 1px solid #383d45;
  border-radius: 9px;
  cursor: pointer;
  transition: color .16s ease, background .16s ease, border-color .16s ease;
}
.relationship-index-card button:last-child { text-align: right; }
.relationship-index-card button:hover { color: #ffffff; background: #22252a; border-color: #5b626d; }

.relationship-map {
  position: relative;
  min-height: 420px;
  display: grid;
  grid-template-columns: minmax(170px, .75fr) minmax(260px, 1.5fr);
  align-items: center;
  gap: 70px;
  padding: 34px;
  overflow: hidden;
  background: #131416;
  border: 1px solid #30343b;
  border-radius: 14px;
}

.relation-spokes {
  position: absolute;
  top: 50%;
  left: 23%;
  width: 55%;
  height: 70%;
  border: 1px solid #30343a;
  border-right: 0;
  transform: translateY(-50%);
  pointer-events: none;
}

.relation-node {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 13px 14px;
  background: #1b1d20;
  border: 1px solid #3a3f47;
  border-radius: 12px;
}

button.relation-node {
  width: 100%;
  min-height: 54px;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: color .16s ease, background .16s ease, border-color .16s ease, opacity .16s ease;
}
button.relation-node:hover { background: #23262b; border-color: #69717d; }

.relation-node strong {
  display: block;
  overflow: hidden;
  color: #f7f7f8;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.relation-node span { display: block; margin-top: 4px; color: var(--text-faint); font-size: 10px; }
.relation-node.is-center { padding: 19px; border-color: #666c75; box-shadow: 0 14px 35px rgba(0,0,0,.25); }
.relation-node.is-confirmed { border-left: 2px solid #8fa492; }
.relation-node.is-pending { border-left: 2px solid #a6977e; }
.relation-node.is-secondary { opacity: .72; }
.relation-layers { display: grid; gap: 20px; min-width: 0; }
.relation-layers section { display: grid; gap: 9px; }
.relation-layers h2 { margin: 0; color: var(--text-faint); font-size: 11px; font-weight: 500; }
.relation-neighbors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.relation-neighbors.is-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.relation-neighbors > .document-empty { grid-column: 1 / -1; }

.detail-thread-header {
  width: min(760px, calc(100% - 48px));
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  margin: 0 auto;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.detail-back-button {
  min-height: 32px;
  padding: 0 11px;
  color: var(--text-soft);
  background: #202226;
  border: 1px solid #3b4048;
  border-radius: 10px;
  cursor: pointer;
}

.detail-back-button:hover { color: #ffffff; background: #292c31; }
.detail-thread-kicker { color: var(--text-faint); font-size: 11px; letter-spacing: .04em; }
.detail-thread-header h2 { margin: 5px 0 4px; color: #ffffff; font-size: 20px; }
.detail-thread-header p { margin: 0; color: var(--text-faint); font-size: 12px; }

.detail-message-stream {
  min-height: 0;
  flex: 1;
  display: grid;
  align-content: start;
  gap: 16px;
  padding: 22px max(24px, calc((100% - 760px) / 2));
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.detail-message { max-width: 88%; }
.detail-message-role { margin-bottom: 5px; color: var(--text-faint); font-size: 11px; }
.detail-message p { margin: 0; color: var(--text-soft); line-height: 1.75; white-space: pre-wrap; }
.detail-message.role-user { justify-self: end; padding: 11px 14px; background: #282a2e; border-radius: 16px; }
.detail-message.role-user .detail-message-role { color: #ffffff; }
.detail-message.role-assistant { padding-left: 15px; border-left: 1px solid var(--line-strong); }

.detail-confirm-panel {
  width: min(760px, calc(100% - 48px));
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 auto 10px;
  padding: 12px 14px;
  background: #181a1d;
  border: 1px solid #40454e;
  border-radius: var(--radius-surface);
}

.detail-confirm-panel strong { display: block; color: #ffffff; font-size: 13px; }
.detail-confirm-panel span { display: block; margin-top: 2px; color: var(--text-faint); font-size: 11px; }

.detail-confirm-button,
.detail-send-button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 13px;
  color: #101113;
  background: var(--accent);
  border: 1px solid #f4f5f6;
  border-radius: 11px;
  cursor: pointer;
  font-weight: 700;
}

.detail-confirm-button:hover,
.detail-send-button:hover { background: #ffffff; }

.detail-confirm-button {
  min-height: 44px;
  padding: 0 16px;
  color: #f4f5f7;
  background: linear-gradient(145deg, #26292e, #17191c 62%, #202329);
  border-color: #4a4f57;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 0 rgba(0,0,0,.28),
    0 8px 20px rgba(0,0,0,.2);
  text-shadow: 0 1px 1px rgba(0,0,0,.4);
  transition:
    color 150ms ease,
    background-color 150ms ease,
    border-color 150ms ease,
    box-shadow 180ms ease,
    transform 120ms ease;
}

.checkpoint-restore-button {
  margin-top: 10px;
  padding: 0;
  color: #6740d8;
  background: transparent;
  border: 0;
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
}
.checkpoint-restore-button:hover { color: #8a39e8; }
.checkpoint-restore-button:focus-visible { outline: 2px solid rgba(104, 64, 216, .34); outline-offset: 4px; }

.restore-dialog {
  position: fixed;
  z-index: 960;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}
.restore-dialog[hidden] { display: none; }
.restore-dialog-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(45, 35, 55, .3); backdrop-filter: blur(2px); }
.restore-dialog-panel {
  position: relative;
  width: min(600px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  color: #302a36;
  background: #fbfafc;
  border: 1px solid #d8d2dc;
  border-radius: 9px;
  box-shadow: 0 24px 70px rgba(46, 36, 56, .22);
}
.restore-dialog-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e4e0e7; }
.restore-dialog-panel > header > div { display: grid; gap: 2px; }
.restore-dialog-panel > header span { color: #7b43df; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.restore-dialog-panel h2 { margin: 0; color: #29232f; font-size: 20px; }
.restore-dialog-content { min-height: 0; overflow: auto; padding: 22px; }
.restore-dialog-panel > footer { display: flex; justify-content: flex-end; gap: 9px; padding: 14px 20px; background: #fff; border-top: 1px solid #e4e0e7; }
.restore-dialog-panel > footer button { min-height: 39px; padding: 0 16px; color: #fff; background: #6838df; border: 1px solid #6838df; border-radius: 6px; font-size: 12px; font-weight: 750; cursor: pointer; }
.restore-dialog-panel > footer button:hover:not(:disabled) { background: #8a39e8; border-color: #8a39e8; }
.restore-dialog-panel > footer button:disabled { color: #aaa3af; background: #ece9ef; border-color: #e1dde5; cursor: not-allowed; }
.restore-dialog-panel > footer .is-secondary { color: #5e5664; background: #fff; border-color: #d8d2dc; }
.restore-dialog-panel > footer .is-secondary:hover { color: #6838df; background: #f7f4fc; border-color: #c9bced; }
.restore-loading { min-height: 210px; display: grid; place-content: center; gap: 7px; text-align: center; }
.restore-loading strong { color: #322b38; font-size: 15px; }
.restore-loading p { margin: 0; color: #766f7d; font-size: 12px; }
.restore-loading.is-error strong { color: var(--danger-text); text-decoration: underline 2px var(--danger); text-underline-offset: 4px; }
.restore-source { padding-bottom: 18px; }
.restore-source > span { color: #7b43df; font-size: 10px; font-weight: 700; }
.restore-source h3 { margin: 4px 0 5px; color: #29232f; font-size: 18px; }
.restore-source p { margin: 0; color: #766f7d; font-size: 11.5px; }
.restore-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; background: #dfd9e5; border-radius: 7px; }
.restore-summary article { display: grid; gap: 3px; padding: 14px; background: #fff; }
.restore-summary strong { color: #6838df; font-size: 20px; }
.restore-summary span { color: #6d6573; font-size: 10.5px; }
.restore-change-list { margin-top: 22px; }
.restore-change-list h3 { margin: 0 0 8px; color: #514957; font-size: 11px; }
.restore-change-item { display: flex; justify-content: space-between; gap: 18px; padding: 10px 0; border-top: 1px solid #e5e1e8; }
.restore-change-item strong { color: #332c38; font-size: 12px; }
.restore-change-item span { color: #776f7d; font-size: 10.5px; text-align: right; }
.restore-preserve-note { display: grid; grid-template-columns: auto 1fr; gap: 11px; margin-top: 20px; padding: 15px; color: #392d4a; background: #f0eaff; border-radius: 7px; }
.restore-preserve-note svg { width: 20px; height: 20px; fill: none; stroke: #7a3ee2; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.restore-preserve-note strong { font-size: 12px; }
.restore-preserve-note p { margin: 4px 0 0; color: #685d73; font-size: 11px; line-height: 1.65; }
.restore-warnings { margin-top: 16px; padding-left: 12px; border-left: 3px solid var(--danger); }
.restore-warnings p { margin: 0; color: #6e405c; font-size: 11.5px; line-height: 1.65; }
.restore-warnings p + p { margin-top: 6px; }

@media (max-width: 520px) {
  .restore-dialog { padding: 12px; }
  .restore-dialog-panel { max-height: calc(100vh - 24px); border-radius: 7px; }
  .restore-summary { grid-template-columns: 1fr; }
  .restore-dialog-panel > footer { align-items: stretch; flex-direction: column-reverse; }
  .restore-dialog-panel > footer button { width: 100%; }
  .restore-change-item { align-items: flex-start; flex-direction: column; gap: 3px; }
  .restore-change-item span { text-align: left; }
}

.detail-confirm-button:hover {
  color: #ffffff;
  background: linear-gradient(145deg, #2c3036, #1a1c20 62%, #25282d);
  border-color: #5b616b;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.3),
    0 10px 24px rgba(0,0,0,.24);
}

.detail-confirm-button:active { transform: scale(.985); }

.detail-composer {
  width: min(760px, calc(100% - 48px));
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin: 0 auto;
  padding: 12px;
  background: #1b1d20;
  border: 1px solid #343840;
  border-radius: var(--radius-composer);
  box-shadow: 0 16px 32px rgba(0,0,0,.22);
}

.detail-composer textarea {
  min-height: 62px;
  max-height: 150px;
  padding: 8px 9px;
  background: transparent;
  border-color: transparent;
  resize: none;
}

.detail-composer textarea:focus-visible { border-color: #4c535e; outline-offset: 0; }

.project-document {
  width: 100%;
  min-height: 0;
  flex: 1;
  margin: 0;
  padding: 0;
  overflow-y: auto;
}

.project-document-content {
  width: min(760px, calc(100% - 48px));
  min-height: 100%;
  margin: 0 auto;
  padding: 54px 0 calc(var(--composer-height) + 28px);
}

.project-document::-webkit-scrollbar,
.detail-message-stream::-webkit-scrollbar,
.world-document-view::-webkit-scrollbar,
.relationship-view::-webkit-scrollbar,
.context-content::-webkit-scrollbar { width: var(--scrollbar-size); }

.project-document::-webkit-scrollbar-track,
.detail-message-stream::-webkit-scrollbar-track,
.world-document-view::-webkit-scrollbar-track,
.relationship-view::-webkit-scrollbar-track,
.context-content::-webkit-scrollbar-track {
  margin-block: 6px;
  background: transparent;
}

.project-document::-webkit-scrollbar-button,
.detail-message-stream::-webkit-scrollbar-button,
.world-document-view::-webkit-scrollbar-button,
.relationship-view::-webkit-scrollbar-button,
.context-content::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

.project-document::-webkit-scrollbar-thumb,
.detail-message-stream::-webkit-scrollbar-thumb,
.world-document-view::-webkit-scrollbar-thumb,
.relationship-view::-webkit-scrollbar-thumb,
.context-content::-webkit-scrollbar-thumb {
  min-height: 38px;
  background: var(--scrollbar-thumb);
  background-clip: padding-box;
  border: calc((var(--scrollbar-size) - var(--scrollbar-thumb-size)) / 2) solid transparent;
  border-radius: 999px;
}

.project-document::-webkit-scrollbar-thumb:hover,
.detail-message-stream::-webkit-scrollbar-thumb:hover,
.world-document-view::-webkit-scrollbar-thumb:hover,
.relationship-view::-webkit-scrollbar-thumb:hover,
.context-content::-webkit-scrollbar-thumb:hover { background-color: var(--scrollbar-thumb-hover); }

.project-heading { margin-bottom: 38px; }
.project-heading h1 { font-size: clamp(29px, 3vw, 40px); }

.source-note {
  margin-bottom: 35px;
  padding: 18px 20px;
  background: #141517;
  border: 1px solid var(--line);
  border-left: 2px solid var(--accent);
  border-radius: 0;
}

.source-note blockquote {
  margin: 10px 0 0;
  color: #f0f1f2;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.8;
}

.canon-ledger,
.proposal-center {
  margin-bottom: 34px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-surface);
  background: #15171a;
}

.proposal-center { border-color: #414650; }

.section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.section-heading h2 {
  margin: 4px 0 0;
  color: #ffffff;
  font-size: 17px;
  line-height: 1.35;
}

.section-count {
  min-width: 24px;
  padding: 2px 7px;
  color: var(--text-soft);
  background: #24272c;
  border: 1px solid #363b43;
  border-radius: var(--radius-pill);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.proposal-note {
  margin: 12px 0 0;
  color: var(--text-faint);
  font-size: 12px;
  line-height: 1.65;
}

.canon-entry-list,
.proposal-list { display: grid; gap: 10px; margin-top: 14px; }

.canon-entry,
.proposal-card {
  padding: 14px 15px;
  background: #1a1c20;
  border: 1px solid #353941;
  border-radius: 10px;
}

.proposal-card { border-color: #4a505a; }

.canon-entry-meta,
.proposal-card-meta {
  margin-bottom: 6px;
  color: var(--text-faint);
  font-size: 11px;
}

.canon-entry h3,
.proposal-card h3 { margin: 0 0 7px; color: #ffffff; font-size: 14px; }
.canon-entry p,
.proposal-card p { margin: 5px 0 0; color: var(--text-soft); line-height: 1.65; }
.proposal-card .tradeoff { color: #c6cbd3; }

.candidate-proposal-button,
.adopt-proposal-button {
  min-height: 32px;
  margin-top: 12px;
  padding: 0 11px;
  color: var(--text-soft);
  background: #24272c;
  border: 1px solid #444a54;
  border-radius: 10px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 650;
}

.candidate-proposal-button:hover,
.adopt-proposal-button:hover { color: #ffffff; background: #2d3138; border-color: #656d79; }

.adopt-proposal-button { color: #101113; background: var(--accent); border-color: #f4f5f6; }
.adopt-proposal-button:hover { color: #101113; background: #ffffff; }

.turn-stream { display: grid; gap: 26px; }

.turn-entry { display: grid; gap: 9px; }

.turn-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-faint);
  font-size: 11px;
}

.turn-intent { color: var(--text-soft); }

.user-entry {
  padding: 11px 14px;
  color: #f1f2f4;
  background: var(--bg-panel);
  border-left: 2px solid #656b74;
  border-radius: 0;
  line-height: 1.7;
  white-space: pre-wrap;
}

.system-output {
  padding: 2px 0 4px 16px;
  color: var(--text-soft);
  border-left: 1px solid var(--line-strong);
  line-height: 1.75;
}

.output-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  color: var(--text-faint);
  font-size: 11px;
}

.output-label::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.authority-candidate .output-label { color: var(--candidate); }
.authority-question .output-label { color: var(--question); }
.authority-observation .output-label { color: var(--accent); }

.system-output p { margin: 0; }
.system-output ul { margin: 6px 0 0; padding-left: 18px; }

.understanding-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
.understanding-grid section { padding: 12px; background: #17191c; border: 1px solid var(--line); border-radius: 10px; }
.understanding-grid h3 { margin: 0 0 7px; color: var(--text-soft); font-size: 12px; font-weight: 700; }
.understanding-grid ul { margin: 0; }

.candidate-list { display: grid; gap: 9px; margin-top: 11px; }
.candidate-card { padding: 14px 15px; background: #17191d; border: 1px solid #363b43; border-radius: var(--radius-surface); }
.candidate-card h3 { margin: 0 0 8px; color: #f2f4f8; font-size: 14px; }
.candidate-card p { margin-top: 5px; }
.candidate-card .tradeoff { color: #bdc2ca; }

.stream-empty {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 30px 0;
  color: var(--text-faint);
  font-size: 12px;
}

.empty-line { width: 36px; height: 1px; background: var(--line-strong); }

.composer {
  position: absolute;
  z-index: 5;
  right: 18px;
  bottom: 12px;
  left: 18px;
  min-height: var(--composer-height);
  padding: 12px 14px 10px;
  background: #1b1d20;
  border: 1px solid #343840;
  border-radius: var(--radius-composer);
  box-shadow: 0 18px 36px rgba(0,0,0,.26);
}

.intent-fieldset { margin: 0; padding: 0; border: 0; }
.intent-fieldset legend { margin-bottom: 7px; color: var(--text-faint); font-size: 11px; letter-spacing: .04em; }
.intent-bar { display: flex; gap: 5px; overflow-x: auto; padding-bottom: 2px; }

.intent-button {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 0 10px;
  color: var(--text-faint);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  cursor: pointer;
  font-size: 12px;
}

.intent-button:hover { color: var(--text-soft); border-color: var(--line-strong); }
.intent-button.is-selected { color: #ffffff; background: var(--accent-soft); border-color: #666d77; }
.intent-button[data-intent="inspire"].is-selected { color: #edf2f8; background: rgba(183,195,211,.1); border-color: #5c6672; }

.composer-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  gap: 8px;
  align-items: end;
  margin-top: 8px;
}

.composer-row textarea { min-height: 48px; max-height: 130px; resize: none; }

.send-button {
  width: 36px;
  height: 36px;
  margin-bottom: 6px;
  color: #101113;
  background: var(--accent);
  border-radius: 50%;
}

.send-button:hover { background: #ffffff; }
.send-button[disabled] { background: #50545b; }

.composer-hint {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 5px;
  color: var(--text-faint);
  font-size: 11px;
}

kbd { padding: 1px 4px; color: var(--text-soft); background: var(--bg-panel); border: 1px solid var(--line-strong); border-radius: 3px; }

.context-content { min-height: 0; overflow: auto; padding: 3px 14px 24px; }

.context-pane-header { flex: 0 0 auto; }
.context-header-actions { display: flex; align-items: center; gap: 2px; }
.context-history-button:disabled { opacity: .3; cursor: default; }
.context-object-view[hidden],
#context-default-view[hidden] { display: none; }
.context-object-view { animation: context-object-enter 190ms cubic-bezier(.16, 1, .3, 1) both; }
.context-object-card { padding: 20px 0 18px; border-bottom: 1px solid var(--line); }
.context-object-kicker { color: var(--violet); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.context-object-card h2 { margin: 7px 0 10px; color: var(--text); font-size: 19px; line-height: 1.28; letter-spacing: -.02em; }
.context-object-card h2:focus { outline: none; }
.context-object-state { display: flex; flex-wrap: wrap; gap: 6px; }
.context-object-statement { margin: 16px 0; color: var(--text); font-size: 13px; line-height: 1.72; }
.context-object-metadata { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 0 0 18px; }
.context-object-metadata div { min-width: 0; }
.context-object-metadata dt { color: var(--text-soft); font-size: 10px; }
.context-object-metadata dd { overflow: hidden; margin: 4px 0 0; color: var(--text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.context-open-main { width: 100%; min-height: 38px; color: #fff; background: var(--violet); border: 1px solid var(--violet); border-radius: 8px; font-weight: 650; cursor: pointer; transition: background-color 150ms ease, border-color 150ms ease; }
.context-open-main:hover { background: #4018db; border-color: #4018db; }
.context-open-main:focus-visible { outline: 3px solid rgba(82,39,255,.25); outline-offset: 2px; }
.context-object-section { padding-block: 18px; }
.context-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.context-section-heading h3,
.context-object-view .context-note h3 { margin: 0; color: #5d5664; font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.context-section-heading > span { color: var(--text-soft); font-size: 11px; font-variant-numeric: tabular-nums; }
.context-relation-list,
.context-revision-list { display: grid; gap: 7px; }
.context-relation-list button { min-height: 44px; display: grid; gap: 3px; padding: 9px 10px; color: var(--text); text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.context-relation-list button:hover { background: var(--violet-wash); border-color: #cfc6f5; }
.context-relation-list button > span { color: var(--text-soft); font-size: 10px; }
.context-relation-list button > strong { font-size: 12px; font-weight: 600; }
.context-revision-list article { padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.context-revision-list article > div { display: flex; justify-content: space-between; gap: 10px; }
.context-revision-list strong { color: var(--text); font-size: 11px; }
.context-revision-list time { color: var(--text-soft); font-size: 10px; }
.context-revision-list p,
.context-empty-note { margin: 6px 0 0; color: var(--text-soft); font-size: 11px; line-height: 1.55; }

@keyframes context-object-enter {
  from { opacity: .72; transform: translate3d(8px, 0, 0); }
  to { opacity: 1; transform: none; }
}

.context-section { padding: 17px 0; border-bottom: 1px solid var(--line); }
.context-section h2 { margin: 0 0 10px; color: var(--text-faint); font-size: 12px; font-weight: 700; letter-spacing: .03em; }
.context-section p { margin: 0; color: var(--text-soft); font-size: 12px; line-height: 1.65; }
.context-note p { color: var(--text-faint); }

.status-list { display: grid; gap: 9px; margin: 0; }
.status-list div { display: flex; justify-content: space-between; }
.status-list dt { color: var(--text-soft); font-size: 12px; }
.status-list dd { margin: 0; color: var(--text-faint); font-variant-numeric: tabular-nums; }

.toast-region { position: fixed; z-index: 50; right: 18px; bottom: 18px; display: grid; gap: 8px; }
.toast { max-width: 340px; padding: 10px 13px; color: var(--text); background: #1c1e22; border: 1px solid var(--line-strong); border-radius: 10px; box-shadow: 0 12px 30px rgba(0,0,0,.42); font-size: 12px; }
.toast.is-error { border-color: var(--danger); color: var(--danger); }

.is-busy { cursor: progress; }
.is-busy .send-button, .is-busy .primary-button { pointer-events: none; opacity: .55; }

body.sidebar-collapsed .workspace-frame { grid-template-columns: 0 minmax(0, 1fr) var(--context-width); }
body.sidebar-collapsed .project-sidebar { overflow: hidden; border: 0; opacity: 0; pointer-events: none; }
body.context-collapsed .workspace-frame { grid-template-columns: var(--sidebar-width) minmax(0, 1fr) 0; }
body.context-collapsed .context-pane { overflow: hidden; border: 0; }
body.sidebar-collapsed.context-collapsed .workspace-frame { grid-template-columns: 0 minmax(0, 1fr) 0; }

@media (max-width: 1100px) {
  .conversation-minimap,
  .conversation-minimap-preview { display: none !important; }
}

@container main-pane (max-width: 920px) {
  .conversation-minimap,
  .conversation-minimap-preview { display: none !important; }
}

@media (max-width: 980px) {
  :root { --sidebar-width: 210px; --context-width: 250px; }
  .titlebar { grid-template-columns: var(--sidebar-width) 1fr; }
  .titlebar-status { display: none; }
  .context-pane {
    position: fixed;
    z-index: 38;
    top: var(--titlebar-height);
    right: 0;
    bottom: 0;
    width: min(360px, 100vw);
    display: flex;
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 44px rgba(49,40,61,.14);
    transform: translate3d(0, 0, 0);
    visibility: visible;
    transition: transform 190ms cubic-bezier(.16, 1, .3, 1), visibility 0s;
  }
  body.context-collapsed .context-pane {
    display: flex;
    border-left: 1px solid var(--line);
    transform: translate3d(105%, 0, 0);
    visibility: hidden;
    transition: transform 140ms ease-in, visibility 0s 140ms;
  }
  .workspace-frame,
  body.context-collapsed .workspace-frame { grid-template-columns: var(--sidebar-width) minmax(0, 1fr); }
  body.sidebar-collapsed .workspace-frame,
  body.sidebar-collapsed.context-collapsed .workspace-frame { grid-template-columns: 0 minmax(0, 1fr); }
  #toggle-context { display: inline-flex; }
}

@media (max-width: 700px) {
  :root { --titlebar-height: 40px; --composer-height: 178px; }
  .titlebar,
  body.sidebar-collapsed .titlebar { grid-template-columns: 1fr; }
  .titlebar-brand { display: none; }
  .tab-strip { padding-right: 96px; padding-left: 8px; }
  .app-tab { min-width: 0; flex: 1; }
  .project-sidebar-toggle-mobile { display: inline-flex; min-width: 34px; width: 34px; padding: 0; }
  .workspace-frame,
  body.sidebar-collapsed .workspace-frame,
  body.context-collapsed .workspace-frame,
  body.sidebar-collapsed.context-collapsed .workspace-frame { grid-template-columns: minmax(0, 1fr); }
  .project-sidebar {
    position: fixed;
    z-index: 30;
    top: var(--titlebar-height);
    bottom: 0;
    left: 0;
    width: min(280px, 100vw);
    box-shadow: 14px 0 35px rgba(0,0,0,.35);
    transform: translateX(-110%);
    opacity: 1;
    transition: transform .18s ease;
  }
  body:not(.sidebar-collapsed) .project-sidebar { transform: translateX(0); }
  .panel-resizer { display: none; }
  .welcome-view { width: min(100% - 30px, 680px); }
  .project-document { width: 100%; }
  .project-document-content { width: min(100% - 30px, 680px); }
  .detail-thread-view { width: 100%; padding-top: 18px; }
  .detail-thread-header,
  .detail-confirm-panel,
  .detail-composer { width: min(100% - 24px, 680px); }
  .detail-message-stream { padding: 18px 12px; }
  .world-document-view,
  .relationship-view { width: 100%; padding: 24px 12px 30px; }
  .relationship-map { min-height: 0; grid-template-columns: 1fr; gap: 22px; padding: 20px; }
  .relation-spokes { display: none; }
  .relation-neighbors { grid-template-columns: 1fr; }
  .document-summary-grid,
  .overview-card-grid,
  .setting-identity dl { grid-template-columns: 1fr; }
  .document-view-button { padding-inline: 8px; }
  .setting-editor-toolbar { align-items: flex-start; flex-direction: column; gap: 6px; }
  .setting-save-state { padding-left: 12px; text-align: left; }
  .setting-editor,
  .setting-relation-panel,
  .setting-history-panel,
  .setting-checkpoint-panel { padding: 17px; }
  .setting-commit-row,
  .checkpoint-form,
  .relation-proposal-form { grid-template-columns: 1fr; }
  .relation-temporal-field { grid-column: auto; }
  .setting-primary-button,
  .setting-secondary-button { width: 100%; }
  .setting-history-list article > div,
  .checkpoint-list article > div { align-items: flex-start; flex-direction: column; gap: 3px; }
  .relationship-toolbar,
  .pending-relation-list article,
  .confirmed-relation-list > article { align-items: stretch; flex-direction: column; }
  .relationship-toolbar-actions { width: 100%; justify-content: space-between; }
  .relationship-filter { justify-content: space-between; }
  .relationship-drift-field { min-height: 520px; }
  .relationship-drift-node { max-width: 152px; }
  .relationship-drift-hint { right: 12px; bottom: 10px; left: 12px; text-align: center; }
  .relationship-list-fallback article { grid-template-columns: 1fr; }
  .relationship-list-fallback article span { text-align: left; }
  .relationship-list-fallback article button:last-child { text-align: left; }
  .relationship-index-card { grid-template-columns: 1fr; gap: 7px; }
  .relationship-index-card > span { text-align: left; }
  .relationship-index-card button:last-child { text-align: left; }
  .detail-thread-header { grid-template-columns: 1fr; gap: 10px; }
  .detail-confirm-panel { align-items: stretch; flex-direction: column; }
  .detail-composer { grid-template-columns: 1fr; }
  .detail-send-button { justify-self: end; }
  .welcome-view { padding-top: 28px; }
  .welcome-copy h1 { font-size: 32px; }
  .project-document-content { padding-top: 34px; }
  .composer { right: 10px; bottom: 8px; left: 10px; padding-inline: 11px; }
  .composer-hint span:last-child { display: none; }
  .understanding-grid { grid-template-columns: 1fr; }
  .form-footer { align-items: flex-end; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .project-tree.is-entering { animation: none; }
  .tree-folder.is-entering, .tree-file.is-entering { animation: none; }
  .relationship-drift-links line.is-pulsing { animation: none; }
}

/* Staggered navigation edition ------------------------------------------------ */
:root {
  --bg-deep: #09090b;
  --bg-main: #0d0d10;
  --bg-panel: #121216;
  --bg-raised: #18181d;
  --bg-hover: #202027;
  --line: #28282f;
  --line-strong: #3a3943;
  --text: #ffffff;
  --text-soft: #e4e2e8;
  --text-faint: #9c99a5;
  --accent: #b497cf;
  --accent-strong: #5227ff;
  --accent-soft: rgba(82, 39, 255, .13);
  --titlebar-height: 52px;
  --radius-control: 5px;
  --radius-surface: 9px;
  --radius-composer: 16px;
  --motion-enter: 540ms;
  --motion-exit: 360ms;
  --motion-ease: cubic-bezier(.77, 0, .18, 1);
  --motion-spring: cubic-bezier(.22, 1, .36, 1);
  --font-ui: "Inter Variable", -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI Variable Text", "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-display: "Inter Variable", -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI Variable Display", "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}

body {
  background:
    radial-gradient(circle at 68% -20%, rgba(82, 39, 255, .08), transparent 36%),
    var(--bg-deep);
  font-size: 14.5px;
}

.titlebar {
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr) 210px;
  background: rgba(12, 12, 15, .96);
  border-bottom-color: rgba(255, 255, 255, .08);
}

.titlebar-brand {
  color: #fff;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.brand-mark {
  width: 25px;
  height: 25px;
  color: #0a0a0c;
  background: #fff;
  border: 0;
  border-radius: 50%;
  font-size: 11px;
}

.titlebar-status { padding-right: 118px; }
.connection-dot { background: var(--accent); box-shadow: 0 0 0 3px rgba(180, 151, 207, .1); }

.app-tab {
  height: 38px;
  color: #fff;
  background: #111115;
  border-color: rgba(255, 255, 255, .1);
  border-radius: 8px 8px 0 0;
}

.tab-dot { background: var(--accent-strong); }

.workspace-frame { background: transparent; }
.activity-rail { background: #0c0c0f; border-right-color: rgba(255, 255, 255, .08); }
.rail-button { border-radius: 50%; }
.rail-button:hover:not(:disabled),
.rail-button.is-active { color: #fff; background: rgba(255, 255, 255, .09); }

.project-sidebar,
.context-pane { background: rgba(18, 18, 22, .98); }

.pane-header {
  height: 48px;
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, .08);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.sidebar-section-label,
.block-label,
.eyebrow { letter-spacing: .11em; }

.main-pane {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .015), transparent 38%),
    #0d0d10;
}

.document-header { height: 48px; border-bottom-color: rgba(255, 255, 255, .08); }

.welcome-copy h1,
.project-heading h1,
.world-document-heading h1 {
  font-family: var(--font-display);
  font-weight: 680;
  letter-spacing: -.035em;
}

.new-project-form,
.source-note,
.canon-entry,
.proposal-card,
.document-section-card,
.document-entry-card {
  border-color: rgba(255, 255, 255, .11);
  box-shadow: none;
}

.primary-button,
.send-button,
.detail-send-button {
  color: #0a0a0c;
  background: #fff;
  border-color: #fff;
}

.primary-button:hover,
.detail-send-button:hover { background: #e9e7ed; }

.intent-button.is-selected,
.document-view-button.is-selected {
  color: #fff;
  background: rgba(82, 39, 255, .2);
  box-shadow: inset 0 0 0 1px rgba(180, 151, 207, .42);
}

/* The menu is the only deliberately loud moment in the workbench. */
.staggered-navigation {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
  --menu-width: clamp(400px, 39vw, 570px);
}

.staggered-backdrop {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  background: rgba(0, 0, 0, .5);
  border: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 280ms ease;
}

.staggered-prelayers,
.staggered-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--menu-width);
  height: 100%;
}

.staggered-prelayers { overflow: hidden; }

.staggered-prelayer {
  position: absolute;
  inset: 0;
  transform: translate3d(102%, 0, 0);
  will-change: transform;
}

.staggered-prelayer-soft {
  background: #b497cf;
  transition: transform var(--motion-enter) var(--motion-ease) 60ms;
}

.staggered-prelayer-violet {
  background: #5227ff;
  transition: transform var(--motion-enter) var(--motion-ease) 120ms;
}

.staggered-panel {
  overflow: auto;
  color: #09090b;
  background: #fff;
  transform: translate3d(102%, 0, 0);
  pointer-events: auto;
  visibility: hidden;
  transition:
    transform var(--motion-exit) var(--motion-ease),
    visibility 0s linear calc(var(--motion-enter) + 180ms);
  will-change: transform;
}

.staggered-panel-inner {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  padding: clamp(82px, 11vh, 132px) clamp(28px, 4vw, 58px) 34px;
}

.staggered-panel-kicker {
  margin-bottom: clamp(42px, 8vh, 86px);
  color: #5227ff;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .18em;
}

.staggered-menu-list { display: flex; flex-direction: column; }

.staggered-menu-item {
  position: relative;
  display: grid;
  grid-template-columns: 34px 1fr;
  grid-template-areas: "index label" ". note";
  align-items: baseline;
  column-gap: 10px;
  width: 100%;
  padding: 7px 0 13px;
  color: #09090b;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
  opacity: 0;
  transform: translate3d(0, 44px, 0) rotate(2deg);
  transform-origin: left bottom;
  transition:
    color 180ms ease,
    opacity 420ms var(--motion-spring),
    transform 500ms var(--motion-spring);
}

.staggered-menu-item::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 5px;
  left: 44px;
  height: 1px;
  background: #5227ff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 220ms var(--motion-spring);
}

.staggered-menu-index {
  grid-area: index;
  color: #5227ff;
  font-size: 12px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}

.staggered-menu-label {
  grid-area: label;
  font-family: var(--font-display);
  font-size: clamp(48px, 6.2vw, 82px);
  font-weight: 720;
  line-height: .92;
  letter-spacing: -.065em;
}

.staggered-menu-note {
  grid-area: note;
  max-height: 0;
  overflow: hidden;
  color: #57545f;
  font-size: 12px;
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height 180ms ease, opacity 180ms ease, transform 180ms ease;
}

.staggered-menu-item:hover,
.staggered-menu-item:focus-visible { color: #5227ff; }
.staggered-menu-item[aria-current="page"] { color: #5227ff; }
.staggered-menu-item[aria-current="page"] .staggered-menu-index::before {
  content: "•";
  margin-right: 4px;
}
.staggered-menu-item:hover::after,
.staggered-menu-item:focus-visible::after { transform: scaleX(1); }
.staggered-menu-item:hover .staggered-menu-note,
.staggered-menu-item:focus-visible .staggered-menu-note {
  max-height: 24px;
  opacity: 1;
  transform: translateY(2px);
}

.staggered-menu-item:focus-visible {
  outline: 2px solid #5227ff;
  outline-offset: 6px;
}

.staggered-panel-footer {
  margin-top: auto;
  padding-top: 42px;
  border-top: 1px solid #dad8df;
}

.staggered-panel-footer span {
  display: block;
  color: #77727e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.staggered-panel-footer strong {
  display: block;
  margin-top: 6px;
  font-size: 18px;
  letter-spacing: -.02em;
}

.staggered-panel-footer p {
  max-width: 370px;
  margin: 14px 0 0;
  color: #625e69;
  font-size: 12px;
  line-height: 1.65;
}

.staggered-toggle {
  position: absolute;
  z-index: 6;
  top: 8px;
  right: 18px;
  min-width: 84px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 0;
  color: #fff;
  background: transparent;
  border: 0;
  cursor: pointer;
  pointer-events: auto;
}

.staggered-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.staggered-toggle-text {
  width: 42px;
  height: 1em;
  overflow: hidden;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
}

.staggered-toggle-track {
  display: flex;
  flex-direction: column;
  transition: transform 420ms var(--motion-spring);
}

.staggered-toggle-track span { height: 1em; }

.staggered-toggle-icon {
  position: relative;
  width: 16px;
  height: 16px;
  transition: transform 420ms var(--motion-spring);
}

.staggered-toggle-icon span {
  position: absolute;
  top: 7px;
  left: 0;
  width: 16px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
}

.staggered-toggle-icon span:last-child { transform: rotate(90deg); }

.staggered-navigation[data-open="true"] { pointer-events: auto; }
.staggered-navigation[data-open="true"] .staggered-backdrop { opacity: 1; pointer-events: auto; }
.staggered-navigation[data-open="true"] .staggered-prelayer { transform: translate3d(0, 0, 0); }
.staggered-navigation[data-open="true"] .staggered-panel {
  transform: translate3d(0, 0, 0);
  visibility: visible;
  transition:
    transform var(--motion-enter) var(--motion-ease) 180ms,
    visibility 0s;
}
.staggered-navigation[data-open="true"] .staggered-toggle { color: #09090b; }
.staggered-navigation[data-open="true"] .staggered-toggle-track { transform: translateY(-1em); }
.staggered-navigation[data-open="true"] .staggered-toggle-icon { transform: rotate(135deg); }
.staggered-navigation[data-open="true"] .staggered-menu-item { opacity: 1; transform: none; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(1) { transition-delay: 320ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(2) { transition-delay: 365ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(3) { transition-delay: 410ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(4) { transition-delay: 455ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(5) { transition-delay: 500ms; }

body.menu-open .app-shell { pointer-events: none; }

@media (max-width: 760px) {
  .staggered-navigation { --menu-width: 100vw; }
  .staggered-panel-inner { padding-right: 26px; padding-left: 26px; }
  .staggered-menu-label { font-size: clamp(46px, 15vw, 70px); }
  .titlebar-status { display: none; }
  .titlebar { grid-template-columns: var(--sidebar-width) minmax(0, 1fr); }
}

@media (max-width: 700px) {
  .titlebar { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .staggered-backdrop,
  .staggered-prelayer,
  .staggered-panel,
  .staggered-menu-item,
  .staggered-toggle-track,
  .staggered-toggle-icon,
  .staggered-menu-item::after,
  .staggered-menu-note { transition-duration: 1ms !important; transition-delay: 0ms !important; }
  .staggered-menu-item { transform: none; }
}

/* Complete staggered workbench system --------------------------------------- */
:root {
  --surface-white: #f7f7f5;
  --surface-white-strong: #ffffff;
  --ink: #09090b;
  --ink-soft: #55515d;
  --violet: #5227ff;
  --violet-soft: #b497cf;
  --violet-wash: rgba(82, 39, 255, .12);
  --editorial-line: rgba(255, 255, 255, .11);
  --editorial-line-dark: rgba(9, 9, 11, .16);
  --shadow-editorial: 0 18px 52px rgba(0, 0, 0, .22);
}

button { touch-action: manipulation; }
button:not(:disabled):active { transform: scale(.985); }

.icon-button,
.rail-button,
.intent-button,
.document-view-button,
.tree-folder,
.tree-file,
.project-item { transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, opacity 150ms ease, transform 150ms ease; }

/* Frame and navigation */
.titlebar {
  background: #09090b;
  border-bottom: 1px solid var(--editorial-line);
}

.titlebar-brand { border-right: 1px solid var(--editorial-line); }
.titlebar-status { color: #d9d6df; }
.app-tab { background: #101014; border-color: var(--editorial-line); }
.app-tab.is-active { box-shadow: inset 0 -2px 0 var(--violet); }
.tab-dot { width: 5px; height: 5px; }

.activity-rail { background: #09090b; }
.rail-button { width: 36px; height: 36px; }
.rail-button:hover:not(:disabled) { color: #fff; background: rgba(180, 151, 207, .13); }
.rail-button.is-active { color: #09090b; background: #fff; }

.project-sidebar { background: #101014; border-right-color: var(--editorial-line); }
.project-sidebar .pane-header { color: #fff; }
.project-sidebar .icon-button:hover { color: #09090b; background: #fff; }
.sidebar-section-label { color: var(--violet-soft); }

.project-item {
  min-height: 42px;
  color: #d7d3dd;
  background: transparent;
  border-color: transparent;
  border-radius: 4px;
}

.project-item:hover,
.project-item:focus-visible { color: #fff; background: rgba(255, 255, 255, .07); border-color: rgba(255, 255, 255, .1); }
.project-item.is-active { color: #09090b; background: #fff; border-color: #fff; }

.tree-folder { color: #d7d3dd; border-radius: 3px; }
.tree-folder:hover,
.tree-folder:focus-visible { color: #fff; background: rgba(180, 151, 207, .1); border-color: transparent; }
.tree-folder.depth-1.is-expanded { color: var(--violet-soft); }
.tree-folder:not(.depth-1).is-expanded { color: #fff; }
.tree-file { color: #928e99; }
.tree-file:hover,
.tree-file:focus-visible { color: #fff; }
.tree-file.is-active { color: #fff; }
.tree-active-indicator { background: var(--violet); box-shadow: 0 0 16px rgba(82, 39, 255, .45); }

.project-list-gradient-top { background: linear-gradient(#101014, transparent); }
.project-list-gradient-bottom { background: linear-gradient(transparent, #101014); }
.project-list-scrollbar-thumb { background: #45424c; }
.project-list-scrollbar:hover .project-list-scrollbar-thumb,
.project-list-scrollbar-thumb.is-dragging { background: var(--violet-soft); }
.sidebar-footer { color: #9995a1; border-top-color: var(--editorial-line); }
.sidebar-footer .status-pip { background: var(--violet); }

.panel-resizer::after { width: 2px; left: 3px; }
.panel-resizer:hover::after,
.panel-resizer:focus-visible::after,
.panel-resizer.is-dragging::after { background: var(--violet); box-shadow: 0 0 10px rgba(82, 39, 255, .55); }

/* White information drawer */
.context-pane {
  color: var(--ink);
  background: var(--surface-white);
  border-left-color: var(--editorial-line-dark);
}
.context-pane .pane-header { color: var(--ink); border-bottom-color: var(--editorial-line-dark); }
.context-pane .icon-button { color: #625e69; }
.context-pane .icon-button:hover { color: #fff; background: var(--violet); }
.context-section { border-bottom-color: var(--editorial-line-dark); }
.context-section h2 { color: var(--violet); text-transform: uppercase; letter-spacing: .11em; }
.context-section p,
.context-note p,
.status-list dt { color: #37333e; }
.status-list dd { color: var(--ink); font-size: 16px; font-weight: 720; }

/* Main reading surface */
.document-header { background: rgba(13, 13, 16, .94); backdrop-filter: blur(14px); }
.breadcrumbs { color: #aaa5b1; }
.document-view-switch { background: #08080a; border-color: rgba(255, 255, 255, .13); border-radius: 999px; }
.document-view-button { min-height: 32px; border-radius: 999px; }
.document-view-button:hover { color: #fff; }
.document-view-button.is-selected { color: #09090b; background: #fff; box-shadow: none; }

.welcome-copy .eyebrow,
.project-heading .eyebrow,
.world-document-heading .eyebrow { color: var(--violet-soft); }
.welcome-copy h1,
.project-heading h1,
.world-document-heading h1 { font-weight: 760; letter-spacing: -.055em; }
.world-document-heading { border-bottom-color: var(--editorial-line); }
.world-document-heading p { color: #cfccd5; }

.new-project-form {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 6px;
  box-shadow: var(--shadow-editorial);
}
.new-project-form label,
.new-project-form label span,
.form-footer { color: #57525e; }
.new-project-form input,
.new-project-form textarea {
  color: var(--ink);
  background: #fff;
  border-color: rgba(9, 9, 11, .18);
}
.new-project-form input::placeholder,
.new-project-form textarea::placeholder { color: #8b8790; }
.primary-button { color: #fff; background: var(--violet); border-color: var(--violet); border-radius: 4px; }
.primary-button:hover { color: #09090b; background: var(--violet-soft); border-color: var(--violet-soft); }

.source-note {
  background: transparent;
  border: 0;
  border-left: 3px solid var(--violet);
}
.source-note blockquote { color: #fff; }
.block-label { color: var(--violet-soft); }

/* Conversation */
.turn-stream { gap: 34px; }
.turn-entry { gap: 11px; }
.turn-meta { color: #8e8995; letter-spacing: .035em; }
.turn-intent { color: var(--violet-soft); }
.user-entry {
  padding: 16px 18px;
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 4px;
  box-shadow: 8px 8px 0 rgba(82, 39, 255, .18);
}
.system-output { padding-left: 19px; color: #f2f0f5; border-left: 2px solid var(--violet); }
.output-label { color: var(--violet-soft); text-transform: uppercase; letter-spacing: .08em; }
.output-label::before { width: 12px; height: 2px; border-radius: 0; }
.authority-candidate .output-label,
.authority-question .output-label,
.authority-observation .output-label { color: var(--violet-soft); }

.understanding-grid section,
.candidate-card {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 4px;
}
.understanding-grid h3,
.candidate-card h3,
.candidate-card p,
.candidate-card .tradeoff { color: var(--ink); }

.canon-ledger,
.proposal-center {
  background: transparent;
  border-color: var(--editorial-line);
  border-radius: 4px;
}
.section-heading h2 { color: #fff; }
.section-count { color: #fff; background: var(--violet); border-color: var(--violet); border-radius: 2px; }
.proposal-note { color: #aaa5b1; }
.canon-entry,
.proposal-card {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 4px;
}
.proposal-card { box-shadow: inset 4px 0 0 var(--violet); }
.canon-entry-meta,
.proposal-card-meta { color: var(--violet); text-transform: uppercase; letter-spacing: .07em; }
.canon-entry h3,
.proposal-card h3,
.canon-entry p,
.proposal-card p,
.proposal-card .tradeoff { color: var(--ink); }
.candidate-proposal-button { color: #fff; background: var(--ink); border-color: var(--ink); border-radius: 3px; }
.candidate-proposal-button:hover { color: #fff; background: var(--violet); border-color: var(--violet); }
.adopt-proposal-button { color: #fff; background: var(--violet); border-color: var(--violet); border-radius: 3px; }
.adopt-proposal-button:hover { color: #09090b; background: var(--violet-soft); border-color: var(--violet-soft); }

.conversation-minimap-tick::before { background: #57535e; }
.conversation-minimap-tick.is-active::before { background: #fff; box-shadow: 0 0 10px rgba(255,255,255,.26); }
.conversation-minimap-preview {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 4px;
  box-shadow: var(--shadow-editorial);
}
.conversation-minimap-preview strong,
.conversation-minimap-preview span { color: var(--ink); }

/* Composer as a white action sheet */
.composer,
.detail-composer {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 6px;
  box-shadow: 0 22px 58px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.06);
}
.intent-fieldset legend { color: #625d69; }
.intent-button { color: #5d5864; border-color: rgba(9,9,11,.14); }
.intent-button:hover { color: var(--ink); border-color: var(--violet); }
.intent-button.is-selected,
.intent-button[data-intent="inspire"].is-selected {
  color: #fff;
  background: var(--violet);
  border-color: var(--violet);
  box-shadow: none;
}
.composer-row textarea,
.detail-composer textarea {
  color: var(--ink);
  background: #fff;
  border-color: rgba(9,9,11,.15);
  border-radius: 3px;
}
.composer-row textarea::placeholder,
.detail-composer textarea::placeholder { color: #85818a; }
.send-button,
.detail-send-button { color: #fff; background: var(--ink); border-color: var(--ink); }
.send-button:hover,
.detail-send-button:hover { color: #fff; background: var(--violet); border-color: var(--violet); }
.composer-hint { color: #67616d; }
.composer-hint kbd { color: #fff; background: var(--ink); border-color: var(--ink); }

/* Detail threads */
.detail-thread-header { border-bottom-color: var(--editorial-line); }
.detail-back-button { color: #fff; background: transparent; border-color: rgba(255,255,255,.17); border-radius: 3px; }
.detail-back-button:hover { color: var(--ink); background: #fff; }
.detail-thread-kicker { color: var(--violet-soft); text-transform: uppercase; letter-spacing: .09em; }
.detail-thread-header h2 { font-size: 26px; font-weight: 730; letter-spacing: -.035em; }
.detail-message.role-user { color: var(--ink); background: var(--surface-white); border-radius: 4px; }
.detail-message.role-user p,
.detail-message.role-user .detail-message-role { color: var(--ink); }
.detail-message.role-assistant { border-left: 2px solid var(--violet); }
.detail-confirm-panel { color: var(--ink); background: var(--surface-white); border: 0; border-radius: 4px; }
.detail-confirm-panel strong,
.detail-confirm-panel span { color: var(--ink); }
.detail-confirm-button {
  color: #fff;
  background: var(--violet);
  border-color: var(--violet-soft);
  border-radius: 4px;
  text-shadow: none;
}
.detail-confirm-button:hover { background: #3e18dc; border-color: #fff; }

/* Documents and settings */
.document-summary-grid article,
.document-section-card,
.document-entry-card,
.document-empty,
.overview-section,
.setting-identity,
.setting-editor,
.setting-relation-panel,
.setting-history-panel,
.setting-checkpoint-panel {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-radius: 4px;
}
.document-summary-grid article:nth-child(2) { color: #fff; background: var(--violet); }
.document-summary-grid span,
.document-summary-grid strong,
.document-section-card h2,
.document-entry-card h2,
.document-section-card p,
.document-entry-card p,
.document-empty strong,
.document-empty p,
.overview-section-heading h2,
.overview-section-heading span,
.overview-section-heading > strong,
.overview-change-list strong,
.overview-change-list span,
.overview-change-list p { color: var(--ink); }
.document-entry-card.is-pending { box-shadow: inset 4px 0 0 var(--violet); }
.document-card-meta { color: #655f6c; }
.text-status { color: var(--ink); }
.text-status.is-confirmed::before { background: var(--ink); }
.text-status.is-pending::before { background: var(--violet); }
.document-entry-open:hover { background: #fff; border-color: transparent; box-shadow: 10px 10px 0 var(--violet-wash); transform: translate(-2px, -2px); }
.document-entry-open:active { background: #fff; }

.overview-setting-card {
  color: var(--ink);
  background: #fff;
  border: 1px solid rgba(9,9,11,.15);
  border-radius: 3px;
}
.overview-setting-card:hover { border-color: var(--violet); box-shadow: 6px 6px 0 var(--violet-wash); }
.overview-setting-card h3,
.overview-setting-card p { color: var(--ink); }
.setting-metadata span { color: #fff; background: var(--ink); border-radius: 2px; }
.overview-change-list article { border-top-color: rgba(9,9,11,.13); }
.overview-next-action { color: #fff; background: var(--violet); }
.overview-next-action .document-card-meta,
.overview-next-action h2,
.overview-next-action p { color: #fff; }

.setting-back-button { color: #fff; }
.setting-back-button:hover { color: var(--ink); background: #fff; }
.setting-save-state { color: #c8c3ce; }
.setting-save-state::before { background: var(--violet-soft); }
.setting-identity dt,
.setting-identity > p,
.setting-helper,
.setting-section-heading span { color: #655f6c; }
.setting-identity dd,
.setting-section-heading h2,
.setting-section-heading > strong,
.setting-history-list strong,
.checkpoint-list strong,
.setting-history-list p,
.checkpoint-list p { color: var(--ink); }
.setting-history-list > article,
.checkpoint-list > article { border-top-color: rgba(9,9,11,.13); }
.setting-history-list span,
.checkpoint-list span,
.setting-history-list time { color: #706a76; }
.setting-field,
.setting-summary-field,
.checkpoint-form label { color: #3f3a45; }
.setting-field input,
.setting-field textarea,
.setting-summary-field input,
.checkpoint-form input {
  color: var(--ink);
  background: #fff;
  border-color: rgba(9,9,11,.18);
  border-radius: 3px;
}
.setting-field input:focus-visible,
.setting-field textarea:focus-visible,
.setting-summary-field input:focus-visible,
.checkpoint-form input:focus-visible { outline-color: var(--violet); border-color: var(--violet); }
.setting-primary-button { color: #fff; background: var(--violet); border-color: var(--violet); border-radius: 3px; }
.setting-primary-button:hover { color: var(--ink); background: var(--violet-soft); }
.setting-secondary-button { color: #fff; background: var(--ink); border-color: var(--ink); border-radius: 3px; }
.setting-secondary-button:hover { color: #fff; background: var(--violet); border-color: var(--violet); }
.relation-proposal-form label > span { color: #655f6c; }
.relation-proposal-form select,
.relation-proposal-form input,
.relationship-filter select { color: var(--ink); background: #fff; border-color: rgba(9,9,11,.2); border-radius: 3px; }
.pending-relation-list article,
.confirmed-relation-list > article { color: var(--ink); background: #fff; border-color: rgba(9,9,11,.14); border-radius: 3px; }
.pending-relation-list strong,
.confirmed-relation-list strong { color: var(--ink); }
.relation-confirm-button,
.relation-open-graph { color: #fff; background: var(--ink); border-color: var(--ink); border-radius: 3px; }
.relation-confirm-button:hover,
.relation-open-graph:hover { color: #fff; background: var(--violet); border-color: var(--violet); }

/* Relationship graph as a white editorial map */
.relationship-toolbar { padding: 10px 0; }
.relationship-legend { color: #bbb6c2; }
.relationship-legend span::before { background: var(--violet-soft); }
.relationship-filter { color: #bbb6c2; }
#relationship-reset-layout { color: #fff; background: transparent; border-color: rgba(255,255,255,.2); border-radius: 3px; }
#relationship-reset-layout:hover { color: var(--ink); background: #fff; border-color: #fff; }
.relationship-drift-field {
  background:
    linear-gradient(rgba(9,9,11,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(9,9,11,.045) 1px, transparent 1px),
    var(--surface-white);
  background-size: 32px 32px, 32px 32px, auto;
  border: 0;
  border-radius: 5px;
  box-shadow: var(--shadow-editorial);
}
.relationship-drift-field::before { background: radial-gradient(circle 96px at var(--graph-pointer-x) var(--graph-pointer-y), rgba(82,39,255,.085), transparent 74%); }
.relationship-drift-field:focus-visible { box-shadow: var(--shadow-editorial), 0 0 0 3px var(--violet); }
.relationship-drift-links line { stroke: #6f6878; opacity: .5; }
.relationship-drift-links marker path { fill: var(--violet); }
.relationship-drift-links line.is-active { stroke: var(--violet); stroke-width: 2; opacity: 1; }
.relationship-drift-labels span { color: #fff; background: var(--ink); border: 0; border-radius: 2px; }
.relationship-drift-labels span.is-active { color: #fff; background: var(--violet); }
.relationship-drift-node {
  color: var(--ink);
  background: #fff;
  border: 1px solid rgba(9,9,11,.22);
  border-radius: 4px;
  box-shadow: 6px 6px 0 rgba(9,9,11,.08);
}
.relationship-drift-node:hover,
.relationship-drift-node.is-hovered,
.relationship-drift-node:focus-visible { color: #fff; background: var(--ink); border-color: var(--ink); box-shadow: 8px 8px 0 var(--violet-wash); }
.relationship-drift-node.is-center { color: #fff; background: var(--violet); border-color: var(--violet); }
.relationship-drift-node.is-related { color: #fff; background: var(--ink); border-color: var(--violet); }
.relationship-drift-node.is-dragging { color: #fff; background: var(--violet); border-color: var(--violet); box-shadow: 12px 12px 0 rgba(82,39,255,.2); }
.relationship-drift-preview { color: #fff; background: var(--ink); border: 0; border-radius: 4px; box-shadow: 10px 10px 0 var(--violet-wash); }
.relationship-drift-preview > span { color: var(--violet-soft); }
.relationship-drift-preview strong,
.relationship-drift-preview p { color: #fff; }
.relationship-drift-hint { color: #59535f; }
.relationship-list-fallback,
.relationship-index-card { color: var(--ink); background: var(--surface-white); border: 0; border-radius: 4px; }
.relationship-list-fallback summary,
.relationship-index-card > span { color: var(--ink); }
.relationship-list-fallback article button,
.relationship-index-card button { color: #fff; background: var(--ink); border-color: var(--ink); border-radius: 3px; }
.relationship-list-fallback article button:hover,
.relationship-index-card button:hover { color: #fff; background: var(--violet); border-color: var(--violet); }

/* Scroll, empty, feedback and loading */
.project-document::-webkit-scrollbar-thumb,
.detail-message-stream::-webkit-scrollbar-thumb,
.world-document-view::-webkit-scrollbar-thumb,
.relationship-view::-webkit-scrollbar-thumb { background-color: #45414b; }
.context-content::-webkit-scrollbar-thumb { background-color: #b8b3bd; }
.project-document::-webkit-scrollbar-thumb:hover,
.detail-message-stream::-webkit-scrollbar-thumb:hover,
.world-document-view::-webkit-scrollbar-thumb:hover,
.relationship-view::-webkit-scrollbar-thumb:hover,
.context-content::-webkit-scrollbar-thumb:hover { background-color: var(--violet); }
.stream-empty { color: #9994a1; }
.empty-line { width: 52px; background: var(--violet); }
.toast {
  color: var(--ink);
  background: var(--surface-white);
  border: 0;
  border-left: 5px solid var(--violet);
  border-radius: 3px;
  box-shadow: var(--shadow-editorial);
  animation: toast-editorial-in 220ms var(--motion-spring) both;
}
.toast.is-error { color: var(--danger-on); background: var(--danger); border-left-color: var(--danger-on); }
@keyframes toast-editorial-in { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }

.is-busy .send-button,
.is-busy .primary-button,
.is-busy .setting-primary-button { position: relative; overflow: hidden; opacity: .72; }
.is-busy .send-button::after,
.is-busy .primary-button::after,
.is-busy .setting-primary-button::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.5) 50%, transparent 80%);
  transform: translateX(-120%);
  animation: action-loading-sweep 900ms ease-in-out infinite;
}
@keyframes action-loading-sweep { to { transform: translateX(120%); } }

.view-entering { animation: editorial-view-in 360ms var(--motion-spring) both; }
@keyframes editorial-view-in {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: none; }
}

/* Closing the menu must clear the canvas quickly. */
.staggered-navigation[data-open="false"] .staggered-panel { transition-duration: 280ms; transition-delay: 0ms; }
.staggered-navigation[data-open="false"] .staggered-prelayer-soft { transition-duration: 320ms; transition-delay: 80ms; }
.staggered-navigation[data-open="false"] .staggered-prelayer-violet { transition-duration: 300ms; transition-delay: 35ms; }

@media (max-width: 700px) {
  body { font-size: 16px; }
  .composer { border-radius: 5px; }
  .intent-button { min-height: 38px; }
  .document-summary-grid,
  .overview-card-grid,
  .understanding-grid { grid-template-columns: 1fr; }
  .context-pane { background: var(--surface-white); }
}

@media (prefers-reduced-motion: reduce) {
  .view-entering,
  .toast,
  .is-busy .send-button::after,
  .is-busy .primary-button::after,
  .is-busy .setting-primary-button::after { animation: none !important; }
  button:not(:disabled):active { transform: none; }
}

/* Daylight mode -------------------------------------------------------------- */
:root {
  color-scheme: light;
  --bg-deep: #ecebef;
  --bg-main: #f4f3f6;
  --bg-panel: #ffffff;
  --bg-raised: #f8f7f9;
  --bg-hover: #ebe9ef;
  --line: #dedbe3;
  --line-strong: #c8c4ce;
  --text: #17141c;
  --text-soft: #3e3945;
  --text-faint: #716a78;
  --accent: #5227ff;
  --accent-strong: #5227ff;
  --accent-soft: rgba(82, 39, 255, .1);
  --candidate: #5f42d6;
  --question: #645c70;
  --danger: #ff0055;
  --danger-on: #09090b;
  --danger-text: #302a36;
  --danger-soft: rgba(255, 0, 85, .06);
  --danger-soft-strong: rgba(255, 0, 85, .1);
  --danger-border: rgba(255, 0, 85, .3);
  --danger-ring: rgba(255, 0, 85, .22);
  --scrollbar-thumb: #bbb6c1;
  --scrollbar-thumb-hover: #80788a;
  --surface-white: #ffffff;
  --surface-white-strong: #ffffff;
  --ink: #17141c;
  --ink-soft: #5d5664;
  --editorial-line: rgba(23, 20, 28, .12);
  --shadow-editorial: 0 16px 42px rgba(44, 36, 56, .09);
  color: var(--text);
  background: var(--bg-deep);
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 72% -18%, rgba(82,39,255,.055), transparent 34%),
    var(--bg-deep);
}

button { color: var(--text); }
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible { outline-color: var(--violet); }

.titlebar {
  color: var(--text);
  background: rgba(255,255,255,.96);
  border-bottom-color: var(--line);
}
.titlebar-brand { color: var(--text); border-right-color: var(--line); }
.brand-mark { color: #fff; background: var(--violet); }
.titlebar-status { color: #5e5765; }
.app-tab { color: var(--text); background: #f7f6f8; border-color: var(--line); }
.app-tab.is-active { background: #fff; }
.icon-button { color: #706978; }
.icon-button:hover:not(:disabled) { color: var(--violet); background: var(--violet-wash); }

.workspace-frame { background: var(--bg-main); }
.activity-rail { background: #f7f6f8; border-right-color: var(--line); }
.rail-button { color: #77717d; }
.rail-button:hover:not(:disabled) { color: var(--violet); background: var(--violet-wash); }
.rail-button.is-active { color: #fff; background: var(--violet); }

.project-sidebar {
  color: var(--text);
  background: #fbfafc;
  border-right-color: var(--line);
}
.project-sidebar .pane-header { color: var(--text); border-bottom-color: var(--line); }
.project-sidebar .icon-button:hover { color: #fff; background: var(--violet); }
.sidebar-section-label { color: #625b69; }
.project-item { color: #352f3c; }
.project-item:hover,
.project-item:focus-visible { color: var(--violet); background: #f0edf9; border-color: #ddd7ee; }
.project-item.is-active { color: var(--violet); background: #eeeafd; border-color: #d7cff8; box-shadow: inset 3px 0 0 var(--violet); }
.tree-folder { color: #494250; }
.tree-folder.depth-2 { color: #56505d; }
.tree-folder.depth-3,
.tree-folder.depth-4 { color: #625b69; }
.tree-folder:hover,
.tree-folder:focus-visible { color: var(--violet); background: #f1eef8; }
.tree-folder.depth-1.is-expanded { color: var(--violet); }
.tree-folder:not(.depth-1).is-expanded { color: #332d3a; }
.tree-file,
.tree-file.depth-2 { color: #5f5866; }
.tree-file.depth-3,
.tree-file.depth-4 { color: #6b6471; }
.tree-file:hover,
.tree-file:focus-visible { color: var(--violet); }
.tree-file.is-active { color: var(--violet); font-weight: 650; }
.tree-active-indicator { background: var(--violet); box-shadow: none; }
.project-list-gradient-top { background: linear-gradient(#fbfafc, transparent); }
.project-list-gradient-bottom { background: linear-gradient(transparent, #fbfafc); }
.project-list-scrollbar-thumb { background: #c4bec9; }
.project-list-scrollbar:hover .project-list-scrollbar-thumb,
.project-list-scrollbar-thumb.is-dragging { background: var(--violet); }
.sidebar-footer { color: #746d7a; border-top-color: var(--line); }

.context-pane { background: #f8f7f9; border-left-color: var(--line); }
.context-pane .pane-header { border-bottom-color: var(--line); }
.context-section { border-bottom-color: var(--line); }
.context-section h2 { color: var(--violet); }
.context-section p,
.context-note p,
.status-list dt { color: #494350; }

.main-pane {
  color: var(--text);
  background:
    linear-gradient(135deg, rgba(82,39,255,.018), transparent 38%),
    var(--bg-main);
}
.document-header { background: rgba(255,255,255,.88); border-bottom-color: var(--line); }
.breadcrumbs { color: #746d7a; }
.document-view-switch { background: #f0eef3; border-color: #d8d4dd; }
.document-view-button { color: #6c6572; }
.document-view-button:hover { color: var(--violet); }
.document-view-button.is-selected { color: #fff; background: var(--violet); }

.welcome-copy h1,
.project-heading h1,
.world-document-heading h1,
.section-heading h2,
.detail-thread-header h2 { color: var(--text); }
.welcome-copy p,
.project-subtitle,
.world-document-heading p,
.detail-thread-header p { color: var(--text-soft); }
.welcome-copy .eyebrow,
.project-heading .eyebrow,
.world-document-heading .eyebrow,
.block-label { color: var(--violet); }
.world-document-heading { border-bottom-color: var(--line); }

.source-note { background: rgba(255,255,255,.62); border-left-color: var(--violet); }
.source-note blockquote { color: var(--text); }

.turn-meta { color: #776f7d; }
.turn-intent { color: var(--violet); }
.user-entry {
  color: var(--text);
  background: #ffffff;
  border: 1px solid #ddd9e2;
  box-shadow: 6px 6px 0 rgba(82,39,255,.07);
}
.system-output { color: #302a37; border-left-color: var(--violet); }
.output-label,
.authority-candidate .output-label,
.authority-question .output-label,
.authority-observation .output-label { color: var(--violet); }
.understanding-grid section,
.candidate-card { color: var(--text); background: #fff; border: 1px solid #ddd9e2; }
.understanding-grid h3,
.candidate-card h3,
.candidate-card p,
.candidate-card .tradeoff { color: var(--text); }

.canon-ledger,
.proposal-center { background: rgba(255,255,255,.5); border-color: #d9d5de; }
.section-count { color: #fff; background: var(--violet); border-color: var(--violet); }
.proposal-note { color: #67606d; }
.canon-entry,
.proposal-card { color: var(--text); background: #fff; border: 1px solid #ded9e3; }
.proposal-card { box-shadow: inset 4px 0 0 var(--violet); }
.canon-entry h3,
.proposal-card h3,
.canon-entry p,
.proposal-card p,
.proposal-card .tradeoff { color: var(--text); }
.candidate-proposal-button { color: var(--violet); background: #f0ecff; border-color: #d7cff9; }
.candidate-proposal-button:hover { color: #fff; background: var(--violet); border-color: var(--violet); }

.conversation-minimap-tick::before { background: #a49eaa; }
.conversation-minimap-tick.is-active::before { background: var(--violet); box-shadow: 0 0 0 3px rgba(82,39,255,.1); }
.conversation-minimap-preview { color: var(--text); background: #fff; border: 1px solid #ded9e3; }
.conversation-minimap-preview strong,
.conversation-minimap-preview span { color: var(--text); }

.composer,
.detail-composer {
  color: var(--text);
  background: #fff;
  border: 1px solid #d8d4dd;
  box-shadow: 0 18px 46px rgba(49,40,61,.12);
}
.intent-fieldset legend,
.composer-hint { color: #6e6774; }
.intent-button { color: #625b68; border-color: #d9d5de; }
.intent-button:hover { color: var(--violet); border-color: var(--violet); }
.intent-button.is-selected,
.intent-button[data-intent="inspire"].is-selected { color: #fff; background: var(--violet); border-color: var(--violet); }
.composer-row textarea,
.detail-composer textarea { color: var(--text); background: #faf9fb; border-color: #d9d5de; }
.send-button,
.detail-send-button { color: #fff; background: var(--violet); border-color: var(--violet); }
.send-button:hover,
.detail-send-button:hover { color: #fff; background: #4018db; }
.composer-hint kbd { color: #4a4350; background: #f0eef3; border-color: #d4cfd9; }

.detail-thread-header { border-bottom-color: var(--line); }
.detail-back-button { color: #5e5765; background: #fff; border-color: #d8d4dd; }
.detail-back-button:hover { color: #fff; background: var(--violet); }
.detail-message-role { color: #756e7b; }
.detail-message p { color: #37313e; }
.detail-message.role-user { color: var(--text); background: #eeeafd; border: 1px solid #d8d0f7; }
.detail-message.role-assistant { border-left-color: var(--violet); }
.detail-confirm-panel { color: var(--text); background: #fff; border: 1px solid #ddd9e2; }
.detail-confirm-button { color: #fff; background: var(--violet); border-color: var(--violet); }

.document-summary-grid article,
.document-section-card,
.document-entry-card,
.document-empty,
.overview-section,
.setting-identity,
.setting-editor,
.setting-relation-panel,
.setting-history-panel,
.setting-checkpoint-panel {
  color: var(--text);
  background: #fff;
  border: 1px solid #ded9e3;
  box-shadow: 0 8px 24px rgba(49,40,61,.045);
}
.document-summary-grid article:nth-child(2) { color: #fff; background: var(--violet); border-color: var(--violet); }
.document-section-card h2,
.document-entry-card h2,
.document-section-card p,
.document-entry-card p,
.document-empty strong,
.document-empty p,
.overview-section-heading h2,
.overview-section-heading span,
.overview-section-heading > strong,
.overview-change-list strong,
.overview-change-list span,
.overview-change-list p { color: var(--text); }
.document-card-meta { color: #706976; }
.document-entry-open:hover { background: #fff; border-color: #cfc7da; box-shadow: 8px 8px 0 rgba(82,39,255,.07); }
.overview-setting-card { color: var(--text); background: #fbfafc; border-color: #d8d4dd; }
.overview-setting-card h3,
.overview-setting-card p { color: var(--text); }
.setting-metadata span { color: var(--violet); background: #eeeafd; border: 1px solid #dad2fa; }
.overview-change-list article { border-top-color: #e1dde5; }
.overview-next-action { color: #fff; background: #6a46ef; border-color: #6a46ef; }
.overview-next-action .document-card-meta,
.overview-next-action h2,
.overview-next-action p { color: #fff; }

.setting-back-button { color: #615a67; }
.setting-back-button:hover { color: var(--violet); background: #eeeafd; }
.setting-save-state { color: #6d6673; }
.setting-identity dt,
.setting-identity > p,
.setting-helper,
.setting-section-heading span { color: #6c6572; }
.setting-identity dd,
.setting-section-heading h2,
.setting-section-heading > strong,
.setting-history-list strong,
.checkpoint-list strong,
.setting-history-list p,
.checkpoint-list p { color: var(--text); }
.setting-history-list > article,
.checkpoint-list > article { border-top-color: #e1dde5; }
.setting-field,
.setting-summary-field,
.checkpoint-form label { color: #4b4551; }
.setting-field input,
.setting-field textarea,
.setting-summary-field input,
.checkpoint-form input,
.relation-proposal-form select,
.relation-proposal-form input,
.relationship-filter select { color: var(--text); background: #fbfafc; border-color: #d8d4dd; }
.setting-secondary-button,
.relation-confirm-button,
.relation-open-graph { color: var(--violet); background: #eeeafd; border-color: #d8d0f7; }
.setting-secondary-button:hover,
.relation-confirm-button:hover,
.relation-open-graph:hover { color: #fff; background: var(--violet); border-color: var(--violet); }
.pending-relation-list article,
.confirmed-relation-list > article { color: var(--text); background: #fbfafc; border-color: #ded9e3; }

.relationship-legend,
.relationship-filter { color: #665f6c; }
#relationship-reset-layout { color: #5f5866; background: #fff; border-color: #d8d4dd; }
#relationship-reset-layout:hover { color: #fff; background: var(--violet); border-color: var(--violet); }
.relationship-drift-field { border: 1px solid #d9d5de; box-shadow: 0 14px 38px rgba(49,40,61,.08); }
.relationship-drift-node { color: var(--text); background: #fff; border-color: #cfcad4; box-shadow: 5px 5px 0 rgba(70,59,82,.08); }
.relationship-drift-node:hover,
.relationship-drift-node.is-hovered,
.relationship-drift-node:focus-visible { color: #fff; background: var(--violet); border-color: var(--violet); }
.relationship-drift-node.is-related { color: #fff; background: #6a46ef; border-color: #6a46ef; }
.relationship-drift-preview { color: var(--text); background: #fff; border: 1px solid #d8d4dd; box-shadow: 8px 8px 0 rgba(82,39,255,.08); }
.relationship-drift-preview > span { color: var(--violet); }
.relationship-drift-preview strong,
.relationship-drift-preview p { color: var(--text); }
.relationship-list-fallback,
.relationship-index-card { color: var(--text); background: #fff; border: 1px solid #ded9e3; }
.relationship-list-fallback article button,
.relationship-index-card button { color: var(--violet); background: #eeeafd; border-color: #d8d0f7; }

.toast { color: var(--text); background: #fff; border: 1px solid #ded9e3; border-left: 5px solid var(--violet); }
.toast.is-error { color: var(--danger-on); background: var(--danger); }
.stream-empty { color: #716a78; }

.staggered-toggle { color: var(--text); }
.staggered-backdrop { background: rgba(70,63,78,.28); }
.staggered-panel { background: #fff; }
.staggered-navigation[data-open="true"] .staggered-toggle { color: var(--text); }

@media (max-width: 700px) {
  .titlebar { background: #fff; }
  .main-pane { background: var(--bg-main); }
}

/* Staggered project and page transitions ------------------------------------- */
:root {
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-scene: 420ms;
  --motion-exit: 270ms;
  --motion-enter: 420ms;
  --motion-standard: cubic-bezier(.2, .7, .2, 1);
  --motion-in: cubic-bezier(.16, 1, .3, 1);
  --motion-out: cubic-bezier(.4, 0, 1, 1);
  --motion-ease: cubic-bezier(.77, 0, .18, 1);
  --motion-spring: cubic-bezier(.2, .7, .2, 1);
}

.view-entering { animation: none; }

.is-content-transitioning[data-motion-direction="forward"] {
  animation: content-enter-forward var(--motion-base) var(--motion-in) both;
}

.is-content-transitioning[data-motion-direction="back"] {
  animation: content-enter-back var(--motion-base) var(--motion-in) both;
}

.is-content-transitioning[data-motion-direction="neutral"] {
  animation: content-enter-neutral var(--motion-base) var(--motion-in) both;
}

.is-content-transitioning[data-motion-direction="refresh"] {
  animation: content-refresh var(--motion-fast) var(--motion-standard) both;
}

@keyframes content-enter-forward {
  from { opacity: .82; transform: translate3d(6px, 0, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes content-enter-back {
  from { opacity: .82; transform: translate3d(-6px, 0, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes content-enter-neutral {
  from { opacity: .84; transform: translate3d(0, 4px, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes content-refresh {
  from { opacity: .78; }
  to { opacity: 1; }
}

.workspace-transition {
  position: absolute;
  z-index: 24;
  top: 48px;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
}

.workspace-transition-layer {
  position: absolute;
  inset: 0;
  transform: translate3d(-105%, 0, 0);
  will-change: transform;
}

.workspace-transition-soft { z-index: 1; background: #b497cf; }
.workspace-transition-violet { z-index: 2; background: #5227ff; }
.workspace-transition-paper { z-index: 3; background: #f4f3f6; }

.workspace-transition.is-running { visibility: visible; }
.workspace-transition.is-running .workspace-transition-soft {
  animation: workspace-layer-sweep 420ms var(--motion-ease) both;
}
.workspace-transition.is-running .workspace-transition-violet {
  animation: workspace-layer-sweep 400ms var(--motion-ease) 28ms both;
}
.workspace-transition.is-running .workspace-transition-paper {
  animation: workspace-layer-sweep 380ms var(--motion-ease) 56ms both;
}

@keyframes workspace-layer-sweep {
  0% { transform: translate3d(-105%, 0, 0); }
  42%, 58% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(105%, 0, 0); }
}

.project-tree-shell,
.tree-children-shell { position: relative; }

.project-tree-shell,
.tree-children-shell {
  transition:
    grid-template-rows var(--motion-base) var(--motion-in),
    opacity var(--motion-fast) var(--motion-standard),
    transform var(--motion-base) var(--motion-in);
}

.tree-active-indicator {
  transition: transform var(--motion-base) var(--motion-in), opacity var(--motion-fast) ease;
}

.icon-button,
.rail-button,
.intent-button,
.document-view-button,
.tree-folder,
.tree-file,
.project-item {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-standard);
}

.staggered-toggle-track,
.staggered-toggle-icon { transition-duration: var(--motion-base); }

.staggered-menu-item {
  transition:
    color var(--motion-fast) var(--motion-standard),
    opacity var(--motion-scene) var(--motion-in),
    transform var(--motion-scene) var(--motion-in);
}

.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(1) { transition-delay: 230ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(2) { transition-delay: 265ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(3) { transition-delay: 300ms; }
.staggered-navigation[data-open="true"] .staggered-menu-item:nth-child(4) { transition-delay: 335ms; }

@media (prefers-reduced-motion: reduce) {
  .context-object-view { animation: none; }
  .context-pane { transition-duration: 1ms !important; transition-delay: 0ms !important; }
  .workspace-transition { display: none; }
  .is-content-transitioning { animation: none !important; }
}

/* P0 information hierarchy and state clarity -------------------------------- */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --surface-workspace: #f3f2f5;
  --surface-panel: #ffffff;
  --surface-subtle: #f8f7f9;
  --border-subtle: #e1dee5;
  --border-strong: #cbc6d1;
  --state-confirmed: #4f2fc4;
  --state-pending: #81551b;
  --state-draft: #4e5966;
  --state-unknown: #68616f;
  --shadow-floating: 0 14px 34px rgba(55, 45, 67, .1);
}

body { background: var(--surface-workspace); }
.workspace-frame,
.main-pane { background: var(--surface-workspace); }
.main-pane::before { content: none; }

button:disabled {
  opacity: .46;
  cursor: not-allowed;
}

.rail-button[hidden] { display: none !important; }

.icon-button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.project-document-content,
.world-document-content {
  width: min(100%, 860px);
  margin-inline: auto;
}

.welcome-view {
  align-content: start;
  gap: var(--space-5);
  padding-top: clamp(52px, 9vh, 104px);
}

.welcome-copy,
.new-project-form { width: min(100%, 720px); }
.welcome-copy h1 { max-width: 12em; letter-spacing: -.045em; }
.welcome-copy p { max-width: 43em; font-size: 15px; line-height: 1.75; }

.new-project-form {
  padding: var(--space-5);
  border: 1px solid var(--border-subtle);
  border-radius: 9px;
  box-shadow: 0 12px 30px rgba(55, 45, 67, .075);
}

.new-project-form label { color: #3c3543; font-size: 13px; font-weight: 620; }
.new-project-form label span { font-weight: 450; }
.new-project-form input,
.new-project-form textarea {
  border-color: var(--border-strong);
  border-radius: 6px;
  background: #fff;
  font-size: 15px;
  line-height: 1.65;
}
.new-project-form textarea { min-height: 150px; }
.new-project-form textarea.is-compact { min-height: 64px; }
.welcome-secondary-actions {
  width: min(100%, 720px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.welcome-secondary-actions button {
  min-height: 44px;
  padding: 10px 14px;
  color: #4f4656;
  background: rgba(255, 255, 255, .72);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  cursor: pointer;
}
.welcome-secondary-actions button:disabled { opacity: .62; cursor: not-allowed; }

.primary-button,
.setting-primary-button,
.adopt-proposal-button,
.detail-confirm-button,
.send-button,
.detail-send-button {
  box-shadow: none;
}

.project-heading { margin-bottom: var(--space-6); }
.project-heading h1,
.world-document-heading h1 { letter-spacing: -.035em; }
.project-subtitle,
.world-document-heading p { max-width: 62ch; font-size: 14px; line-height: 1.7; }

.source-note {
  padding: var(--space-4) var(--space-5);
  background: rgba(255,255,255,.7);
  border: 0;
  border-left: 3px solid var(--violet);
  border-radius: 0 6px 6px 0;
  box-shadow: none;
}
.source-note blockquote { font-size: 15px; line-height: 1.85; }

.canon-ledger,
.proposal-center {
  padding: var(--space-5) 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--border-subtle);
  border-radius: 0;
}

.section-heading { align-items: end; }
.section-heading h2 { font-size: 18px; letter-spacing: -.02em; }
.section-count {
  color: #5c5563;
  background: transparent;
  border: 0;
  font-size: 13px;
}

.canon-entry,
.proposal-card,
.candidate-card,
.document-section-card,
.document-entry-card,
.overview-section,
.setting-identity,
.setting-editor,
.setting-relation-panel,
.setting-history-panel,
.setting-checkpoint-panel {
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  box-shadow: none;
}

.proposal-card,
.document-entry-card.is-pending { box-shadow: inset 3px 0 0 var(--state-pending); }
.canon-entry h3,
.proposal-card h3,
.candidate-card h3,
.document-entry-card h2 { letter-spacing: -.012em; }
.canon-entry p,
.proposal-card p,
.candidate-card p,
.document-entry-card p,
.document-section-card p { font-size: 14px; line-height: 1.72; }

.canon-entry-meta,
.proposal-card-meta,
.candidate-state {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px 10px;
  margin-bottom: var(--space-3);
  color: #6b6471;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
}

.text-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  color: var(--state-unknown);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: .01em;
}

.text-status::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border: 1.5px solid currentColor;
  background: transparent;
  border-radius: 50%;
}

.text-status.is-confirmed { color: var(--state-confirmed); }
.text-status.is-confirmed::before { background: currentColor; border-radius: 2px; }
.text-status.is-pending { color: var(--state-pending); }
.text-status.is-pending::before { border-radius: 1px; transform: rotate(45deg); }
.text-status.is-draft { color: var(--state-draft); }
.text-status.is-draft::before { border-radius: 1px; border-style: dashed; }
.text-status.is-unknown { color: var(--state-unknown); }

.turn-entry { gap: var(--space-3); }
.turn-meta { color: #6d6673; font-size: 11px; }
.turn-intent { color: #4d4654; font-weight: 650; }
.user-entry {
  border-color: var(--border-subtle);
  border-radius: 7px;
  box-shadow: none;
  font-size: 15px;
  line-height: 1.72;
}
.system-output {
  padding-left: var(--space-4);
  border-left-width: 2px;
  font-size: 14px;
  line-height: 1.75;
}
.system-output .output-label { margin-bottom: var(--space-2); }

.composer,
.detail-composer {
  border-color: var(--border-strong);
  border-radius: 12px;
  box-shadow: var(--shadow-floating);
}

.intent-fieldset legend { color: #514a58; font-size: 12px; font-weight: 650; }
.intent-bar {
  gap: 6px;
  scrollbar-width: none;
}
.intent-bar::-webkit-scrollbar { display: none; }
.mobile-intent-picker { position: relative; display: none; }
.intent-button {
  min-height: 44px;
  display: grid;
  align-content: center;
  gap: 1px;
  padding: 6px 10px;
  color: #514a58;
  background: #fff;
  border-color: var(--border-subtle);
  border-radius: 7px;
  text-align: left;
}
.intent-button span { font-size: 12px; font-weight: 620; line-height: 1.35; }
.intent-button small { color: #77707e; font-size: 10px; font-weight: 450; line-height: 1.25; }
.intent-button.is-selected,
.intent-button[data-intent="inspire"].is-selected {
  color: #fff;
  background: var(--violet);
  border-color: var(--violet);
}
.intent-button.is-selected small { color: rgba(255,255,255,.82); }
.composer-hint { color: #635c69; line-height: 1.55; }

.document-summary-grid article { box-shadow: none; }
.document-summary-grid article:nth-child(2) {
  color: var(--text);
  background: #fff;
  border-color: var(--border-subtle);
}
.document-summary-grid article:nth-child(2) span,
.document-summary-grid article:nth-child(2) strong { color: inherit; }
.overview-next-action {
  color: var(--text);
  background: #f1edff;
  border-color: #d9d0ff;
}
.overview-next-action .document-card-meta,
.overview-next-action h2,
.overview-next-action p { color: var(--text); }

.setting-metadata { gap: 6px; }
.setting-metadata span {
  color: #5d5664;
  background: var(--surface-subtle);
  border-color: var(--border-subtle);
  border-radius: 5px;
}
.setting-helper { max-width: 70ch; }
.setting-save-state[data-state="saving"],
.setting-save-state[data-state="pending"] { color: var(--state-draft); }
.setting-save-state[data-state="error"] { color: var(--danger-text); text-decoration: underline 2px var(--danger); text-underline-offset: 3px; }

.relationship-drift-field {
  border-color: var(--border-subtle);
  box-shadow: none;
  background: #faf9fb;
}
.relationship-drift-node {
  border-color: #cfcad4;
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(55,45,67,.07);
}
.relationship-drift-links line { stroke: #aaa4b0; }
.relationship-drift-labels span {
  max-width: 160px;
  padding: 5px 9px;
  color: #433b49;
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.3;
  background: rgba(255,255,255,.96);
  border-color: #c9c2d0;
  box-shadow: 0 2px 8px rgba(55,45,67,.1);
  opacity: .96;
}
.relationship-drift-labels span.is-active {
  color: #fff;
  background: var(--violet);
  border-color: var(--violet);
}

.skip-link {
  padding: 10px 14px;
  color: #fff;
  background: var(--violet);
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(68,39,146,.22);
  font-size: 13px;
  font-weight: 720;
  text-decoration: none;
}
.skip-link:focus-visible { outline: 3px solid rgba(117,89,201,.34); outline-offset: 3px; }
.main-pane:focus { outline: none; }
.main-pane:focus-visible { box-shadow: inset 0 0 0 3px rgba(117,89,201,.24); }

.context-pane { background: #faf9fb; }
.context-content { padding-inline: var(--space-4); }
.context-section { padding: var(--space-4) 0; }
.context-section h2 {
  margin-bottom: var(--space-2);
  color: #5d5664;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: none;
}
.context-section p { color: #3f3946; font-size: 12px; line-height: 1.65; }
.context-authority { margin-top: 9px; }
.status-list { gap: 10px; }
.status-list div { align-items: baseline; gap: var(--space-3); }
.status-list dt { color: #514a58; }
.status-list dd { color: #29232f; font-weight: 650; }

.toast {
  border-radius: 7px;
  box-shadow: var(--shadow-floating);
}

.is-busy .connection-dot { background: var(--violet); }
.is-busy button:not([disabled]) { cursor: progress; }

@media (max-width: 700px) {
  .welcome-secondary-actions { grid-template-columns: 1fr; }
  .welcome-view { padding-top: var(--space-6); }
  .new-project-form { padding: var(--space-4); }
  .form-footer { align-items: stretch; flex-direction: column; }
  .primary-button { width: 100%; }
  .intent-button { min-width: 132px; }
}

/* Sidebar hierarchy: quiet editorial navigation ----------------------------- */
.project-sidebar {
  --sidebar-ink: #29232f;
  --sidebar-text: #4d4654;
  --sidebar-muted: #655e6c;
  --sidebar-hover: #f2eff8;
  --sidebar-group: #f5f2fb;
  --sidebar-active: #5b32d6;
  --sidebar-divider: #e5e1e8;
}

.project-sidebar .pane-header {
  height: 44px;
  padding-inline: 14px 10px;
  color: var(--sidebar-ink);
  font-size: 13px;
  font-weight: 720;
  letter-spacing: 0;
}

.sidebar-section-label {
  padding: 15px 14px 8px;
  color: #403947;
  font-size: 11.5px;
  font-weight: 680;
  line-height: 1;
  letter-spacing: .04em;
  text-transform: none;
}

.project-list {
  padding: 2px 14px 26px 9px;
}

.project-tree {
  margin: 0 0 9px;
}

.project-item {
  position: relative;
  min-height: 38px;
  padding: 8px 10px;
  color: #332d39;
  background: transparent;
  border-color: transparent;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: -.01em;
}

/* Project lifecycle and data control ---------------------------------------- */
.world-switcher-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: 0;
  cursor: default;
}
.world-switcher-item-open {
  min-width: 0;
  display: grid;
  gap: 7px;
  padding: 12px 4px;
  color: inherit;
  text-align: left;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.world-switcher-item-open:hover,
.world-switcher-item-open:focus-visible { color: #5b32d6; }
.world-switcher-item-manage {
  min-width: 48px;
  min-height: 44px;
  padding: 0 8px;
  color: #655e6c;
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.world-switcher-item-manage:hover,
.world-switcher-item-manage:focus-visible { color: #fff; background: #5b32d6; }
.world-switcher-item[data-lifecycle="archived"] .world-switcher-current-label { color: #6d6572; }
.world-switcher-item[data-lifecycle="trashed"] .world-switcher-current-label { color: var(--danger-text); box-shadow: inset 0 -2px 0 var(--danger); }

.project-settings-dialog,
.permanent-delete-dialog,
.account-dialog,
.recovery-code-dialog,
.account-close-dialog {
  position: fixed;
  inset: 0;
  z-index: 96;
  display: grid;
  place-items: center;
  padding: 24px;
}
.project-settings-dialog[hidden],
.permanent-delete-dialog[hidden],
.account-dialog[hidden],
.recovery-code-dialog[hidden],
.account-close-dialog[hidden] { display: none !important; }
.permanent-delete-dialog { z-index: 98; }
.account-dialog { z-index: 97; }
.recovery-code-dialog,
.account-close-dialog { z-index: 99; }
.project-settings-backdrop,
.permanent-delete-backdrop,
.account-dialog-backdrop,
.recovery-code-backdrop,
.account-close-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgba(27, 23, 32, .48);
  border: 0;
  backdrop-filter: blur(5px);
  opacity: 0;
  transition: opacity 180ms ease;
}
.project-settings-panel,
.permanent-delete-panel,
.account-dialog-panel,
.recovery-code-panel,
.account-close-panel {
  position: relative;
  width: min(760px, calc(100vw - 48px));
  max-height: min(820px, calc(100vh - 48px));
  overflow: auto;
  color: #2d2733;
  background: #fbfafc;
  border: 1px solid #dcd7e0;
  border-radius: 12px;
  box-shadow: 0 30px 90px rgba(32, 25, 42, .28);
  opacity: 0;
  transform: translateY(14px) scale(.985);
  transition: opacity 180ms ease, transform 220ms var(--motion-in);
}
.permanent-delete-panel { width: min(590px, calc(100vw - 48px)); }
.account-dialog-panel { width: min(780px, calc(100vw - 48px)); }
.recovery-code-panel { width: min(520px, calc(100vw - 48px)); padding: 30px; }
.account-close-panel { width: min(590px, calc(100vw - 48px)); }
.project-settings-panel > header,
.permanent-delete-panel > header,
.account-dialog-panel > header,
.account-close-panel > header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 18px;
  background: rgba(251, 250, 252, .96);
  border-bottom: 1px solid #e3dfe6;
  backdrop-filter: blur(12px);
}
.project-settings-panel > header span,
.permanent-delete-panel > header span,
.account-dialog-panel > header span,
.account-close-panel > header span,
.project-settings-section-heading > span {
  color: #756d7b;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.project-settings-panel > header h2,
.permanent-delete-panel > header h2,
.account-dialog-panel > header h2,
.account-close-panel > header h2,
.project-settings-section-heading h3 {
  margin: 5px 0 0;
  color: #29232f;
  letter-spacing: -.025em;
}
.project-settings-panel > header h2,
.permanent-delete-panel > header h2,
.account-dialog-panel > header h2,
.account-close-panel > header h2 { font-size: 24px; }
.project-settings-content { display: grid; gap: 24px; padding: 24px; }
.project-settings-identity {
  --cover-a: #16243a;
  --cover-b: #806646;
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  align-items: center;
  gap: 24px;
}
.project-settings-identity[data-accent="frost"] { --cover-a: #71869a; --cover-b: #d7c8ad; }
.project-settings-identity[data-accent="ember"] { --cover-a: #4b2e2d; --cover-b: #b56d43; }
.project-settings-identity[data-accent="moss"] { --cover-a: #263c36; --cover-b: #7c8b5d; }
.project-settings-identity[data-accent="wine"] { --cover-a: #4c1f31; --cover-b: #9a495b; }
.project-cover-preview {
  min-height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 18px;
  color: #fff;
  background:
    radial-gradient(circle at 78% 18%, color-mix(in srgb, var(--cover-b) 82%, white) 0 3px, transparent 4px),
    linear-gradient(150deg, var(--cover-a), color-mix(in srgb, var(--cover-a) 72%, var(--cover-b)) 62%, var(--cover-b));
  border-radius: 9px 9px 16px 9px;
  box-shadow: 10px 12px 0 color-mix(in srgb, var(--cover-b) 20%, transparent);
}
.project-cover-preview > span { font-family: Georgia, serif; font-size: 28px; opacity: .8; }
.project-cover-preview strong { font-family: Georgia, "Noto Serif SC", serif; font-size: 22px; line-height: 1.25; }
.project-cover-preview small { color: rgba(255,255,255,.72); font-size: 11px; letter-spacing: .05em; }
.project-settings-identity > div:last-child > span { color: #5b32d6; font-size: 11px; font-weight: 720; }
.project-settings-identity h3 { margin: 8px 0 9px; font-size: 27px; letter-spacing: -.035em; }
.project-settings-identity p,
.project-data-boundary { margin: 0; color: #6e6674; font-size: 13px; line-height: 1.7; }
.project-settings-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  border: 1px solid #e0dce3;
  border-radius: 9px;
  overflow: hidden;
}
.project-settings-facts > div { min-width: 0; padding: 14px; border-right: 1px solid #e0dce3; }
.project-settings-facts > div:last-child { border-right: 0; }
.project-settings-facts dt { color: #7a727f; font-size: 10px; font-weight: 700; }
.project-settings-facts dd { margin: 6px 0 0; color: #332d39; font-size: 12px; font-weight: 680; overflow-wrap: anywhere; }
.project-metadata-form,
.project-data-control { display: grid; gap: 16px; padding-top: 4px; }
.project-metadata-form > label { display: grid; gap: 7px; color: #514a58; font-size: 12px; font-weight: 680; }
.project-metadata-form select {
  min-height: 44px;
  width: 100%;
  padding: 9px 11px;
  color: #2f2935;
  background: #fff;
  border: 1px solid #cbc5cf;
  border-radius: 7px;
}
.project-metadata-form input[type="text"],
.project-metadata-form > label > input,
.permanent-delete-panel input[type="text"],
.permanent-delete-panel input[type="password"],
.account-dialog-panel input[type="password"],
.account-close-panel input[type="email"],
.account-close-panel input[type="password"] {
  min-height: 44px;
  width: 100%;
  padding: 9px 11px;
  color: #2f2935;
  background: #fff;
  border: 1px solid #cbc5cf;
  border-radius: 7px;
}
.project-metadata-form small,
.permanent-delete-panel label small,
.account-close-panel label small,
.permanent-delete-error { padding-left: 8px; color: var(--danger-text); border-left: 2px solid var(--danger); font-size: 11px; font-weight: 650; }
.project-metadata-form fieldset { margin: 0; padding: 0; border: 0; }
.project-metadata-form legend { margin-bottom: 8px; color: #514a58; font-size: 12px; font-weight: 680; }
.project-cover-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.project-cover-choice { position: relative; min-width: 0; display: grid; justify-items: center; gap: 7px; padding: 9px 5px; border: 1px solid #ddd8e1; border-radius: 7px; cursor: pointer; }
.project-cover-choice input { position: absolute; opacity: 0; }
.project-cover-choice > span { width: 100%; height: 34px; background: linear-gradient(145deg, #17263d, #8b6e49); border-radius: 5px; }
.project-cover-choice[data-accent="frost"] > span { background: linear-gradient(145deg, #71869a, #d7c8ad); }
.project-cover-choice[data-accent="ember"] > span { background: linear-gradient(145deg, #4b2e2d, #b56d43); }
.project-cover-choice[data-accent="moss"] > span { background: linear-gradient(145deg, #263c36, #7c8b5d); }
.project-cover-choice[data-accent="wine"] > span { background: linear-gradient(145deg, #4c1f31, #9a495b); }
.project-cover-choice strong { color: #655e6c; font-size: 10px; }
.project-cover-choice:has(input:checked) { border-color: #5b32d6; box-shadow: 0 0 0 2px rgba(91,50,214,.12); }
.project-cover-choice:has(input:focus-visible) { outline: 3px solid rgba(91,50,214,.24); outline-offset: 2px; }

.proposal-evidence { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.proposal-evidence span { padding: 4px 7px; color: #625a69; background: #f3f0f5; border-radius: 4px; font-size: 11px; }
.proposal-stale-note,
.understanding-input-note { color: #625a69; font-size: 12px; line-height: 1.55; }
.proposal-stale-note { padding-left: 10px; border-left: 3px solid #cfc8d4; }
.candidate-set-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.candidate-set-actions button { min-height: 44px; padding: 8px 12px; border: 1px solid #cfc8d4; border-radius: 5px; background: #fff; cursor: pointer; }
.proposal-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.proposal-actions button,
.proposal-revision-form button,
.relation-reject-button {
  min-height: 44px;
  padding: 8px 12px;
  color: #4f4656;
  background: #fff;
  border: 1px solid #cfc8d4;
  border-radius: 5px;
  cursor: pointer;
  font-weight: 680;
}
.proposal-actions .adopt-proposal-button,
.proposal-revision-form button { color: #fff; background: var(--violet); border-color: var(--violet); }
.proposal-actions button:hover,
.proposal-revision-form button:hover,
.relation-reject-button:hover { color: #fff; background: #2f2935; border-color: #2f2935; }
.proposal-revision-form { margin-top: 14px; padding-top: 12px; border-top: 1px solid #e0dbe3; }
.proposal-revision-form summary { min-height: 44px; display: flex; align-items: center; color: #4f4656; cursor: pointer; font-weight: 720; }
.proposal-revision-form label { display: grid; gap: 6px; margin-top: 10px; color: #625a69; font-size: 12px; }
.proposal-revision-form input,
.proposal-revision-form textarea,
.manual-setting-form input,
.manual-setting-form select,
.manual-setting-form textarea {
  width: 100%;
  min-height: 44px;
  padding: 9px 11px;
  color: var(--text);
  background: #fff;
  border: 1px solid #cbc5cf;
  border-radius: 6px;
}
.proposal-revision-form textarea,
.manual-setting-form textarea { min-height: 112px; resize: vertical; }
.manual-setting-form {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(150px, .7fr));
  gap: 12px;
  margin-bottom: 18px;
  padding: 18px;
  color: var(--text);
  background: #f8f6fa;
  border: 1px solid #dcd6e0;
  border-radius: 7px;
}
.manual-setting-form > div,
.manual-setting-form .is-wide { grid-column: 1 / -1; }
.manual-setting-form h2 { margin: 3px 0 5px; font-size: 18px; }
.manual-setting-form p { margin: 0; color: #625a69; line-height: 1.6; }
.manual-setting-form label { display: grid; align-content: start; gap: 6px; color: #514a58; font-size: 12px; font-weight: 680; }
.manual-setting-form button { min-height: 44px; justify-self: start; padding: 0 16px; color: #fff; background: var(--violet); border: 1px solid var(--violet); border-radius: 5px; cursor: pointer; font-weight: 720; }
.relation-proposal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

@media (max-width: 700px) {
  .manual-setting-form { grid-template-columns: 1fr; }
  .manual-setting-form > div,
  .manual-setting-form .is-wide { grid-column: 1; }
  .proposal-actions button,
  .proposal-revision-form button,
  .relation-proposal-actions button,
  .candidate-set-actions button { width: 100%; }
  .relation-proposal-actions { width: 100%; }
}
.project-settings-save,
.project-lifecycle-actions button,
.permanent-delete-panel footer button,
.account-dialog-content button,
.recovery-code-panel button,
.account-close-panel footer button {
  min-height: 44px;
  border-radius: 7px;
  font-weight: 720;
  cursor: pointer;
}
.project-settings-save { justify-self: start; padding: 0 18px; color: #fff; background: #5b32d6; border: 1px solid #5b32d6; }
.project-readonly-note { display: grid; gap: 5px; padding: 15px 16px; color: #514a58; background: #f1eef4; border-left: 4px solid #776c80; border-radius: 4px 8px 8px 4px; }
.project-readonly-note strong { color: #332d39; font-size: 13px; }
.project-readonly-note span { font-size: 12px; line-height: 1.6; }
.project-lifecycle-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.project-lifecycle-actions button { display: grid; gap: 5px; padding: 13px 14px; color: #423b49; text-align: left; background: #fff; border: 1px solid #d9d4dd; }
.project-lifecycle-actions button strong { font-size: 13px; }
.project-lifecycle-actions button span { color: #746d79; font-size: 11px; line-height: 1.55; }
.project-lifecycle-actions button:hover,
.project-lifecycle-actions button:focus-visible { border-color: #6a46ef; box-shadow: 0 0 0 2px rgba(106,70,239,.1); }
.project-lifecycle-actions button.is-caution { border-color: #bd9258; }
.project-lifecycle-actions button.is-danger { color: var(--danger-text); border-color: var(--danger); }
.project-lifecycle-actions button.is-danger span { color: var(--danger-text); }
.project-export-form { grid-column: 1 / -1; display: grid; gap: 10px; padding: 14px; border: 1px solid #d9d4dd; border-radius: 8px; background: #f8f6fa; }
.project-export-form label { display: grid; gap: 7px; color: #4c4552; font-size: 12px; font-weight: 680; }
.project-export-form label span { color: #4c4552; }
.project-export-form > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.project-data-boundary { padding-top: 3px; }

.permanent-delete-panel form,
.account-close-panel form { display: grid; gap: 16px; padding: 24px; }
.permanent-delete-warning { padding: 15px 16px; color: var(--danger-text); background: var(--danger-soft); border: 1px solid var(--danger-border); border-radius: 8px; }
.permanent-delete-warning strong { font-size: 13px; }
.permanent-delete-warning p { margin: 7px 0 0; font-size: 12px; line-height: 1.65; }
.permanent-delete-panel form > label:not(.permanent-delete-check),
.account-close-panel form > label:not(.permanent-delete-check) { display: grid; gap: 7px; color: #4c4552; font-size: 12px; font-weight: 680; }
.permanent-delete-check { display: flex; align-items: flex-start; gap: 10px; color: #4f4855; font-size: 12px; line-height: 1.55; cursor: pointer; }
.permanent-delete-check input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--danger); }
.permanent-delete-panel footer,
.account-close-panel footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 4px; }
.permanent-delete-panel footer button,
.account-close-panel footer button { padding: 0 17px; }
.permanent-delete-panel .is-secondary,
.account-close-panel .is-secondary { color: #4f4855; background: #fff; border: 1px solid #d1ccd5; }
.permanent-delete-panel .is-danger,
.account-close-panel .is-danger { color: var(--danger-on); background: var(--danger); border: 1px solid var(--danger); }
.permanent-delete-panel .is-danger:hover,
.account-close-panel .is-danger:hover { background: var(--danger); filter: brightness(.92); }

.account-dialog-content { display: grid; gap: 16px; padding: 24px; }
.account-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid #e0dce3; border-radius: 9px; overflow: hidden; }
.account-summary > div { min-width: 0; display: grid; gap: 5px; padding: 15px; border-right: 1px solid #e0dce3; }
.account-summary > div:last-child { border-right: 0; }
.account-summary span { color: #756d7b; font-size: 10px; font-weight: 740; }
.account-summary strong { overflow-wrap: anywhere; color: #2f2935; font-size: 14px; }
.account-summary small { color: #756d7b; font-size: 10.5px; line-height: 1.45; }
.account-control-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, 280px); gap: 22px; align-items: end; padding: 18px; background: #fff; border: 1px solid #ded9e2; border-radius: 9px; }
.account-control-heading span { color: #6a46ef; font-size: 10px; font-weight: 750; letter-spacing: .05em; }
.account-control-heading h3 { margin: 5px 0 7px; color: #302a36; font-size: 15px; }
.account-control-heading p { margin: 0; color: #706976; font-size: 11.5px; line-height: 1.6; }
.account-control-card form { display: grid; gap: 9px; }
.account-control-card form label { display: grid; gap: 6px; color: #514a58; font-size: 11px; font-weight: 680; }
.account-control-card button { min-height: 42px; padding: 0 14px; color: #fff; background: #5b32d6; border: 1px solid #5b32d6; border-radius: 7px; font-weight: 700; cursor: pointer; }
.account-control-card button:hover:not(:disabled) { background: #4923c7; }
.account-control-card button:disabled { color: #8b8490; background: #eeeaf0; border-color: #ddd7e0; cursor: not-allowed; }
.account-control-error { margin: 0; padding-left: 8px; color: var(--danger-text); border-left: 2px solid var(--danger); font-size: 11px; font-weight: 650; }
.account-preferences-card button,
.account-session-card button { color: #4f4855; background: #fff; border-color: #d1ccd5; }
.account-preferences-card button:hover:not(:disabled),
.account-session-card button:hover:not(:disabled) { color: #5b32d6; background: #f6f2ff; border-color: #b7a7df; }
.account-danger-card { border-color: var(--danger-border); background: var(--danger-soft); }
.account-danger-card .account-control-heading span,
.account-danger-card .account-control-heading h3 { color: var(--danger-text); }
.account-danger-card button:not(:disabled) { color: var(--danger-on); background: var(--danger); border-color: var(--danger); }
.account-danger-card button:hover:not(:disabled) { background: var(--danger); filter: brightness(.92); }

.recovery-code-panel > span { color: #6a46ef; font-size: 10px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.recovery-code-panel h2 { margin: 7px 0 10px; color: #2d2733; font-size: 25px; letter-spacing: -.03em; }
.recovery-code-panel p { margin: 0; color: #6e6674; font-size: 12px; line-height: 1.65; }
.recovery-code-panel output { display: block; margin: 22px 0; padding: 17px 14px; color: #291f3b; background: #f1edfa; border: 1px dashed #9076ce; border-radius: 8px; font-family: ui-monospace, "Cascadia Code", monospace; font-size: clamp(15px, 3vw, 21px); font-weight: 760; letter-spacing: .04em; text-align: center; overflow-wrap: anywhere; user-select: all; }
.recovery-code-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.recovery-code-actions button { padding: 0 13px; color: #4f4855; background: #fff; border: 1px solid #d1ccd5; }
.recovery-code-actions button:last-child { grid-column: 1 / -1; color: #fff; background: #5b32d6; border-color: #5b32d6; }

.project-settings-dialog[data-open="true"] .project-settings-backdrop,
.permanent-delete-dialog[data-open="true"] .permanent-delete-backdrop,
.account-dialog[data-open="true"] .account-dialog-backdrop,
.recovery-code-dialog[data-open="true"] .recovery-code-backdrop,
.account-close-dialog[data-open="true"] .account-close-backdrop { opacity: 1; }
.project-settings-dialog[data-open="true"] .project-settings-panel,
.permanent-delete-dialog[data-open="true"] .permanent-delete-panel,
.account-dialog[data-open="true"] .account-dialog-panel,
.recovery-code-dialog[data-open="true"] .recovery-code-panel,
.account-close-dialog[data-open="true"] .account-close-panel { opacity: 1; transform: none; }
.project-settings-dialog :focus-visible,
.permanent-delete-dialog :focus-visible,
.account-dialog :focus-visible,
.recovery-code-dialog :focus-visible,
.account-close-dialog :focus-visible { outline: 3px solid rgba(91,50,214,.28); outline-offset: 2px; }

@media (max-width: 700px) {
  .project-settings-dialog,
  .permanent-delete-dialog,
  .account-dialog,
  .account-close-dialog { align-items: end; padding: 0; }
  .project-settings-panel,
  .permanent-delete-panel,
  .account-dialog-panel,
  .account-close-panel { width: 100vw; max-height: 94vh; border-radius: 16px 16px 0 0; border-inline: 0; border-bottom: 0; }
  .project-settings-panel > header,
  .permanent-delete-panel > header,
  .account-dialog-panel > header,
  .account-close-panel > header { padding: 18px 18px 15px; }
  .project-settings-content,
  .permanent-delete-panel form,
  .account-dialog-content,
  .account-close-panel form { padding: 18px; }
  .project-settings-identity { grid-template-columns: 108px minmax(0, 1fr); gap: 16px; align-items: start; }
  .project-cover-preview { min-height: 150px; padding: 12px; }
  .project-cover-preview strong { font-size: 16px; }
  .project-settings-identity h3 { font-size: 22px; }
  .project-settings-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-settings-facts > div:nth-child(2) { border-right: 0; }
  .project-settings-facts > div:nth-child(-n+2) { border-bottom: 1px solid #e0dce3; }
  .project-cover-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .project-lifecycle-actions { grid-template-columns: 1fr; }
  .project-export-form > div { grid-template-columns: 1fr; }
  .account-summary { grid-template-columns: 1fr; }
  .account-summary > div { border-right: 0; border-bottom: 1px solid #e0dce3; }
  .account-summary > div:last-child { border-bottom: 0; }
  .account-control-card { grid-template-columns: 1fr; align-items: stretch; }
}

@media (prefers-reduced-motion: reduce) {
  .project-settings-backdrop,
  .permanent-delete-backdrop,
  .project-settings-panel,
  .permanent-delete-panel { transition-duration: 1ms !important; }
  .project-settings-panel,
  .permanent-delete-panel { transform: none !important; }
}

.project-item:hover,
.project-item:focus-visible {
  color: var(--sidebar-active);
  background: var(--sidebar-hover);
  border-color: transparent;
}

.project-item.is-active {
  color: var(--sidebar-active);
  background: #efebfa;
  border-color: transparent;
  box-shadow: inset 2px 0 0 var(--sidebar-active);
}

.project-tree-content {
  gap: 7px;
  margin: 6px 0 10px;
  padding-left: 8px;
  border-left: 0;
}

.project-tree-loading {
  margin: 5px 0 8px 8px;
  padding: 8px 10px;
  color: var(--sidebar-muted);
  background: #f4f2f6;
  border-left: 0;
  border-radius: 5px;
  font-size: 11.5px;
}

.tree-folder,
.tree-file {
  border-color: transparent;
  letter-spacing: 0;
}

.tree-folder {
  position: relative;
  min-height: 30px;
  padding: 5px 9px;
  color: var(--sidebar-text);
  border-radius: 5px;
  font-size: 13px;
  font-weight: 580;
}

.tree-folder::after {
  content: "";
  width: 7px;
  height: 1.5px;
  justify-self: end;
  background: currentColor;
  border-radius: 999px;
  opacity: .28;
  transform-origin: right center;
  transition: width 160ms var(--motion-standard), opacity 160ms ease;
}

.tree-folder.is-expanded::after {
  width: 14px;
  opacity: .66;
}

.tree-folder.depth-1 {
  min-height: 33px;
  margin-top: 0;
  padding: 6px 9px 6px 10px;
  color: #403947;
  background: transparent;
  font-size: 13.5px;
  font-weight: 680;
}

.tree-folder.depth-2,
.tree-folder.depth-3,
.tree-folder.depth-4 {
  min-height: 30px;
  color: var(--sidebar-text);
  font-size: 13px;
  font-weight: 580;
}

.project-tree-content > .tree-folder.depth-1:not(:first-child) {
  margin-top: 2px;
}

.tree-folder:hover,
.tree-folder:focus-visible {
  color: #4923c7;
  background: var(--sidebar-hover);
  border-color: transparent;
}

.tree-folder.depth-1.is-expanded {
  color: var(--sidebar-active);
  background: var(--sidebar-group);
}

.tree-folder:not(.depth-1).is-expanded {
  color: #3d3545;
  background: #f7f5f9;
}

.tree-children {
  gap: 1px;
  margin: 2px 0 3px;
  padding-left: 11px;
  border-left: 0;
}

.tree-file,
.tree-file.depth-2,
.tree-file.depth-3,
.tree-file.depth-4 {
  min-height: 29px;
  padding: 4px 8px 4px 10px;
  color: #5a5361;
  background: transparent;
  border-color: transparent;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 450;
}

.tree-file:hover,
.tree-file:focus-visible {
  color: #332b3a;
  background: transparent;
  border-color: transparent;
}

.tree-file.is-active,
.tree-file.is-active.is-empty {
  color: var(--sidebar-active);
  background: transparent;
  border-color: transparent;
  font-weight: 680;
}

.tree-file.is-empty {
  color: #77707e;
  opacity: .72;
}

.tree-active-indicator {
  width: 2px;
  height: 17px;
  background: var(--sidebar-active);
  box-shadow: none;
}

.project-sidebar .tree-folder:focus-visible,
.project-sidebar .tree-file:focus-visible,
.project-sidebar .project-item:focus-visible {
  outline: 2px solid rgba(91, 50, 214, .42);
  outline-offset: -1px;
}

@media (prefers-reduced-motion: reduce) {
  .tree-folder::after { transition: none; }
}

/* Main navigation mirrors the project sidebar -------------------------------- */
.staggered-panel-kicker {
  color: #5f5767;
  letter-spacing: .08em;
}

.staggered-menu-list {
  gap: 4px;
}

.staggered-menu-item {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "label"
    "note";
  row-gap: 7px;
  padding: 10px 0 19px;
}

.staggered-menu-item::after {
  left: 0;
}

.staggered-menu-label {
  font-size: clamp(44px, 5.6vw, 74px);
  line-height: .96;
  letter-spacing: -.055em;
}

.staggered-menu-note,
.staggered-menu-item:hover .staggered-menu-note,
.staggered-menu-item:focus-visible .staggered-menu-note {
  max-height: 28px;
  color: #514a58;
  font-size: 13px;
  font-weight: 480;
  line-height: 1.45;
  opacity: 1;
  transform: none;
}

.staggered-menu-item[aria-current="page"]::before {
  content: "当前";
  position: absolute;
  top: 14px;
  right: 0;
  color: #5b32d6;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .08em;
}

.staggered-menu-item:disabled {
  color: #8c8691;
  cursor: default;
  opacity: 1;
}

.staggered-menu-item:disabled::after { background: #d6d1db; transform: scaleX(1); }
.staggered-menu-item:disabled:hover { color: #8c8691; }
.staggered-menu-item:disabled .staggered-menu-note { color: #8c8691; }

.staggered-toggle-text {
  width: 34px;
}

@media (max-width: 760px) {
  .staggered-menu-label { font-size: clamp(40px, 13vw, 64px); }
  .staggered-menu-note { font-size: 12.5px; }
}

/* Single-world workspace and animated world switcher ------------------------- */
.world-switcher {
  position: fixed;
  inset: 0;
  z-index: 86;
  pointer-events: none;
  --switcher-width: clamp(370px, 35vw, 520px);
}

.world-switcher-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  background: rgba(43, 36, 49, .34);
  border: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 240ms ease;
}

.world-switcher-prelayers,
.world-switcher-panel {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--switcher-width);
  height: 100%;
}

.world-switcher-prelayers { overflow: hidden; }
.world-switcher-prelayer {
  position: absolute;
  inset: 0;
  transform: translate3d(-103%, 0, 0);
  will-change: transform;
}
.world-switcher-prelayer-soft {
  background: #b8a4d0;
  transition: transform 360ms var(--motion-ease) 45ms;
}
.world-switcher-prelayer-violet {
  background: #6a46ef;
  transition: transform 360ms var(--motion-ease) 95ms;
}

.world-switcher-panel {
  overflow: auto;
  color: #29232f;
  background: #fbfafc;
  border-right: 1px solid #ded9e3;
  transform: translate3d(-103%, 0, 0);
  visibility: hidden;
  pointer-events: auto;
  transition: transform 280ms var(--motion-ease), visibility 0s linear 460ms;
  will-change: transform;
}

.world-switcher-panel-inner {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 5vh, 54px) 28px 32px;
}

.world-switcher-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 28px;
}
.world-switcher-header span {
  color: #68616f;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}
.world-switcher-header h2 {
  margin: 5px 0 0;
  color: #29232f;
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -.035em;
}

.world-switcher-close,
.world-switcher-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #4e4755;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.world-switcher-close {
  min-height: 32px;
  padding: 0;
  font-size: 12px;
  font-weight: 650;
}
.world-switcher-close-icon,
.world-switcher-toggle-icon {
  position: relative;
  width: 15px;
  height: 15px;
}
.world-switcher-close-icon i,
.world-switcher-toggle-icon i {
  position: absolute;
  top: 7px;
  left: 0;
  width: 15px;
  height: 1.5px;
  background: currentColor;
  border-radius: 999px;
}
.world-switcher-close-icon i:first-child { transform: rotate(45deg); }
.world-switcher-close-icon i:last-child { transform: rotate(-45deg); }
.world-switcher-toggle-icon i:last-child { transform: rotate(90deg); }

.world-switcher-toggle {
  min-height: 30px;
  padding: 0 2px;
  color: #514a58;
  font-size: 11.5px;
  font-weight: 650;
}
.world-switcher-toggle:hover,
.world-switcher-toggle:focus-visible,
.world-switcher-close:hover,
.world-switcher-close:focus-visible { color: #5b32d6; }

.world-switcher-create {
  min-height: 66px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  padding: 12px 15px;
  color: #fff;
  text-align: left;
  background: #5b32d6;
  border: 1px solid #5b32d6;
  border-radius: 7px;
  cursor: pointer;
  transition: background-color 160ms ease, transform 160ms var(--motion-standard);
}
.world-switcher-create:hover { background: #4923c7; }
.world-switcher-create:active { transform: scale(.99); }
.world-switcher-create span { display: grid; gap: 3px; }
.world-switcher-create strong { font-size: 14px; }
.world-switcher-create small { color: rgba(255,255,255,.78); font-size: 11px; }
.world-switcher-create svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
}

.world-switcher-list-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin: 30px 0 8px;
  padding-bottom: 9px;
  color: #655e6c;
  border-bottom: 1px solid #e2dee6;
  font-size: 11px;
  font-weight: 650;
}
.world-switcher-list { display: grid; }
.world-switcher-item {
  position: relative;
  min-height: 66px;
  display: grid;
  align-content: center;
  gap: 7px;
  padding: 10px 4px;
  color: #403947;
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e7e3e9;
  cursor: pointer;
  opacity: 0;
  transform: translate3d(-16px, 0, 0);
  transition: color 150ms ease, opacity 260ms var(--motion-in), transform 300ms var(--motion-in);
}
.world-switcher-item:hover,
.world-switcher-item:focus-visible { color: #5b32d6; }
.world-switcher-item.is-current { color: #5b32d6; }
.world-switcher-item-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.world-switcher-item-heading strong { font-size: 14px; font-weight: 680; }
.world-switcher-current-label {
  color: #5b32d6;
  font-size: 10px;
  font-weight: 700;
}
.world-switcher-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  color: #746d7a;
  font-size: 11px;
}
.world-switcher-empty {
  margin: 24px 0 0;
  color: #655e6c;
  font-size: 13px;
  line-height: 1.65;
}

.world-switcher[data-open="true"] { pointer-events: auto; }
.world-switcher[data-open="true"] .world-switcher-backdrop { opacity: 1; pointer-events: auto; }
.world-switcher[data-open="true"] .world-switcher-prelayer { transform: translate3d(0, 0, 0); }
.world-switcher[data-open="true"] .world-switcher-panel {
  transform: translate3d(0, 0, 0);
  visibility: visible;
  transition: transform 380ms var(--motion-ease) 135ms, visibility 0s;
}
.world-switcher[data-open="true"] .world-switcher-item { opacity: 1; transform: none; }
.world-switcher[data-open="true"] .world-switcher-item:nth-child(1) { transition-delay: 250ms; }
.world-switcher[data-open="true"] .world-switcher-item:nth-child(2) { transition-delay: 275ms; }
.world-switcher[data-open="true"] .world-switcher-item:nth-child(3) { transition-delay: 300ms; }
.world-switcher[data-open="true"] .world-switcher-item:nth-child(4) { transition-delay: 325ms; }
.world-switcher[data-open="true"] .world-switcher-item:nth-child(n+5) { transition-delay: 340ms; }

@media (max-width: 700px) {
  .world-switcher { --switcher-width: 100vw; }
  .world-switcher-panel-inner { padding-inline: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .world-switcher-backdrop,
  .world-switcher-prelayer,
  .world-switcher-panel,
  .world-switcher-item { transition-duration: 1ms !important; transition-delay: 0ms !important; }
  .world-switcher-item { transform: none; }
}

/* Sidebar type rhythm and unambiguous switch action -------------------------- */
.project-sidebar .pane-header {
  color: #2d2733;
  font-size: 12.5px;
  font-weight: 660;
}

.sidebar-section-label {
  padding-top: 14px;
  color: #514a58;
  font-size: 11px;
  font-weight: 620;
  letter-spacing: .025em;
}

.project-item {
  min-height: 37px;
  font-size: 14px;
  font-weight: 620;
}

.tree-folder.depth-1 {
  font-size: 13px;
  font-weight: 630;
}

.tree-folder.depth-2,
.tree-folder.depth-3,
.tree-folder.depth-4 {
  font-size: 12.5px;
  font-weight: 590;
}

.tree-file,
.tree-file.depth-2,
.tree-file.depth-3,
.tree-file.depth-4 {
  font-size: 12.5px;
  font-weight: 460;
}

.tree-file.is-active,
.tree-file.is-active.is-empty {
  font-weight: 620;
}

.world-switcher-toggle {
  width: 30px;
  height: 30px;
  min-height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #655e6c;
  background: transparent;
  border: 0;
  border-radius: 5px;
  transition: color 150ms ease, background-color 150ms ease;
}

.world-switcher-toggle svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.world-switcher-toggle:hover,
.world-switcher-toggle:focus-visible {
  color: #5b32d6;
  background: #efebfa;
}

/* Stronger sidebar hierarchy ------------------------------------------------- */
.project-item,
.project-item.is-active {
  min-height: 42px;
  padding: 9px 38px 9px 11px;
  color: #29232f;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e3dfe6;
  border-radius: 0;
  box-shadow: none;
  font-size: 15px;
  font-weight: 690;
}

.project-item::after {
  content: "当前";
  position: absolute;
  top: 50%;
  right: 8px;
  color: #6a46ef;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .04em;
  transform: translateY(-50%);
}

.project-item:hover,
.project-item:focus-visible,
.project-item.is-active:hover,
.project-item.is-active:focus-visible {
  color: #5b32d6;
  background: transparent;
  border-color: #d8d1e0;
}

.project-tree-content {
  gap: 4px;
  margin-top: 9px;
  padding-left: 4px;
}

.project-direction-entry {
  width: 100%;
  min-height: 46px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  align-items: center;
  gap: 8px;
  padding: 7px 10px 7px 13px;
  color: #403947;
  text-align: left;
  background: #fff;
  border: 1px solid #ddd7e3;
  border-radius: 6px;
  cursor: pointer;
  transition: color var(--motion-fast) var(--motion-standard), background-color var(--motion-fast) var(--motion-standard), border-color var(--motion-fast) var(--motion-standard);
}

.project-direction-entry:hover,
.project-direction-entry:focus-visible {
  color: #4923c7;
  background: #f7f4fc;
  border-color: #c9bced;
}

.project-direction-entry:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--violet) 42%, transparent);
  outline-offset: 2px;
}

.project-direction-entry.is-branch {
  color: #4f2bc0;
  background: #f3effd;
  border-color: #cdbff2;
}

.project-direction-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.project-direction-copy strong {
  font-size: 13px;
  font-weight: 680;
}

.project-direction-copy small {
  overflow: hidden;
  color: #756d7d;
  font-size: 11.5px;
  font-weight: 450;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-direction-entry svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .72;
}

.tree-folder.depth-1,
.tree-folder.depth-1.is-expanded {
  min-height: 36px;
  padding: 7px 10px 7px 13px;
  color: #5b32d6;
  background: #f0ecfb;
  border: 0;
  border-radius: 5px;
  box-shadow: inset 3px 0 0 #6a46ef;
  font-size: 13.5px;
  font-weight: 680;
}

.tree-folder.depth-1:hover,
.tree-folder.depth-1:focus-visible {
  color: #4923c7;
  background: #e9e3fa;
}

.project-tree-content > .tree-folder.depth-1:not(:first-child) {
  margin-top: 9px;
}

.tree-folder.depth-2,
.tree-folder.depth-3,
.tree-folder.depth-4,
.tree-folder:not(.depth-1).is-expanded {
  min-height: 32px;
  padding: 5px 9px;
  color: #3d3644;
  background: #f6f4f7;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  font-size: 12.5px;
  font-weight: 630;
}

.tree-folder.depth-2:hover,
.tree-folder.depth-3:hover,
.tree-folder.depth-4:hover,
.tree-folder.depth-2:focus-visible,
.tree-folder.depth-3:focus-visible,
.tree-folder.depth-4:focus-visible {
  color: #332d39;
  background: #efedf1;
}

.tree-children {
  margin-top: 4px;
  margin-bottom: 5px;
  padding-left: 13px;
}

.tree-file,
.tree-file.depth-2,
.tree-file.depth-3,
.tree-file.depth-4 {
  min-height: 30px;
  color: #5d5664;
  font-weight: 460;
}

.tree-file.is-active,
.tree-file.is-active.is-empty {
  color: #5b32d6;
  font-weight: 640;
}

/* Project overview entry and panel ------------------------------------------ */
.project-item,
.project-item.is-active {
  width: 100%;
  font-size: 16.5px;
}

.world-switcher-toggle {
  width: 34px;
  height: 32px;
  min-height: 32px;
  color: #5b32d6;
  background: #efebfa;
  border: 1px solid #d8cff8;
  border-radius: 6px;
  box-shadow: 0 1px 2px rgba(75, 52, 105, .08);
}

.world-switcher-toggle:hover,
.world-switcher-toggle:focus-visible {
  color: #fff;
  background: #5b32d6;
  border-color: #5b32d6;
}

.world-switcher-projects-view[hidden] { display: none; }

.world-overview-panel {
  display: grid;
  gap: 24px;
}

.world-overview-panel[hidden] { display: none; }

.world-overview-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #6a46ef;
  font-size: 11px;
  font-weight: 650;
}

.world-overview-status span:last-child {
  color: #746d7a;
  font-weight: 500;
}

.world-overview-panel h3 {
  margin: -8px 0 0;
  color: #29232f;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.08;
  letter-spacing: -.045em;
}

.world-overview-inspiration {
  padding: 16px 0;
  border-top: 1px solid #e3dfe6;
  border-bottom: 1px solid #e3dfe6;
}

.world-overview-inspiration > span {
  color: #655e6c;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
}

.world-overview-inspiration p {
  margin: 9px 0 0;
  color: #403947;
  font-size: 14px;
  line-height: 1.75;
}

.world-overview-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  background: #ded9e3;
  border: 1px solid #ded9e3;
  border-radius: 6px;
}

.world-overview-stats article {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 14px 12px;
  background: #fff;
}

.world-overview-stats span {
  color: #6b6471;
  font-size: 10px;
  line-height: 1.35;
}

.world-overview-stats strong {
  color: #29232f;
  font-size: 22px;
  line-height: 1;
}

.world-overview-branch-map {
  display: grid;
  gap: 14px;
}

.world-overview-branch-map-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.world-overview-branch-map-heading > div {
  display: grid;
  gap: 3px;
}

.world-overview-branch-map-heading span {
  color: #746d7a;
  font-size: 10px;
}

.world-overview-branch-map-heading > div > span {
  color: #7559c9;
  font-weight: 700;
  letter-spacing: .06em;
}

.world-overview-branch-map-heading h4 {
  margin: 0;
  color: #302a36;
  font-size: 15px;
}

.world-overview-branch-map-canvas {
  position: relative;
  padding: 4px 0 2px;
}

.world-overview-branch-map-canvas::before {
  content: "";
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 9px;
  width: 1px;
  background: #cfc5e6;
}

.branch-map-mainline,
.branch-map-direction {
  position: relative;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
}

.branch-map-mainline {
  min-height: 54px;
}

.branch-map-node {
  position: relative;
  z-index: 1;
  width: 9px;
  height: 9px;
  margin: 8px 0 0 5px;
  background: #fff;
  border: 2px solid #8f78d6;
  border-radius: 50%;
  box-shadow: 0 0 0 3px #fbfafc;
}

.branch-map-mainline.is-current .branch-map-node,
.branch-map-direction.is-current .branch-map-node {
  background: #5b32d6;
  border-color: #5b32d6;
}

.branch-map-mainline > div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px 10px;
  padding: 3px 0 12px 8px;
}

.branch-map-mainline span,
.branch-map-mainline small,
.branch-map-direction small {
  color: #746d7a;
  font-size: 10px;
}

.branch-map-mainline strong {
  grid-row: 2;
  color: #302a36;
  font-size: 14px;
}

.branch-map-mainline small {
  grid-column: 2;
  grid-row: 2;
  align-self: center;
}

.branch-map-directions {
  display: grid;
  gap: 9px;
}

.branch-map-direction {
  grid-template-columns: 42px minmax(0, 1fr);
}

.branch-map-direction .branch-map-connector {
  position: absolute;
  top: 13px;
  left: 9px;
  width: 23px;
  height: 13px;
  border-top: 1px solid #cfc5e6;
  border-right: 1px solid #cfc5e6;
  border-radius: 0 6px 0 0;
}

.branch-map-direction .branch-map-node {
  grid-column: 1;
  justify-self: end;
  width: 8px;
  height: 8px;
  margin: 9px 5px 0 0;
  border-width: 1.5px;
}

.branch-map-direction-card {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  background: #fff;
  border: 1px solid #ddd7e3;
  border-radius: 6px;
}

.branch-map-direction-card > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.branch-map-direction-card span,
.branch-map-direction-card em {
  color: #7559c9;
  font-size: 10px;
  font-style: normal;
}

.branch-map-direction-card strong {
  overflow: hidden;
  color: #302a36;
  font-size: 12.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.branch-map-direction.is-current .branch-map-direction-card {
  background: #f3effd;
  border-color: #cdbff2;
}

.branch-map-direction.is-archived {
  opacity: .62;
}

.branch-map-direction.is-empty .branch-map-direction-card {
  background: #faf9fb;
  border-style: dashed;
}

.branch-map-direction.is-empty .branch-map-node {
  background: #fbfafc;
  border-color: #bcb4c3;
}

.world-overview-actions {
  display: grid;
  gap: 8px;
}

.world-overview-primary,
.world-overview-secondary,
.world-overview-switch {
  min-height: 42px;
  padding: 0 13px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 650;
  cursor: pointer;
}

.world-overview-primary {
  color: #fff;
  background: #5b32d6;
  border: 1px solid #5b32d6;
}
.world-overview-primary:hover { background: #4923c7; }

.world-overview-secondary {
  color: #3d3644;
  background: #fff;
  border: 1px solid #d9d4dd;
}
.world-overview-secondary:hover { color: #5b32d6; border-color: #bfb2eb; }

.world-overview-branch {
  color: #4f2bc0;
  background: #f3effd;
  border-color: #cdbff2;
}

.world-overview-branch:hover,
.world-overview-branch:focus-visible {
  color: #3f1fa8;
  background: #ece6fb;
  border-color: #aa98e4;
}

.world-overview-switch {
  color: #5b32d6;
  background: transparent;
  border: 0;
}
.world-overview-switch:hover { background: #efebfa; }

@media (max-width: 430px) {
  .world-overview-stats { grid-template-columns: 1fr; }
}

/* M1 identity gate -------------------------------------------------------- */
.auth-gate {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  overflow: auto;
  color: #302a36;
  background: rgba(247, 245, 249, .96);
  backdrop-filter: blur(12px);
}

.auth-gate[hidden] { display: none; }

.auth-card {
  width: min(100%, 420px);
  padding: 34px;
  background: #fff;
  border: 1px solid #ddd7e2;
  border-radius: 14px;
  box-shadow: 0 22px 60px rgba(75, 57, 92, .12);
}

.auth-brand {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  margin-bottom: 24px;
  color: #fff;
  background: #5b32d6;
  border-radius: 8px;
  font-weight: 750;
}

.auth-kicker {
  margin: 0 0 7px;
  color: #6a46ef;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
}

.auth-card h1 {
  margin: 0;
  color: #29232f;
  font-size: 25px;
  line-height: 1.2;
  letter-spacing: -.025em;
}

.auth-description,
.auth-local-note {
  color: #655e6c;
  line-height: 1.7;
}

.auth-description { margin: 13px 0 24px; }
.auth-local-note { margin: 18px 0 0; font-size: 11.5px; }

.auth-card form,
.auth-field { display: grid; gap: 8px; }
.auth-card form { gap: 16px; }
.auth-field span { color: #514a57; font-size: 12px; font-weight: 650; }

.auth-field input {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  color: #302a36;
  background: #fbfafc;
  border: 1px solid #d8d2dc;
  border-radius: 7px;
}

.auth-field input:hover { border-color: #bcb2c5; }
.auth-field input:focus-visible { border-color: #6a46ef; outline-color: #6a46ef; }
.auth-field input[aria-invalid="true"] {
  border-color: var(--danger);
  outline: 2px solid var(--danger-ring);
  outline-offset: 1px;
}

.auth-submit {
  min-height: 43px;
  margin-top: 3px;
  color: #fff;
  background: #5b32d6;
  border: 1px solid #5b32d6;
  border-radius: 7px;
  font-weight: 680;
  cursor: pointer;
}

.auth-submit:hover { background: #4923c7; }

.auth-mode-switch {
  min-height: 38px;
  margin-top: -5px;
  color: #5b32d6;
  background: transparent;
  border: 0;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 680;
  cursor: pointer;
}
.auth-mode-switch:hover,
.auth-mode-switch:focus-visible { background: #f2eefb; }

.auth-field[hidden] { display: none !important; }

.auth-error {
  margin: -2px 0 0;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 11px 14px 11px 12px;
  color: var(--danger-text);
  background: var(--danger-soft);
  border: 1px solid var(--danger-border);
  border-left: 3px solid var(--danger);
  border-radius: 7px;
  font-size: 12px;
  line-height: 1.55;
  animation: auth-error-in 150ms cubic-bezier(.22, 1, .36, 1) both;
}
.auth-error::before {
  content: "!";
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  justify-self: center;
  color: var(--danger);
  background: transparent;
  border: 2px solid var(--danger);
  border-radius: 50%;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
}
.auth-error[hidden] { display: none; }

@keyframes auth-error-in {
  from { opacity: 0; transform: translateY(-3px); }
  to { opacity: 1; transform: translateY(0); }
}

.account-button {
  width: 25px;
  height: 25px;
  padding: 0;
  color: #4f3a77;
  background: #eee9f7;
  border: 1px solid #d7cdee;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.account-button:hover { color: #fff; background: #5b32d6; border-color: #5b32d6; }

@media (max-width: 980px) {
  .titlebar { position: relative; }
  .titlebar-status {
    position: absolute;
    z-index: 6;
    top: 0;
    right: 112px;
    height: var(--titlebar-height);
    display: flex;
    padding: 0;
  }
  .titlebar-status .connection-dot,
  .titlebar-status #save-status { display: none; }
  .tab-strip { padding-right: 152px; }
  .account-button { width: 32px; height: 32px; }
}

@media (max-width: 520px) {
  .auth-gate { padding: 14px; }
  .auth-card { padding: 26px 22px; }
  .recovery-code-dialog { padding: 14px; }
  .recovery-code-panel { width: 100%; padding: 24px 20px; }
  .recovery-code-actions { grid-template-columns: 1fr; }
  .recovery-code-actions button:last-child { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .account-dialog-backdrop,
  .account-dialog-panel,
  .recovery-code-backdrop,
  .recovery-code-panel,
  .account-close-backdrop,
  .account-close-panel { transition-duration: 1ms !important; }
  .auth-error { animation: none; }
}

/* MVP-FR-023A / MVP-FR-024: workspace-only side pages and time projection */
.context-tabs {
  display: flex;
  gap: 5px;
  padding: 7px 9px;
  overflow-x: auto;
  background: #f5f2f9;
  border-bottom: 1px solid var(--line);
}

.pane-header-actions { display: flex; align-items: center; gap: 4px; }
.sidebar-new-project-button {
  flex: 0 0 34px;
  width: 34px;
  min-width: 34px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border-radius: 5px;
  line-height: 0;
}
.sidebar-new-project-button svg {
  display: block;
  width: 17px;
  height: 17px;
  margin: 0;
  transform: none;
}
.context-tab { display: inline-flex; flex: 0 0 auto; max-width: 180px; border: 1px solid #d9d1e5; border-radius: 7px; background: #fff; }
.context-tab.is-active { border-color: #7651df; box-shadow: inset 0 -2px 0 #7651df; }
.context-tab button { min-height: 30px; padding: 0 8px; color: #554d5e; background: transparent; border: 0; cursor: pointer; }
.context-tab button:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.context-tab button:last-child { padding-inline: 6px; color: #8b8293; }
.context-object-actions { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px; }
.context-object-actions button { min-height: 38px; border-radius: 7px; cursor: pointer; }
.context-pin { color: #5b32d6; background: #f2edff; border: 1px solid #d8cdf4; }
.context-compare { display: grid; gap: 14px; }
.context-compare > h2 { margin: 0; font-size: 21px; }
.context-compare-grid { display: grid; gap: 10px; }
.context-compare-grid article { display: grid; gap: 8px; padding: 13px; background: #fff; border: 1px solid #ddd7e2; border-radius: 9px; }
.context-compare-grid article > span { color: #7050cf; font-size: 10px; font-weight: 760; }
.context-compare-grid h3, .context-compare-grid p { margin: 0; }
.context-compare-grid p { color: #68606f; font-size: 12px; line-height: 1.6; }
.context-compare-grid dl { display: flex; gap: 14px; margin: 0; font-size: 11px; }
.context-compare-grid dl div { display: flex; gap: 4px; }
.context-compare-grid button, .context-compare-clear { min-height: 36px; color: #5b32d6; background: #f5f1ff; border: 1px solid #d8cdf4; border-radius: 7px; cursor: pointer; }
.context-time-list { display: grid; gap: 8px; }
.context-time-list article { display: grid; gap: 3px; padding: 10px; background: #f8f6fb; border-radius: 7px; }
.context-time-list time { color: #6d46d4; font-size: 10px; font-weight: 750; }
.context-time-list strong { font-size: 12px; }
.context-time-list small { color: #766e7d; font-size: 10px; line-height: 1.5; }
.time-events-list { display: grid; gap: 14px; }
.time-event-card { display: grid; gap: 14px; padding: 20px; background: #fff; border: 1px solid #dfdae3; border-radius: 12px; }
.time-event-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.time-event-card header span:first-child { color: #6b45d2; font-size: 10px; font-weight: 760; }
.time-event-card h3, .time-event-card p { margin: 0; }
.time-event-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.time-event-card dl div { padding: 10px; background: #f7f5f9; border-radius: 7px; }
.time-event-card dt { color: #776f7d; font-size: 10px; }
.time-event-card dd { margin: 4px 0 0; color: #332d39; font-size: 12px; }
.time-event-card button { justify-self: start; min-height: 38px; padding: 0 14px; color: #fff; background: #6037cf; border: 0; border-radius: 7px; cursor: pointer; }

@media (max-width: 700px) {
  .context-pane {
    top: auto;
    left: 0;
    width: 100vw;
    height: min(78vh, 680px);
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -18px 46px rgba(49,40,61,.18);
    transform: translate3d(0, 0, 0);
  }
  body.context-collapsed .context-pane {
    display: flex;
    visibility: hidden;
    transform: translate3d(0, 105%, 0);
  }
  .context-pane .panel-resizer { display: none; }
  .context-compare-grid { grid-template-columns: 1fr; }
  .time-event-card dl { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .context-pane { transition-duration: 1ms !important; transition-delay: 0ms !important; }
}

/* M1 scheme branches ----------------------------------------------------- */
.branch-context-bar {
  margin-top: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  color: #514a57;
  background: #f7f5f8;
  border: 1px solid #e2dee5;
  border-radius: 8px;
}

.branch-context-bar > div { min-width: 0; display: grid; gap: 1px; }
.branch-context-bar span { color: #766f7d; font-size: 10.5px; }
.branch-context-bar strong { overflow: hidden; color: #302a36; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.branch-context-bar.is-branch { background: #f2effb; border-color: #d9d0f2; }
.branch-context-bar.is-branch strong { color: #5731c7; }

.branch-context-bar button {
  min-height: 32px;
  padding: 0 11px;
  color: #5731c7;
  background: #fff;
  border: 1px solid #d4caed;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 650;
  cursor: pointer;
}
.branch-context-bar button:hover { color: #fff; background: #5b32d6; border-color: #5b32d6; }

.project-validation-entry {
  width: calc(100% - 16px);
  min-height: 58px;
  margin: 5px 8px 7px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #342d3b;
  background: #f7f4fd;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
}
.project-validation-entry:hover { background: #eee8fb; color: #5731c7; }
.project-release-entry { margin-top: 0; background: #fbf8f1; }
.project-release-entry:hover { color: #6b4a16; background: #f5ecda; }
.project-search-entry { margin-top: 0; background: #f7f4ff; }
.project-search-entry:hover { color: #4d2ead; background: #eee8fb; }
.project-validation-entry:focus-visible { outline: 2px solid #7559c9; outline-offset: 2px; }
.project-validation-copy { min-width: 0; display: grid; gap: 2px; }
.project-validation-copy strong { font-size: 12.5px; font-weight: 720; }
.project-validation-copy small { color: #746d7b; font-size: 10.5px; line-height: 1.4; }
.project-validation-entry svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; }

.validation-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  padding: 26px 28px;
  color: #312838;
  background: linear-gradient(135deg, #f5f0ff 0%, #fbf9ff 72%);
  border-radius: 18px;
}
.validation-hero > div { max-width: 650px; }
.validation-kicker { color: #6a43cf; font-size: 11px; font-weight: 760; letter-spacing: .08em; }
.validation-hero h2 { margin: 7px 0 8px; font-size: clamp(22px, 3vw, 31px); letter-spacing: -.035em; }
.validation-hero p { margin: 0; color: #665e6d; font-size: 14px; line-height: 1.75; }
.validation-hero button {
  min-width: 132px;
  min-height: 44px;
  padding: 0 18px;
  color: #fff;
  background: #6840d4;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 720;
}
.validation-hero button:hover:not(:disabled) { background: #5530c2; }
.validation-hero button:focus-visible { outline: 3px solid rgba(104, 64, 212, .28); outline-offset: 3px; }
.validation-hero button:disabled { cursor: not-allowed; opacity: .52; }
.validation-mainline-note { display: grid; gap: 4px; padding: 16px 18px; color: #513b78; background: #f4effd; border-radius: 12px; }
.validation-mainline-note strong { font-size: 13px; }
.validation-mainline-note span { color: #74658c; font-size: 12px; line-height: 1.6; }
.validation-loading, .validation-empty-copy { padding: 34px 4px; color: #77707d; font-size: 13px; }
.validation-result, .validation-coverage, .validation-issues { padding: 24px 2px 0; }
.validation-result-heading, .validation-section-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.validation-result-heading > div, .validation-section-title > div { display: grid; gap: 4px; }
.validation-result-heading span, .validation-section-title span { color: #7b7183; font-size: 10.5px; font-weight: 700; letter-spacing: .065em; }
.validation-result-heading h2, .validation-section-title h2 { margin: 0; color: #302936; font-size: 19px; letter-spacing: -.02em; }
.validation-result-heading h2:focus { outline: none; }
.validation-baseline { padding: 6px 9px; border-radius: 999px; font-size: 11px !important; letter-spacing: 0 !important; }
.validation-baseline.is-current { color: #315f4b; background: #e9f7ef; }
.validation-baseline.is-stale { color: #875416; background: #fff1d9; }
.validation-baseline-details { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 16px 0 0; overflow: hidden; background: #e9e4ed; border-radius: 12px; }
.validation-baseline-details div { min-width: 0; padding: 13px 14px; background: #faf9fc; }
.validation-baseline-details dt { color: #7a7280; font-size: 10.5px; }
.validation-baseline-details dd { margin: 4px 0 0; overflow: hidden; color: #3d3543; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.validation-stale-copy { margin: 12px 0 0; color: #86591f; font-size: 12px; line-height: 1.6; }
.validation-section-title { padding-bottom: 12px; border-bottom: 1px solid #e9e4ed; }
.validation-section-title > strong { color: #6640c9; font-size: 13px; }
.validation-coverage-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; padding: 18px 0 4px; }
.validation-coverage-columns h3 { margin: 0 0 10px; color: #4a414f; font-size: 12px; }
.validation-coverage-columns ul, .validation-evidence ul { margin: 0; padding: 0; display: grid; gap: 8px; list-style: none; }
.validation-coverage-columns li { display: flex; align-items: flex-start; gap: 8px; color: #544c59; font-size: 12px; line-height: 1.55; }
.validation-coverage-columns svg { width: 17px; height: 17px; flex: 0 0 auto; fill: none; stroke: #6a43cf; stroke-width: 1.8; }
.validation-coverage-columns .is-untested li { color: #837a88; }
.validation-coverage > p { margin: 12px 0 0; padding: 12px 14px; color: #62596a; background: #f6f3fa; border-radius: 10px; font-size: 11.5px; line-height: 1.65; }
.validation-issue-list { display: grid; gap: 14px; padding-top: 16px; }
.validation-issue { padding: 18px; background: #fbfafd; border-left: 3px solid #8b63e2; border-radius: 0 12px 12px 0; }
.validation-issue[data-severity="blocking"] { border-left-color: var(--danger); }
.validation-issue > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.validation-severity { color: #7043ca; font-size: 11px; font-weight: 760; }
.validation-issue[data-severity="blocking"] .validation-severity { color: var(--danger-text); box-shadow: inset 0 -2px 0 var(--danger); }
.validation-issue code { color: #77707e; font-family: "Inter Variable", Consolas, monospace; font-size: 10.5px; }
.validation-issue h3 { margin: 10px 0 8px; color: #352e3a; font-size: 15px; line-height: 1.55; }
.validation-issue-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; color: #776e7d; font-size: 10.5px; }
.validation-evidence, .validation-repair { margin-top: 16px; }
.validation-evidence h4, .validation-repair h4 { margin: 0 0 7px; color: #5d5364; font-size: 11px; }
.validation-evidence li { display: grid; gap: 3px; color: #706775; font-size: 11px; line-height: 1.55; }
.validation-evidence-link { width: fit-content; padding: 0; color: #6840d4; background: none; border: 0; cursor: pointer; font: inherit; font-weight: 700; text-align: left; }
.validation-evidence-link:hover { text-decoration: underline; }
.validation-evidence-link:focus-visible { outline: 2px solid #7559c9; outline-offset: 2px; }
.validation-repair p { margin: 0; color: #514957; font-size: 12px; line-height: 1.7; }
.validation-issue footer { margin-top: 14px; padding-top: 11px; color: #847b89; border-top: 1px solid #ece8ef; font-size: 10.5px; }

.release-readiness-hero { background: linear-gradient(135deg, #f6f1ff 0%, #fffaf2 100%); }
.release-readiness-result { position: relative; }
.release-readiness-result[data-readiness="blocked"] { border-top: 3px solid var(--danger); }
.release-readiness-result[data-readiness="needs-review"] { border-top: 3px solid #b87a22; }
.release-readiness-result[data-readiness="ready"] { border-top: 3px solid #4f8069; }
.release-readiness-status { padding: 6px 9px; border: 1px solid currentColor; border-radius: 6px; font-size: 11px !important; font-weight: 760 !important; letter-spacing: .02em !important; }
.release-readiness-status.is-blocked { color: var(--danger-text); background: var(--danger-soft); border-color: var(--danger); }
.release-readiness-status.is-needs-review { color: #865815; background: #fff6e8; }
.release-readiness-status.is-ready { color: #35634f; background: #edf8f2; }
.release-readiness-statement { margin: 14px 0 0; color: #5d5562; font-size: 13px; line-height: 1.65; }
.release-readiness-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.release-readiness-actions .button-link { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; color: #4d28b9; background: #fff; border: 1px solid #cfc2ec; border-radius: 9px; font-size: 13px; font-weight: 700; text-decoration: none; }
.release-readiness-actions .button-link:hover { background: #f6f1ff; }
.release-readiness-gates { padding: 26px 2px 0; }
.release-readiness-gate-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-top: 16px; }
.release-readiness-gate-grid > div { min-width: 0; }
.release-readiness-gate-grid > div > h3 { margin: 0 0 10px; color: #514758; font-size: 12px; }
.release-readiness-gate-grid .validation-issue-list { padding-top: 0; }
.release-readiness-gate-grid .validation-issue { padding: 15px; }

.canon-search-hero { padding: 26px 28px; color: #312838; background: linear-gradient(135deg, #f7f3ff 0%, #fbfaff 72%); border-radius: 18px; }
.canon-search-hero > div { max-width: 680px; }
.canon-search-hero h2 { margin: 7px 0 8px; font-size: clamp(22px, 3vw, 31px); letter-spacing: -.035em; }
.canon-search-hero p { margin: 0; color: #665e6d; font-size: 14px; line-height: 1.75; }
.canon-search-form { display: grid; gap: 16px; margin-top: 18px; padding: 20px; background: #fbfafd; border: 1px solid #e7e1ed; border-radius: 14px; }
.canon-search-form label { display: grid; gap: 7px; color: #5d5562; font-size: 12px; font-weight: 700; }
.canon-search-form input, .canon-search-form select { min-width: 0; min-height: 44px; padding: 0 12px; color: #332d38; background: #fff; border: 1px solid #d7d0df; border-radius: 9px; font: inherit; font-weight: 500; }
.canon-search-form input:focus-visible, .canon-search-form select:focus-visible, .canon-search-submit-row button:focus-visible, .canon-search-result-actions button:focus-visible { outline: 3px solid rgba(104, 64, 212, .28); outline-offset: 2px; }
.canon-search-query input { font-size: 15px; }
.canon-search-filter-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.canon-search-submit-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.canon-search-submit-row button { min-height: 44px; padding: 0 18px; color: #fff; background: #6840d4; border: 0; border-radius: 9px; cursor: pointer; font: inherit; font-weight: 720; }
.canon-search-submit-row button:disabled { cursor: not-allowed; opacity: .52; }
.canon-search-submit-row span { color: #756d7b; font-size: 11.5px; line-height: 1.55; }
.canon-search-result-section { padding: 25px 2px 0; }
.canon-search-results { display: grid; gap: 12px; padding-top: 16px; }
.canon-search-result { padding: 17px 18px; background: #fbfafd; border: 1px solid #e5dfeb; border-radius: 12px; }
.canon-search-result-meta, .canon-search-result-footer { display: flex; flex-wrap: wrap; gap: 6px 10px; color: #766d7c; font-size: 10.5px; }
.canon-search-result-meta span { padding: 3px 7px; color: #5d3daf; background: #f0ecfc; border-radius: 999px; }
.canon-search-result h3 { margin: 10px 0 7px; color: #342d39; font-size: 16px; }
.canon-search-result p { margin: 0; color: #5d5663; font-size: 13px; line-height: 1.7; white-space: pre-wrap; }
.canon-search-result-footer { margin-top: 12px; padding-top: 10px; border-top: 1px solid #ebe6ef; }
.canon-search-result-footer code { overflow-wrap: anywhere; color: #665d6f; font-family: "Inter Variable", Consolas, monospace; }
.canon-search-result-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.canon-search-result-actions button { min-height: 40px; padding: 0 12px; color: #5c38bb; background: #fff; border: 1px solid #d9d0ee; border-radius: 8px; cursor: pointer; font: inherit; font-size: 12px; font-weight: 720; }
.canon-search-result-actions .canon-search-open { color: #fff; background: #6840d4; border-color: #6840d4; }
.canon-search-empty { padding: 30px 3px; color: #726b78; font-size: 13px; line-height: 1.7; }
.canon-search-empty strong { display: block; margin-bottom: 6px; color: #4c4353; }
.canon-search-empty p { margin: 0; }
.setting-metadata-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* M1-2I current-state session recovery ------------------------------------ */
.session-recovery-dialog {
  position: fixed;
  inset: 0;
  z-index: 1030;
  display: grid;
  place-items: center;
  padding: 24px;
}
.session-recovery-dialog[hidden] { display: none; }
.session-recovery-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(45, 35, 55, .38); backdrop-filter: blur(2px); }
.session-recovery-panel {
  position: relative;
  z-index: 1;
  width: min(820px, 100%);
  max-height: min(860px, calc(100dvh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  color: #302a36;
  background: #fbfaff;
  border: 1px solid #ddd6e7;
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(52, 36, 71, .24);
  animation: session-recovery-enter 240ms var(--motion-in) both;
}
@keyframes session-recovery-enter { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
.session-recovery-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e4e0e7; }
.session-recovery-panel > header > div { display: grid; gap: 2px; }
.session-recovery-panel > header span { color: #7340cf; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.session-recovery-panel h2 { margin: 0; color: #29232f; font-size: 21px; }
.session-recovery-content { min-width: 0; min-height: 0; display: grid; gap: 16px; overflow: auto; padding: 22px; }
.session-recovery-intro { display: grid; gap: 8px; padding: 18px; background: #fff; border: 1px solid #ddd5e7; border-radius: 10px; }
.session-recovery-intro > span { color: #7340cf; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.session-recovery-intro h3 { margin: 0; color: #2f2835; font-size: 19px; }
.session-recovery-intro p { max-width: 68ch; margin: 0; color: #625a68; font-size: 13px; line-height: 1.7; }
.session-recovery-baseline { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
.session-recovery-baseline div { min-width: 0; padding: 12px 14px; background: #f3effb; border-radius: 8px; }
.session-recovery-baseline dt { color: #766d7b; font-size: 10px; }
.session-recovery-baseline dd { margin: 4px 0 0; overflow-wrap: anywhere; color: #3e3348; font-size: 12px; font-weight: 720; }
.session-recovery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.session-recovery-section { min-width: 0; padding: 16px; background: #fff; border: 1px solid #e4deea; border-radius: 10px; }
.session-recovery-section > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.session-recovery-section h3 { margin: 0; color: #3b3242; font-size: 14px; }
.session-recovery-section header span { color: #766d7b; font-size: 10px; }
.session-recovery-section p { margin: 0; color: #665e6c; font-size: 12px; line-height: 1.65; }
.session-recovery-section ul { display: grid; gap: 7px; margin: 0; padding-left: 17px; color: #5d5563; font-size: 12px; line-height: 1.55; }
.session-recovery-next { display: grid; gap: 7px; padding: 17px 18px; background: #eee9fc; border: 1px solid #d9cff5; border-radius: 10px; }
.session-recovery-next span { color: #6840c7; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.session-recovery-next strong { color: #382c48; font-size: 15px; }
.session-recovery-next p, .session-recovery-boundary { margin: 0; color: #675d70; font-size: 12px; line-height: 1.65; }
.session-recovery-boundary { padding-left: 12px; border-left: 3px solid #b6a3e7; }
.session-recovery-panel > footer { display: flex; justify-content: flex-end; gap: 9px; padding: 14px 20px; background: #fff; border-top: 1px solid #e4e0e7; }
.session-recovery-panel > footer button { min-height: 44px; padding: 0 17px; color: #fff; background: #6435d5; border: 1px solid #6435d5; border-radius: 8px; cursor: pointer; font: inherit; font-size: 12px; font-weight: 750; }
.session-recovery-panel > footer button:hover { background: #7c43dc; border-color: #7c43dc; }
.session-recovery-panel > footer .is-secondary { color: #5e5664; background: #fff; border-color: #d8d2dc; }
.session-recovery-panel > footer .is-secondary:hover { color: #6435d5; background: #f7f4fc; border-color: #c9bced; }
.session-recovery-panel button:focus-visible { outline: 3px solid rgba(100, 53, 213, .28); outline-offset: 2px; }

@media (max-width: 760px) {
  .validation-hero { align-items: stretch; flex-direction: column; gap: 18px; padding: 22px 20px; }
  .validation-hero button { width: 100%; }
  .validation-baseline-details { grid-template-columns: 1fr 1fr; }
  .validation-coverage-columns { grid-template-columns: 1fr; gap: 18px; }
  .validation-result-heading, .validation-section-title { align-items: flex-start; }
  .release-readiness-gate-grid { grid-template-columns: 1fr; }
  .canon-search-hero { padding: 22px 20px; }
  .canon-search-filter-grid, .setting-metadata-fields { grid-template-columns: 1fr; }
  .session-recovery-dialog { padding: 12px; }
  .session-recovery-panel { max-height: calc(100dvh - 24px); }
  .session-recovery-baseline, .session-recovery-grid { grid-template-columns: 1fr; }
  .session-recovery-panel > footer { align-items: stretch; flex-direction: column-reverse; }
  .session-recovery-panel > footer button { width: 100%; }
  .release-readiness-status { align-self: flex-start; }
}

@media (max-width: 430px) {
  .validation-result-heading { flex-direction: column; }
  .validation-baseline-details { grid-template-columns: 1fr; }
  .validation-issue > header { align-items: flex-start; flex-direction: column; gap: 6px; }
  .validation-issue code { max-width: 100%; overflow-wrap: anywhere; }
  .session-recovery-dialog { padding: 8px; }
  .session-recovery-panel { max-height: calc(100dvh - 16px); border-radius: 8px; }
  .session-recovery-panel > header { padding: 14px 15px; }
  .session-recovery-content { padding: 13px; }
  .session-recovery-intro, .session-recovery-section, .session-recovery-next { padding: 14px; }
  .session-recovery-panel > footer { padding: 12px 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .session-recovery-panel { animation: none; }
}

.branch-mode-notice {
  margin: 0 0 18px;
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  color: #50475c;
  background: #f5f2fb;
  border-left: 3px solid #7657d5;
  border-radius: 0 7px 7px 0;
}
.branch-mode-notice[hidden] { display: none; }
.branch-mode-notice strong { color: #45289f; font-size: 12.5px; }
.branch-mode-notice span { font-size: 11.5px; line-height: 1.6; }

.branch-manager {
  position: fixed;
  z-index: 920;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr minmax(360px, 520px);
}
.branch-manager[hidden] { display: none; }
.branch-manager-backdrop { border: 0; background: rgba(46, 39, 52, .16); backdrop-filter: blur(2px); cursor: default; }
.branch-manager-panel {
  min-width: 0;
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  color: #302a36;
  background: #fbfafc;
  border-left: 1px solid #dcd7e0;
  box-shadow: -18px 0 50px rgba(66, 51, 77, .12);
}
.branch-manager-panel > header {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 22px;
  background: #fff;
  border-bottom: 1px solid #e4e0e7;
}
.branch-manager-panel > header > div { display: grid; gap: 2px; }
.branch-manager-panel > header span { color: #7559c9; font-size: 10px; font-weight: 700; letter-spacing: .06em; }
.branch-manager-panel h2 { margin: 0; color: #29232f; font-size: 20px; }
.branch-manager-content { min-height: 0; overflow: auto; padding: 22px; }
.branch-manager-content > section + section { margin-top: 28px; padding-top: 24px; border-top: 1px solid #e4e0e7; }
.branch-section-heading { margin-bottom: 13px; display: grid; gap: 2px; }
.branch-section-heading span { color: #766f7d; font-size: 10px; }
.branch-section-heading h3 { margin: 0; color: #302a36; font-size: 15px; }

.branch-current-card,
.branch-list-item {
  padding: 14px;
  background: #fff;
  border: 1px solid #ded9e2;
  border-radius: 8px;
}
.branch-current-card.is-branch,
.branch-list-item.is-active { background: #f7f4fd; border-color: #d4c9ee; }
.branch-current-card > div,
.branch-list-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.branch-current-card > div { display: grid; justify-content: start; gap: 2px; }
.branch-current-card span,
.branch-list-heading span { color: #766f7d; font-size: 10px; }
.branch-current-card strong,
.branch-list-heading strong { color: #302a36; font-size: 13px; }
.branch-current-card p,
.branch-list-item p { margin: 9px 0 0; color: #605866; font-size: 11.5px; line-height: 1.6; }
.branch-difference { color: #6749bd !important; }
.branch-difference-list {
  margin: 10px 0 0;
  padding: 9px 10px 9px 27px;
  color: #5a5260;
  background: rgba(255, 255, 255, .72);
  border: 1px solid #e2ddea;
  border-radius: 6px;
  font-size: 10.8px;
  line-height: 1.55;
}
.branch-current-card button,
.branch-list-actions button {
  min-height: 34px;
  margin-top: 12px;
  padding: 0 12px;
  color: #fff;
  background: #5b32d6;
  border: 1px solid #5b32d6;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 650;
  cursor: pointer;
}
.branch-current-card button:hover,
.branch-list-actions button:hover { background: #4923c7; }

.branch-create-launch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px;
  background: #f7f4fc;
  border: 1px solid #ddd4f2;
  border-radius: 7px;
}
.branch-create-launch > div { display: grid; gap: 3px; }
.branch-create-launch > div > span { color: #7559c9; font-size: 10px; font-weight: 700; letter-spacing: .05em; }
.branch-create-launch h3 { margin: 0; color: #302a36; font-size: 14px; }
.branch-create-launch p { margin: 2px 0 0; color: #746d7a; font-size: 11px; line-height: 1.5; }
.branch-create-launch button {
  min-width: 124px;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  color: #fff;
  background: #5b32d6;
  border: 1px solid #5b32d6;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.branch-create-launch button:hover { background: #4923c7; }
.branch-create-launch button:focus-visible { outline: 2px solid color-mix(in srgb, var(--violet) 42%, transparent); outline-offset: 2px; }
.branch-create-launch button:disabled { color: #8b8491; background: #ebe8ee; border-color: #d9d4dd; cursor: not-allowed; }
.branch-create-launch svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

.branch-create-dialog {
  position: fixed;
  z-index: 940;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}
.branch-create-dialog[hidden] { display: none; }
.branch-create-dialog-backdrop { position: absolute; inset: 0; padding: 0; background: rgba(46, 39, 52, .28); border: 0; backdrop-filter: blur(2px); }
.branch-create-dialog-panel {
  position: relative;
  width: min(480px, 100%);
  max-height: min(720px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
  color: #302a36;
  background: #fbfafc;
  border: 1px solid #d8d2dc;
  border-radius: 9px;
  box-shadow: 0 24px 70px rgba(46, 36, 56, .22);
}
.branch-create-dialog-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e4e0e7; }
.branch-create-dialog-panel > header > div { display: grid; gap: 2px; }
.branch-create-dialog-panel > header span { color: #7559c9; font-size: 10px; font-weight: 700; letter-spacing: .06em; }
.branch-create-dialog-panel h2 { margin: 0; color: #29232f; font-size: 20px; }
.branch-create-dialog-content { min-height: 0; overflow: auto; padding: 20px; }
.branch-create-dialog-content > p { margin: 0 0 18px; color: #655e6c; font-size: 12px; line-height: 1.65; }
.branch-create-dialog form { display: grid; gap: 14px; }
.branch-create-dialog label { display: grid; gap: 6px; }
.branch-create-dialog label > span { color: #5e5664; font-size: 11px; font-weight: 650; }
.branch-create-dialog input,
.branch-create-dialog select,
.branch-create-dialog textarea {
  width: 100%;
  color: #302a36;
  background: #fff;
  border: 1px solid #d8d2dc;
  border-radius: 6px;
}
.branch-create-dialog input,
.branch-create-dialog select { height: 40px; padding: 0 10px; }
.branch-create-dialog textarea { padding: 9px 10px; resize: vertical; }
.branch-create-dialog label.has-error input,
.branch-create-dialog label.has-error select,
.branch-create-dialog label.has-error textarea {
  border-color: var(--danger);
  box-shadow: none;
}
.branch-create-dialog label.has-error input:focus-visible,
.branch-create-dialog label.has-error select:focus-visible,
.branch-create-dialog label.has-error textarea:focus-visible {
  outline-color: var(--danger-ring);
  outline-offset: 1px;
  border-color: var(--danger);
}
.branch-field-error {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  padding: 1px 1px 0;
  padding-left: 7px;
  color: var(--danger-text);
  border-left: 2px solid var(--danger);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
}
.branch-field-error[hidden] { display: none; }
.branch-field-error svg {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-top: 1px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.branch-create-dialog-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 4px; }
.branch-create-dialog-actions button { min-height: 38px; padding: 0 15px; color: #fff; background: #5b32d6; border: 1px solid #5b32d6; border-radius: 6px; font-size: 12px; font-weight: 700; cursor: pointer; }
.branch-create-dialog-actions button:hover { background: #4923c7; }
.branch-create-dialog-actions .is-secondary { color: #5e5664; background: #fff; border-color: #d8d2dc; }
.branch-create-dialog-actions .is-secondary:hover { color: #4923c7; background: #f7f4fc; border-color: #c9bced; }
.branch-create-empty { padding: 18px; background: #f7f4fc; border: 1px dashed #cfc4e7; border-radius: 7px; }
.branch-create-empty strong { color: #302a36; font-size: 13px; }
.branch-create-empty p { margin: 7px 0 0; color: #766f7d; font-size: 12px; line-height: 1.6; }

.branch-list { display: grid; gap: 10px; }
.branch-list-item.is-archived { background: #f5f3f6; opacity: .78; }
.branch-list-heading > div { display: grid; gap: 2px; }
.branch-list-heading em { color: #7b7481; font-size: 10px; font-style: normal; white-space: nowrap; }
.branch-list-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.branch-list-actions .is-secondary { color: #5b5361; background: #fff; border-color: #d7d1dc; }
.branch-list-actions .is-secondary:hover { color: var(--danger-text); background: var(--danger-soft); border-color: var(--danger); }
.branch-list-actions .is-merge { color: #fff; background: #6738dc; border-color: #6738dc; }
.branch-list-actions .is-merge:hover { background: #8438e6; border-color: #8438e6; }

.merge-dialog {
  position: fixed;
  z-index: 970;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}
.merge-dialog[hidden] { display: none; }
.merge-dialog-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(45, 35, 55, .32); backdrop-filter: blur(2px); }
.merge-dialog-panel {
  position: relative;
  width: min(760px, 100%);
  max-height: min(820px, calc(100vh - 48px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  color: #302a36;
  background: #fbfafc;
  border: 1px solid #d8d2dc;
  border-radius: 9px;
  box-shadow: 0 24px 70px rgba(46, 36, 56, .23);
}
.merge-dialog-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e4e0e7; }
.merge-dialog-panel > header > div { display: grid; gap: 2px; }
.merge-dialog-panel > header span { color: #7840df; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.merge-dialog-panel h2 { margin: 0; color: #29232f; font-size: 20px; }
.merge-dialog-content { min-height: 0; overflow: auto; padding: 22px; }
.merge-dialog-panel > footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; background: #fff; border-top: 1px solid #e4e0e7; }
.merge-dialog-panel > footer > div:last-child { display: flex; gap: 9px; }
.merge-dialog-panel > footer button { min-height: 39px; padding: 0 16px; color: #fff; background: #6738dc; border: 1px solid #6738dc; border-radius: 6px; font-size: 12px; font-weight: 750; cursor: pointer; }
.merge-dialog-panel > footer button:hover:not(:disabled) { background: #8438e6; border-color: #8438e6; }
.merge-dialog-panel > footer button:disabled { color: #aaa3af; background: #ece9ef; border-color: #e1dde5; cursor: not-allowed; }
.merge-dialog-panel > footer .is-secondary { color: #5e5664; background: #fff; border-color: #d8d2dc; }
.merge-dialog-panel > footer .is-secondary:hover { color: #6738dc; background: #f7f4fc; border-color: #c9bced; }
.merge-selection-count { color: #6c6472; font-size: 11px; }
.merge-loading { min-height: 260px; display: grid; place-content: center; gap: 7px; text-align: center; }
.merge-loading strong { color: #322b38; font-size: 15px; }
.merge-loading p { margin: 0; color: #766f7d; font-size: 12px; }
.merge-loading.is-error strong { color: var(--danger-text); text-decoration: underline 2px var(--danger); text-underline-offset: 4px; }
.merge-source { padding-bottom: 17px; }
.merge-source > span { color: #7840df; font-size: 10px; font-weight: 700; }
.merge-source h3 { margin: 4px 0 5px; color: #29232f; font-size: 18px; }
.merge-source p { margin: 0; color: #766f7d; font-size: 11.5px; }
.merge-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; background: #dfd9e5; border-radius: 7px; }
.merge-summary article { display: grid; gap: 3px; padding: 14px; background: #fff; }
.merge-summary strong { color: #6738dc; font-size: 20px; }
.merge-summary span { color: #6d6573; font-size: 10.5px; }
.merge-policy-note { margin-top: 16px; padding: 14px 15px; color: #3b3048; background: #f0eaff; border-radius: 7px; }
.merge-policy-note strong { font-size: 12px; }
.merge-policy-note p { margin: 4px 0 0; color: #685d73; font-size: 11px; line-height: 1.65; }
.merge-change-list { display: grid; gap: 10px; margin-top: 18px; }
.merge-change-card { padding: 15px; background: #fff; border: 1px solid #dfdae3; border-radius: 7px; }
.merge-change-card.is-conflict,
.merge-change-card.is-draft-blocked { border-left: 3px solid var(--danger); }
.merge-change-card.is-already-merged,
.merge-change-card.is-unsupported { opacity: .72; }
.merge-change-heading { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.merge-change-heading input { width: 17px; height: 17px; margin-top: 1px; accent-color: #6738dc; }
.merge-change-heading input:disabled { cursor: not-allowed; }
.merge-change-heading > span { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; flex: 1; gap: 12px; }
.merge-change-heading strong { color: #312a37; font-size: 13px; }
.merge-change-heading small { color: #7840df; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.is-conflict .merge-change-heading small,
.is-draft-blocked .merge-change-heading small { color: var(--danger-text); text-decoration: underline 2px var(--danger); text-underline-offset: 3px; }
.merge-change-reason { margin: 7px 0 0 27px; color: #756d7b; font-size: 11px; line-height: 1.55; }
.merge-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 12px 0 0 27px; overflow: hidden; background: #e2dde6; border-radius: 6px; }
.merge-comparison > div { padding: 11px 12px; background: #faf9fb; }
.merge-comparison span { color: #807786; font-size: 9.5px; font-weight: 700; }
.merge-comparison p { margin: 5px 0 0; color: #4f4755; font-size: 11px; line-height: 1.55; }
.merge-empty { padding: 28px 18px; text-align: center; color: #746c7a; }
.merge-empty strong { color: #342d3a; font-size: 13px; }
.merge-empty p { margin: 7px 0 0; font-size: 11.5px; }

@media (max-width: 760px) {
  .branch-manager { grid-template-columns: 1fr; }
  .branch-manager-backdrop { display: none; }
  .branch-manager-panel { border-left: 0; }
  .branch-context-bar { align-items: stretch; flex-direction: column; }
  .branch-create-launch { align-items: stretch; flex-direction: column; }
  .branch-create-launch button { width: 100%; }
}

@media (max-width: 520px) {
  .branch-create-dialog { padding: 12px; }
  .branch-create-dialog-panel { max-height: calc(100vh - 24px); border-radius: 7px; }
  .branch-create-dialog-actions { align-items: stretch; flex-direction: column-reverse; }
  .branch-create-dialog-actions button { width: 100%; }
  .merge-dialog { padding: 12px; }
  .merge-dialog-panel { max-height: calc(100vh - 24px); border-radius: 7px; }
  .merge-summary { grid-template-columns: 1fr; }
  .merge-comparison { grid-template-columns: 1fr; }
  .merge-dialog-panel > footer { align-items: stretch; flex-direction: column; }
  .merge-dialog-panel > footer > div:last-child { flex-direction: column-reverse; }
  .merge-dialog-panel > footer button { width: 100%; }
}

.impact-dialog {
  position: fixed;
  inset: 0;
  z-index: 1010;
  display: grid;
  place-items: center;
  padding: 24px;
}
.impact-dialog[hidden] { display: none; }
.impact-dialog-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(45, 35, 55, .38); backdrop-filter: blur(2px); }
.impact-dialog-panel {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(900px, 100%);
  max-height: min(880px, calc(100vh - 48px));
  overflow: hidden;
  background: #fbfaff;
  border: 1px solid #d8d0e4;
  border-radius: 9px;
  box-shadow: 0 24px 70px rgba(48, 36, 61, .24);
}
.impact-dialog-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e4e0e7; }
.impact-dialog-panel > header > div { display: grid; gap: 2px; }
.impact-dialog-panel > header span { color: #7340cf; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.impact-dialog-panel h2 { margin: 0; color: #29232f; font-size: 20px; }
.impact-dialog-content { min-width: 0; min-height: 0; overflow: auto; padding: 22px; }
.impact-dialog-panel > footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; background: #fff; border-top: 1px solid #e4e0e7; }
.impact-dialog-panel > footer > div:last-child { display: flex; gap: 9px; }
.impact-dialog-panel > footer button { min-height: 42px; padding: 0 16px; color: #fff; background: #6435d5; border: 1px solid #6435d5; border-radius: 6px; font-size: 12px; font-weight: 750; cursor: pointer; }
.impact-dialog-panel > footer button:hover:not(:disabled) { background: #8138df; border-color: #8138df; }
.impact-dialog-panel > footer button:disabled { color: #aaa3af; background: #ece9ef; border-color: #e1dde5; cursor: not-allowed; }
.impact-dialog-panel > footer .is-secondary { color: #5e5664; background: #fff; border-color: #d8d2dc; }
.impact-dialog-panel > footer .is-secondary:hover { color: #6435d5; background: #f7f4fc; border-color: #c9bced; }
.impact-dialog-status { color: #665d6c; font-size: 12px; line-height: 1.5; }
.impact-baseline,
.impact-level,
.impact-differences,
.impact-dependents,
.impact-boundary { min-width: 0; }
.impact-baseline { display: grid; gap: 14px; padding: 18px; background: #fff; border: 1px solid #ddd5e7; border-radius: 8px; }
.impact-baseline > div:first-child { display: grid; gap: 3px; }
.impact-baseline > div:first-child span,
.impact-section-heading span,
.impact-level span { color: #7644ce; font-size: 10px; font-weight: 750; letter-spacing: .055em; }
.impact-baseline h3,
.impact-section-heading h3 { margin: 0; color: #302936; font-size: 17px; }
.impact-baseline dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; }
.impact-baseline dl div { min-width: 0; padding: 10px 12px; background: #f7f4fb; border-radius: 6px; }
.impact-baseline dt { color: #776e7c; font-size: 10px; }
.impact-baseline dd { min-width: 0; margin: 4px 0 0; color: #302936; font-size: 12px; font-weight: 700; overflow-wrap: anywhere; }
.impact-stale { display: grid; gap: 3px; margin: 0; padding: 12px; color: #7a341f; background: #fff3ec; border: 1px solid #e9bca8; border-radius: 6px; font-size: 12px; line-height: 1.55; }
.impact-level { display: grid; gap: 8px; margin-top: 14px; padding: 16px 18px; background: #f2edfb; border-left: 4px solid #7540d5; border-radius: 4px 8px 8px 4px; }
.impact-level[data-level="structural"] { background: #fff4ee; border-left-color: #bc5a31; }
.impact-level > div { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.impact-level strong { color: #3b2b4e; font-size: 14px; }
.impact-level p { margin: 0; color: #584f60; font-size: 12px; line-height: 1.6; }
.impact-differences,
.impact-dependents { display: grid; gap: 12px; margin-top: 22px; }
.impact-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.impact-section-heading > div { display: grid; gap: 3px; }
.impact-section-heading > strong { min-width: 28px; color: #6840ae; text-align: right; font-size: 13px; }
.impact-differences article,
.impact-dependent-list article { min-width: 0; padding: 15px; background: #fff; border: 1px solid #e1dbe7; border-radius: 7px; }
.impact-differences h4 { margin: 0 0 10px; color: #332c39; font-size: 13px; }
.impact-before-after { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.impact-before-after > div { min-width: 0; padding: 12px; background: #f7f5f9; border-radius: 5px; }
.impact-before-after > div:last-child { background: #f2eefb; }
.impact-before-after span { color: #776e7d; font-size: 10px; font-weight: 700; }
.impact-before-after p { margin: 6px 0 0; color: #423a47; font-size: 12px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.impact-dependent-list { display: grid; gap: 9px; }
.impact-dependent-list article > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.impact-dependent-list article > div strong { color: #342d39; font-size: 13px; }
.impact-dependent-list article p { margin: 7px 0 0; color: #716877; font-size: 11px; }
.impact-empty,
.impact-loading { display: grid; gap: 5px; padding: 18px; color: #514858; background: #fff; border: 1px dashed #d7cfde; border-radius: 7px; }
.impact-empty p,
.impact-loading p { margin: 0; font-size: 12px; line-height: 1.55; }
.impact-loading.is-error { color: var(--danger-text); background: var(--danger-soft); border-color: var(--danger); }
.impact-boundary { display: grid; gap: 5px; margin-top: 20px; padding: 14px 16px; color: #5d5562; background: #f8f6fa; border: 1px solid #e2dce7; border-radius: 7px; }
.impact-boundary strong { color: #3b3340; font-size: 12px; }
.impact-boundary p { margin: 0; font-size: 11px; line-height: 1.55; }

@media (max-width: 700px) {
  .impact-dialog { padding: 14px; }
  .impact-dialog-panel { max-height: calc(100dvh - 28px); }
  .impact-dialog-content { padding: 16px; }
  .impact-baseline dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .impact-before-after { grid-template-columns: minmax(0, 1fr); }
  .impact-level > div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .impact-dialog-panel > footer { align-items: stretch; flex-direction: column; }
  .impact-dialog-panel > footer > div:last-child { flex-direction: column-reverse; }
  .impact-dialog-panel > footer button { width: 100%; min-height: 44px; }
}

@media (max-width: 430px) {
  .impact-dialog { padding: 8px; }
  .impact-dialog-panel { max-height: calc(100dvh - 16px); border-radius: 7px; }
  .impact-dialog-panel > header { padding: 14px 15px; }
  .impact-dialog-content { padding: 13px; }
  .impact-baseline { padding: 14px; }
  .impact-baseline dl { grid-template-columns: minmax(0, 1fr); }
  .impact-dialog-panel > footer { padding: 12px 14px; }
}

/* M1-2C narrow document view switch -------------------------------------- */
@media (max-width: 700px) {
  .document-header {
    min-width: 0;
    padding-right: 8px;
    padding-left: 12px;
  }

  .breadcrumbs {
    min-width: 0;
    flex: 1 1 auto;
  }

  .document-actions {
    min-width: 0;
    flex: 0 0 auto;
    gap: 5px;
  }

  .document-view-switch {
    flex: 0 0 auto;
    gap: 1px;
    padding: 2px;
    border-radius: 8px;
  }

  .document-view-button {
    min-width: 0;
    min-height: 32px;
    padding-inline: 8px;
    border-radius: 6px;
    font-size: 10.5px;
    line-height: 1;
    white-space: nowrap;
  }

  #toggle-context {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
  }
}

@media (max-width: 430px) {
  .document-header { padding-left: 10px; }
  .document-view-button { padding-inline: 7px; }
}
.setting-rule-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 22px 0;
  padding: 18px 20px;
  border-left: 3px solid #8b5cf6;
  background: linear-gradient(90deg, #f5efff 0%, rgba(250, 248, 255, 0.28) 100%);
}
.setting-rule-status > div { display: grid; gap: 5px; }
.setting-rule-status span { color: #7441ce; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.setting-rule-status h2 { margin: 0; color: #31283a; font-size: 18px; }
.setting-rule-status p { max-width: 760px; margin: 0; color: #62596a; font-size: 14px; line-height: 1.65; }
.setting-rule-status .rule-marker-button { flex: 0 0 auto; min-height: 44px; }
@media (max-width: 720px) {
  .setting-rule-status { align-items: stretch; flex-direction: column; gap: 14px; padding: 16px; }
  .setting-rule-status .rule-marker-button { width: 100%; }
}

.world-switcher-list .world-switcher-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  align-content: stretch;
  gap: 0;
  padding: 0;
  cursor: default;
}

/* 2026-08 full-interface information reduction ---------------------------- */
:root {
  --focus-primary: #5b32d6;
  --focus-soft: #f2edff;
  --hierarchy-line: #ded9e3;
  --hierarchy-muted: #716a77;
}

/* One page title, then the task. Supporting explanation stays quiet. */
.world-document-heading {
  margin-bottom: 18px;
  padding-bottom: 16px;
}

.world-document-heading .eyebrow { margin-bottom: 6px; }
.world-document-heading h1 { margin-block: 0 6px; }
.world-document-heading p { margin: 0; color: var(--hierarchy-muted); }

.validation-hero,
.canon-search-hero,
.privacy-task {
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 0 22px;
  color: var(--text);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hierarchy-line);
  border-radius: 0;
  box-shadow: none;
}

.validation-hero > div,
.canon-search-hero > div,
.privacy-task > div { min-width: 0; display: grid; gap: 5px; }

.validation-hero h2,
.canon-search-hero h2,
.privacy-task h2 {
  margin: 0;
  color: #2d2733;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: -.02em;
}

.validation-hero p,
.canon-search-hero p,
.privacy-task p {
  max-width: 64ch;
  margin: 0;
  color: #6c6572;
  font-size: 13px;
  line-height: 1.65;
}

.validation-hero > button,
.release-readiness-hero > button {
  flex: 0 0 auto;
  min-height: 44px;
  padding-inline: 18px;
  box-shadow: none;
}

.validation-result,
.validation-coverage,
.validation-issues,
.release-readiness-result,
.canon-search-result-section,
.privacy-record-section {
  padding: 22px 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hierarchy-line);
  border-radius: 0;
  box-shadow: none;
}

.validation-result:last-child,
.validation-coverage:last-child,
.validation-issues:last-child,
.release-readiness-result:last-child,
.canon-search-result-section:last-child,
.privacy-record-section:last-child { border-bottom: 0; }

.validation-baseline-details,
.document-summary-grid,
.overview-card-grid { gap: 1px; overflow: hidden; background: var(--hierarchy-line); border: 1px solid var(--hierarchy-line); border-radius: 8px; }

.validation-baseline-details > div,
.document-summary-grid > article,
.overview-card-grid > article { background: #fff; border: 0; border-radius: 0; }

.validation-issue-list { gap: 0; }
.validation-issue,
.canon-search-result,
.time-event-card {
  padding: 17px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--hierarchy-line);
  border-radius: 0;
  box-shadow: none;
}
.validation-issue:first-child,
.canon-search-result:first-child,
.time-event-card:first-child { border-top: 0; }

.document-empty-action {
  min-height: 40px;
  margin-top: 16px;
  padding-inline: 15px;
  color: #fff;
  background: var(--focus-primary);
  border: 1px solid var(--focus-primary);
  border-radius: 7px;
  font-weight: 700;
  cursor: pointer;
}

/* The sidebar is navigation, not a wall of feature cards. */
.project-tree-content > .project-direction-entry,
.project-tree-content > .project-validation-entry {
  min-height: 36px;
  margin: 0;
  padding: 7px 9px;
  color: #4d4654;
  background: transparent;
  border: 0;
  border-radius: 6px;
  box-shadow: none;
}

.project-tree-content > .project-direction-entry:hover,
.project-tree-content > .project-direction-entry:focus-visible,
.project-tree-content > .project-validation-entry:hover,
.project-tree-content > .project-validation-entry:focus-visible {
  color: var(--focus-primary);
  background: #f3effb;
}

.project-tree-content > .project-navigation-stage-start { margin-top: 7px; }
.project-validation-copy strong,
.project-direction-copy strong { font-size: 12.5px; font-weight: 650; }
.project-validation-copy small,
.project-direction-copy small { display: none; }
.project-validation-entry svg,
.project-direction-entry svg { width: 16px; height: 16px; color: #77707e; }
.project-release-entry { color: #5c4931 !important; }

/* Conversation history recedes; the latest exchange and composer lead. */
.turn-stream .turn-entry { opacity: .72; transition: opacity 160ms ease; }
.turn-stream .turn-entry:hover,
.turn-stream .turn-entry:focus-within,
.turn-stream .turn-entry:last-child { opacity: 1; }
.turn-stream .turn-entry:last-child .user-entry { border-color: #c9bfdf; }
.turn-stream .turn-entry:last-child .system-output { border-left-color: var(--focus-primary); }
.composer { border-color: #c8c1d0; }

/* Main application menu: current module leads; unavailable modules recede. */
.staggered-menu-list { gap: 8px; }
.staggered-menu-item {
  min-height: 82px;
  padding: 16px 18px;
  color: #4e4854;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
}
.staggered-menu-label { font-size: clamp(24px, 3vw, 38px); line-height: 1.05; }
.staggered-menu-note,
.staggered-menu-item:hover .staggered-menu-note,
.staggered-menu-item:focus-visible .staggered-menu-note { margin-top: 6px; color: #746d7a; font-size: 12px; opacity: 1; transform: none; }
.staggered-menu-item[aria-current="page"] {
  color: var(--focus-primary);
  background: var(--focus-soft);
  border-color: #d9cff5;
}
.staggered-menu-item:disabled {
  min-height: 64px;
  color: #96909a;
  opacity: .68;
}
.staggered-menu-item:disabled .staggered-menu-label { font-size: clamp(18px, 2vw, 26px); }
.staggered-menu-item:disabled .staggered-menu-note { color: #96909a; }
.staggered-menu-item::after { display: none; }

/* Canon editor: editing comes before record metadata. */
.world-document-view[data-document-kind="canon-entry"] .world-document-content { gap: 18px; }
.setting-editor { border-color: #d7d1dc; box-shadow: 0 12px 30px rgba(55,45,67,.06); }
.setting-identity {
  display: block;
  padding: 0;
  background: transparent;
  border: 1px solid var(--hierarchy-line);
  border-radius: 8px;
  box-shadow: none;
}
.setting-identity > summary {
  min-height: 60px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px 14px;
  padding: 13px 16px;
  cursor: pointer;
  list-style: none;
}
.setting-identity > summary::-webkit-details-marker { display: none; }
.setting-identity > summary:focus-visible,
.account-control-card > summary:focus-visible,
.privacy-analytics-section > summary:focus-visible,
.privacy-evidence > summary:focus-visible { outline: 3px solid rgba(91,50,214,.24); outline-offset: 2px; }
.setting-identity > summary::after { content: "展开"; color: var(--focus-primary); font-size: 11px; font-weight: 700; }
.setting-identity[open] > summary::after { content: "收起"; }
.setting-identity > summary > span { grid-column: 1; color: #7559c9; font-size: 10px; font-weight: 720; }
.setting-identity > summary > strong { grid-column: 2; color: #342d39; font-size: 13px; }
.setting-identity > summary > small { grid-column: 3; color: #766f7b; font-size: 10.5px; }
.setting-identity-body { display: grid; gap: 15px; padding: 0 16px 17px; border-top: 1px solid #ebe7ed; }
.setting-identity-body .setting-metadata { padding-top: 16px; }

.setting-rule-status,
.setting-relation-panel,
.setting-history-panel,
.setting-checkpoint-panel {
  margin-block: 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--hierarchy-line);
  border-radius: 0;
  box-shadow: none;
}

/* Relationship map uses its area for the relationship, not empty canvas. */
.relationship-drift-field {
  min-height: clamp(390px, calc(100dvh - 390px), 560px);
  background-color: #fbfafc;
}
.relationship-drift-node {
  min-width: 132px;
  max-width: 220px;
  min-height: 56px;
  padding-inline: 18px;
  font-size: 13px;
  font-weight: 680;
}
.relationship-toolbar { margin-bottom: 4px; }
.relationship-list-fallback { margin-top: 2px; }

/* A comparison is a temporary workspace, so it may become wider than a side note. */
@media (min-width: 901px) {
  body.context-comparing .workspace-frame { grid-template-columns: var(--sidebar-width) minmax(420px, 1fr) minmax(520px, 44vw); }
  body.sidebar-collapsed.context-comparing .workspace-frame { grid-template-columns: 0 minmax(420px, 1fr) minmax(520px, 44vw); }
  .context-pane.is-comparing .context-compare-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
  .context-pane.is-comparing .context-content { padding-inline: 20px; }
}
.context-pane.is-comparing .context-compare-grid article { align-content: start; padding: 16px; }
.context-pane.is-comparing .context-compare-grid button { align-self: end; }
.context-compare-clear { justify-self: end; padding-inline: 14px; color: #5f5866; background: #fff; border-color: #d6d0db; }

/* Branch management: one purple action at a time. */
.branch-create-launch { background: transparent; border-color: #ded9e3; }
.branch-create-launch button {
  color: var(--focus-primary);
  background: #fff;
  border-color: #cfc3ed;
}
.branch-create-launch button:hover { color: #fff; background: var(--focus-primary); }
.branch-create-launch.is-only-action button { color: #fff; background: var(--focus-primary); border-color: var(--focus-primary); }
.branch-list-actions button { color: #fff; background: var(--focus-primary); border-color: var(--focus-primary); }
.branch-list-actions .is-merge {
  color: var(--focus-primary);
  background: #fff;
  border-color: #cfc3ed;
}
.branch-list-actions .is-merge:hover { color: #fff; background: #6738dc; }
.branch-list-actions .is-secondary { color: #625b68; background: transparent; border-color: #d7d1dc; }

/* Account tasks are progressive instead of five simultaneous cards. */
.account-dialog-content { gap: 10px; }
.account-task-index { padding: 0 2px 5px; color: #706976; font-size: 12px; line-height: 1.55; }
.account-control-card {
  display: block;
  padding: 0;
  background: #fff;
  border: 1px solid #ded9e2;
  border-radius: 9px;
}
.account-control-card > summary {
  min-height: 62px;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 14px;
  padding: 13px 16px;
  cursor: pointer;
  list-style: none;
}
.account-control-card > summary::-webkit-details-marker { display: none; }
.account-control-card > summary > span { color: #7559c9; font-size: 10px; font-weight: 740; }
.account-control-card > summary > strong { color: #332d39; font-size: 14px; }
.account-control-card > summary > small { color: #756e7b; font-size: 10.5px; }
.account-control-card > summary::after { content: "+"; grid-column: 4; color: #81798a; font-size: 18px; }
.account-control-card[open] > summary::after { content: "−"; color: var(--focus-primary); }
.account-control-card[open] > summary { background: #faf8ff; }
.account-control-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, 280px);
  align-items: end;
  gap: 22px;
  padding: 17px;
  border-top: 1px solid #e8e3eb;
}
.account-control-body form { display: grid; gap: 9px; }
.account-control-body form label { display: grid; gap: 6px; color: #514a58; font-size: 11px; font-weight: 680; }
.account-preferences-card .account-control-body,
.account-session-card .account-control-body,
.account-danger-card .account-control-body { grid-template-columns: minmax(0, 1fr) minmax(180px, 240px); }
.account-danger-card > summary > span,
.account-danger-card > summary > strong { color: var(--danger-text); }

/* Privacy control keeps the purple language; technical IDs are on demand. */
.privacy-toggle {
  position: relative;
  flex: 0 0 min(270px, 42%);
  min-height: 58px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #d9d3df;
  border-radius: 9px;
  cursor: pointer;
}
.privacy-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.privacy-toggle-track { position: relative; width: 42px; height: 24px; background: #d8d3dc; border-radius: 999px; transition: background-color 160ms ease; }
.privacy-toggle-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: #fff; border-radius: 50%; box-shadow: 0 2px 6px rgba(43,35,51,.18); transition: transform 160ms ease; }
.privacy-toggle input:checked + .privacy-toggle-track { background: var(--focus-primary); }
.privacy-toggle input:checked + .privacy-toggle-track::after { transform: translateX(18px); }
.privacy-toggle input:focus-visible + .privacy-toggle-track { outline: 3px solid rgba(91,50,214,.24); outline-offset: 3px; }
.privacy-toggle > span:last-child { display: grid; gap: 2px; }
.privacy-toggle strong { color: #342d39; font-size: 12px; }
.privacy-toggle small { color: #756e7b; font-size: 10.5px; }
.privacy-section-copy { margin: 8px 0 14px; color: #746c79; font-size: 12px; }
.privacy-record-list { display: grid; gap: 0; }
.privacy-record { padding: 14px 0; border-top: 1px solid #e5e1e8; }
.privacy-record:first-child { border-top: 0; }
.privacy-record h3 { margin: 0; color: #332d39; font-size: 14px; }
.privacy-record > p { margin: 5px 0 0; color: #746d7a; font-size: 11px; }
.privacy-evidence { margin-top: 8px; }
.privacy-evidence summary { width: fit-content; color: #6740d8; font-size: 11px; font-weight: 680; cursor: pointer; }
.privacy-evidence dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin: 10px 0 0; padding: 12px; background: #f7f5f9; border-radius: 7px; }
.privacy-evidence dt { color: #7a727f; font-size: 9.5px; }
.privacy-evidence dd { margin: 3px 0 0; color: #504956; font-size: 10.5px; overflow-wrap: anywhere; }
.privacy-analytics-section > summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px 14px; cursor: pointer; list-style: none; }
.privacy-analytics-section > summary::-webkit-details-marker { display: none; }
.privacy-analytics-section > summary span { color: #7559c9; font-size: 10px; font-weight: 740; }
.privacy-analytics-section > summary strong { color: #332d39; font-size: 14px; }
.privacy-analytics-section > summary small { grid-column: 1 / -1; color: #746c79; font-size: 11px; line-height: 1.55; }
.privacy-analytics-section[open] > summary { margin-bottom: 12px; }

/* Project settings explain the task before the decorative cover. */
.project-settings-identity { grid-template-columns: 116px minmax(0, 1fr); gap: 20px; }
.project-cover-preview { min-height: 142px; padding: 13px; box-shadow: 6px 7px 0 color-mix(in srgb, var(--cover-b) 16%, transparent); }
.project-cover-preview > span { font-size: 21px; }
.project-cover-preview strong { font-size: 16px; }
.project-settings-identity h3 { font-size: 23px; }

/* Impact and time pages use dividers in place of nested card fields. */
.impact-baseline,
.impact-differences article,
.impact-dependent-list article,
.impact-boundary { box-shadow: none; }
.impact-level { background: #f6f2fc; }
.time-events-list { gap: 0; }
.time-event-card dl div { background: #f8f6fa; }

@media (max-width: 700px) {
  :root { --composer-height: 164px; }
  .intent-bar { display: none; }
  .mobile-intent-picker {
    display: block;
  }
  .mobile-intent-trigger {
    width: 100%;
    min-height: 48px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    align-items: center;
    gap: 10px;
    padding: 7px 11px 7px 13px;
    color: #3d3545;
    background: #fbfafc;
    border: 1px solid #d8d2df;
    border-radius: 8px;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  .mobile-intent-trigger:hover { border-color: #c8bfda; background: #f8f6fb; }
  .mobile-intent-trigger:focus-visible {
    outline: 2px solid rgba(91, 50, 214, .34);
    outline-offset: 2px;
  }
  .mobile-intent-trigger-copy { min-width: 0; display: flex; align-items: baseline; gap: 7px; }
  .mobile-intent-trigger-copy strong {
    overflow: hidden;
    color: #3c3544;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-intent-trigger-copy small {
    flex: 0 0 auto;
    color: #776f7d;
    font-size: 10.5px;
    line-height: 1.3;
  }
  .mobile-intent-trigger svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: #746c7a;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform 150ms ease;
  }
  .mobile-intent-picker.is-open .mobile-intent-trigger svg { transform: rotate(180deg); }
  .mobile-intent-listbox {
    position: absolute;
    z-index: 20;
    right: 0;
    bottom: calc(100% + 8px);
    left: 0;
    display: grid;
    gap: 2px;
    padding: 6px;
    color: #3d3545;
    background: #fff;
    border: 1px solid #d8d2df;
    border-radius: 10px;
    box-shadow: 0 16px 38px rgba(49, 40, 61, .18);
    animation: mobile-intent-listbox-in 150ms cubic-bezier(.22, 1, .36, 1) both;
  }
  .mobile-intent-listbox[hidden] { display: none; }
  .mobile-intent-option {
    position: relative;
    min-height: 46px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 8px 11px 8px 14px;
    border-radius: 7px;
    cursor: pointer;
  }
  .mobile-intent-option::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 5px;
    width: 3px;
    height: 18px;
    background: transparent;
    border-radius: 999px;
    transform: translateY(-50%);
  }
  .mobile-intent-option span { font-size: 13px; font-weight: 590; line-height: 1.35; }
  .mobile-intent-option small { color: #78717e; font-size: 10.5px; line-height: 1.3; }
  .mobile-intent-option:hover,
  .mobile-intent-option:focus-visible { background: #f5f2f9; outline: none; }
  .mobile-intent-option[aria-selected="true"] { color: var(--violet); background: #f0ecfb; }
  .mobile-intent-option[aria-selected="true"]::before { background: var(--violet); }
  .mobile-intent-option[aria-selected="true"] small { color: #6c55ae; }
  .mobile-intent-option:focus-visible { box-shadow: inset 0 0 0 2px rgba(91, 50, 214, .26); }
  .project-sidebar-toggle-mobile:hover,
  .project-sidebar-toggle-mobile:focus-visible {
    color: var(--violet);
    background: transparent;
    outline: 2px solid rgba(91, 50, 214, .34);
    outline-offset: -3px;
  }
  .project-sidebar .world-switcher-toggle {
    color: #6e6774;
    background: transparent;
    border-color: transparent;
  }
  .project-sidebar .world-switcher-toggle:hover,
  .project-sidebar .world-switcher-toggle:focus-visible {
    color: var(--violet);
    background: #f1edfa;
    border-color: transparent;
  }
  .document-view-button.is-selected {
    color: var(--violet);
    background: #eeeafd;
    box-shadow: none;
  }
  .world-document-view,
  .relationship-view { padding-top: 24px; }
  .world-document-heading { margin-bottom: 10px; padding-bottom: 13px; }
  .world-document-heading h1 { font-size: 26px; }
  .validation-hero,
  .canon-search-hero,
  .privacy-task { align-items: stretch; flex-direction: column; gap: 15px; padding-block: 14px 18px; }
  .validation-hero h2,
  .canon-search-hero h2,
  .privacy-task h2 { font-size: 18px; }
  .validation-hero p,
  .canon-search-hero p,
  .privacy-task p { font-size: 12.5px; }
  .validation-hero > button,
  .release-readiness-hero > button { width: 100%; }
  .setting-editor-toolbar { margin-bottom: 2px; }
  .setting-identity > summary { grid-template-columns: minmax(0, 1fr) auto; }
  .setting-identity > summary > span { grid-column: 1; }
  .setting-identity > summary > strong { grid-column: 1; }
  .setting-identity > summary > small { grid-column: 1; }
  .setting-identity > summary::after { grid-column: 2; grid-row: 1 / span 3; }
  .relationship-drift-field { min-height: 380px; }
  .relationship-drift-node { min-width: 118px; max-width: 168px; min-height: 52px; padding-inline: 13px; font-size: 12px; }
  .account-control-card > summary { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; }
  .account-control-card > summary > span,
  .account-control-card > summary > strong,
  .account-control-card > summary > small { grid-column: 1; }
  .account-control-card > summary::after { grid-column: 2; grid-row: 1 / span 3; }
  .account-control-body,
  .account-preferences-card .account-control-body,
  .account-session-card .account-control-body,
  .account-danger-card .account-control-body { grid-template-columns: 1fr; align-items: stretch; gap: 15px; }
  .privacy-toggle { flex-basis: auto; width: 100%; }
  .privacy-evidence dl { grid-template-columns: 1fr; }
  .project-settings-identity { grid-template-columns: 82px minmax(0, 1fr); gap: 15px; }
  .project-cover-preview { min-height: 104px; padding: 10px; border-radius: 7px 7px 11px 7px; }
  .project-cover-preview > span { font-size: 17px; }
  .project-cover-preview strong { font-size: 13px; }
  .project-cover-preview small { display: none; }
  .project-settings-identity h3 { font-size: 20px; }
  .time-event-card { padding-block: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .turn-stream .turn-entry,
  .privacy-toggle-track,
  .privacy-toggle-track::after,
  .mobile-intent-trigger svg { transition: none; }
  .mobile-intent-listbox { animation: none; }
}

@keyframes mobile-intent-listbox-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
