/*
 * 首页创作入口（Agent 容器）样式。
 *
 * 遵循 UI 规范：容器 surface-1 + radius-xl、无描边；模式切换用横线 Tabs；
 * 输入面用 surface-2；单个操作区只保留一个主按钮。
 */
.creation-entry {
  padding: var(--space-8) var(--space-6) var(--space-6);
  border-radius: var(--radius-xl);
  background: var(--color-surface-1);
  display: grid;
  gap: var(--space-6);
}

.creation-entry__heading {
  display: grid;
  gap: var(--space-2);
  text-align: center;
}

.creation-entry__heading h2 {
  margin: 0;
  font-size: var(--font-h2-size);
  font-weight: var(--font-weight-semibold);
  line-height: var(--font-h2-line-height);
}

.creation-entry__heading p {
  margin: 0;
  color: var(--color-text-tertiary);
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
}

/* 模式切换：规范 6.10 的横线 Tabs，激活项品牌文字 + 2px 品牌底线。 */
.creation-entry__modes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--color-border-subtle);
}

.creation-entry__modes .ant-radio-button-wrapper,
.creation-entry__modes .ant-radio-button-wrapper:first-child,
.creation-entry__modes .ant-radio-button-wrapper:last-child,
.creation-entry__modes .ant-radio-button-wrapper:first-child:last-child {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--control-size-md);
  margin: 0;
  padding: 0 var(--space-3);
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--color-text-secondary);
  font-size: var(--font-body-sm-size);
  /* 行高与图标盒同高，保证 icon 与文字垂直居中对齐。 */
  line-height: 1;
  transition: color var(--duration-fast) var(--easing-standard);
}

/* antd 会把图标与文字包进 label 层，行内对齐必须作用于这一层。 */
.creation-entry__modes .ant-radio-button-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  line-height: 1;
}

.creation-entry__modes .ant-radio-button-label svg {
  display: block;
  flex: 0 0 auto;
}

/* 隐藏 antd 分段控件的分隔线与默认选中底、选中框。 */
.creation-entry__modes .ant-radio-button-wrapper::before {
  display: none;
}

.creation-entry__modes .ant-radio-button-wrapper:not(:last-child) {
  margin-inline-end: 0;
}

.creation-entry__modes .ant-radio-button-wrapper:hover {
  color: var(--color-text-primary);
  background: transparent;
}

.creation-entry__modes .ant-radio-button-wrapper-checked,
.creation-entry__modes .ant-radio-button-wrapper-checked:hover {
  color: var(--color-text-brand);
  background: transparent;
  border-color: transparent;
}

.creation-entry__modes .ant-radio-button-wrapper-checked::after {
  content: '';
  position: absolute;
  inset-inline: var(--space-3);
  bottom: -1px;
  height: 2px;
  border-radius: var(--radius-full);
  background: var(--color-brand-500);
}

/* 去掉 antd 点击/聚焦时的紫色外框；键盘聚焦仅用文字提亮提示。 */
.creation-entry__modes .ant-radio-button-wrapper:has(:focus-visible) {
  outline: none !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
}

/* 去掉 antd Wave 点击波纹（淡紫色扩散框），只保留选中底线的状态变化。 */
.creation-entry__modes .ant-wave {
  display: none !important;
}

.creation-entry__modes
  .ant-radio-button-wrapper:has(:focus-visible):not(.ant-radio-button-wrapper-checked) {
  color: var(--color-text-primary);
  background: transparent;
}

.creation-entry__input {
  display: grid;
  gap: var(--space-2);
}

/* 多行输入：surface-2 输入面、最小高度 120，聚焦用品牌描边与聚焦环。 */
.creation-entry__input .ant-input {
  min-height: 120px;
  padding: var(--space-4);
  border: var(--border-input);
  border-radius: var(--radius-md);
  background: var(--color-surface-2);
  color: var(--color-text-primary);
  font-size: var(--font-body-size);
  line-height: var(--font-body-line-height);
}

.creation-entry__input .ant-input:hover {
  border-color: var(--color-border-default);
  background: var(--color-surface-2);
}

.creation-entry__input .ant-input:focus,
.creation-entry__input .ant-input-focused {
  border-color: var(--color-brand-500);
  background: var(--color-surface-2);
  box-shadow: 0 0 0 2px var(--color-brand-focus);
}

.creation-entry__input .ant-input::placeholder {
  color: var(--color-text-placeholder);
}

.creation-entry__input .ant-input-data-count {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
}

/* 输入区下方的说明文案；只作用于直接子级，避免影响上传组件内部文案。 */
.creation-entry__input > p {
  margin: 0;
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
}

/* 上传区：与输入面同一层级，虚线描边只用于可编辑区域。 */
.creation-entry__input .ant-upload-drag {
  height: auto;
  padding: var(--space-6);
  border: 1px dashed var(--color-border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface-2);
  transition: border-color var(--duration-fast) var(--easing-standard);
}

.creation-entry__input .ant-upload-drag:hover {
  border-color: var(--color-brand-500);
}

.creation-entry__input .ant-upload-drag p {
  margin: var(--space-2) 0 0;
  color: var(--color-text-primary);
  font-size: var(--font-body-size);
}

.creation-entry__input .ant-upload-drag small {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
}

/* 小说剧本的生成方式：surface-2 能力卡，无描边。 */
.creation-entry__strategy {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-surface-2);
}

.creation-entry__strategy > span {
  color: var(--color-text-secondary);
  font-size: var(--font-body-size);
}

.creation-entry__strategy-label {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.creation-entry__strategy-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--control-size-sm);
  min-height: var(--control-size-sm);
  padding: 0;
  border: none;
  background: transparent;
  color: var(--color-text-tertiary);
  cursor: help;
}

.creation-entry__strategy-help:focus-visible {
  outline: var(--border-focus);
  border-radius: var(--radius-sm);
}

.creation-entry__blank {
  margin: 0;
  color: var(--color-text-tertiary);
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
  text-align: center;
}

/* 操作区：单个主按钮靠右，高度按规范 Medium 40。 */
.creation-entry__actions {
  display: flex;
  justify-content: flex-end;
}

.creation-entry__actions .ant-btn {
  height: var(--control-size-md);
  padding: 0 var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--font-body-size);
}

/* 上传列表与后续内容正常占据文档流，长文件名不挤压删除操作。 */
.creation-entry__input .ant-upload-wrapper {
  min-width: 0;
}

.creation-entry__input .ant-upload-list {
  margin-top: var(--space-2);
}

.creation-entry__input .ant-upload-list-item {
  height: auto;
  min-height: var(--control-size-md);
}

.creation-entry__input .ant-upload-list-item-name {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: var(--font-body-line-height);
}

.creation-entry__input .ant-input-textarea-show-count {
  margin-bottom: var(--space-2);
}

.creation-plan-picker {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  margin-bottom: var(--space-5);
  background: var(--color-surface-2);
  border-radius: var(--radius-lg);
}
.creation-plan-picker h3,
.creation-plan-picker h4,
.creation-plan-picker p {
  margin: 0;
}
.creation-plan-picker__tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
}
.creation-plan-picker__content {
  max-height: var(--layout-sidebar-width);
  overflow: auto;
  display: grid;
  gap: var(--space-2);
  color: var(--color-text-secondary);
}
.creation-plan-picker__actions {
  display: flex;
  justify-content: flex-end;
}

.creation-plan-picker__generating {
  display: grid;
  gap: var(--space-3);
}
.creation-plan-picker__generating > div:first-child {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
@media (prefers-reduced-motion: reduce) {
  .creation-plan-picker__generating .ant-skeleton-paragraph > li {
    animation: none;
  }
}

/* 通用封面字段：点击封面即重新选择本地图片，悬停展示删除入口，不提供放大预览 */

.project-cover-field {
  position: relative;
  display: inline-flex;
  align-items: center;
}

/* 封面按 UI 规范固定 16:9，缩略图与上传占位区共用同一触发区域 */
.project-cover-field .ant-upload.ant-upload-select {
  width: 168px;
  height: 94px;
  margin: 0;
  border: 1px dashed var(--color-border-default);
  border-radius: var(--radius-md);
  color: var(--color-text-tertiary);
  background: var(--color-surface-2);
  overflow: hidden;
  transition:
    border-color var(--duration-fast) var(--easing-standard),
    color var(--duration-fast) var(--easing-standard);
}

.project-cover-field .ant-upload.ant-upload-select:hover {
  border-color: var(--color-brand-500);
  color: var(--color-text-brand);
}

.project-cover-field__preview {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.project-cover-field__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 悬停与键盘聚焦时提示「点击更换」，说明封面本身就是重新选择的入口 */
.project-cover-field__mask {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--color-text-primary);
  background: var(--color-overlay);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
  opacity: 0;
  transition: opacity var(--duration-fast) var(--easing-standard);
}

.project-cover-field:hover .project-cover-field__mask,
.project-cover-field:focus-within .project-cover-field__mask {
  opacity: 1;
}

.project-cover-field__remove {
  position: absolute;
  top: var(--space-1);
  right: var(--space-1);
  z-index: 1;
  color: var(--color-text-primary);
  background: var(--color-overlay);
  border-radius: var(--radius-full);
}

.project-cover-field__remove:hover,
.project-cover-field__remove:focus-visible {
  color: var(--color-error);
  background: var(--color-error-soft);
}

.project-cover-field__trigger {
  display: grid;
  justify-items: center;
  gap: var(--space-1);
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
}

.project-cover-field__trigger svg {
  width: var(--icon-size-md);
  height: var(--icon-size-md);
}

/* 创建项目弹窗样式，全部消费全局设计令牌，视觉基线与登录弹窗保持一致。 */

.create-project-dialog-root .ant-modal-mask {
  background: var(--color-overlay);
}

/* 弹窗采用「固定头部 + 中部滚动 + 固定底部操作区」结构：
   整体高度上限为视口上下各留 64px，只有中部内容滚动，底部按钮始终可见。 */
.create-project-dialog .ant-modal-content {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 2 * var(--space-16));
  padding: 0;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-xl);
  color: var(--color-text-primary);
  background: var(--color-surface-1);
  box-shadow: var(--shadow-modal);
}

.create-project-dialog .ant-modal-header {
  flex: 0 0 auto;
  margin: 0;
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border-subtle);
  background: transparent;
}

.create-project-dialog .ant-modal-title {
  color: var(--color-text-primary);
  font-size: var(--font-h3-size);
  font-weight: var(--font-weight-semibold);
  line-height: var(--font-h3-line-height);
  text-align: center;
}

.create-project-dialog .ant-modal-close {
  top: 15px;
  color: var(--color-text-tertiary);
}

.create-project-dialog .ant-modal-close:hover,
.create-project-dialog .ant-modal-close:focus-visible {
  color: var(--color-text-primary);
  background: var(--color-surface-hover);
}

/* 弹窗体承载表单：自身不滚动，把高度让给中部滚动区。 */
.create-project-dialog .ant-modal-body {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  padding: 0;
}

/* 表单自身撑满弹窗体：中部字段区滚动，底部操作区固定不滚动。 */
.create-project-form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: 100%;
  min-height: 0;
}

.create-project-form__scroll {
  flex: 1 1 auto;
  min-height: 0;
  padding: var(--space-5) var(--space-8) var(--space-6);
  overflow-y: auto;
  /* 隐藏滚动条但保留滚动能力：内容过长时仍可滚动，界面不出现滚动轨道。 */
  scrollbar-width: none;
}

.create-project-form__scroll::-webkit-scrollbar {
  display: none;
}

/* 表单区域：输入与选择控件统一深色工作台外观 */

.create-project-form .ant-form-item {
  margin-bottom: var(--space-4);
}

.create-project-form .ant-form-item .ant-form-item-label > label {
  color: var(--color-text-secondary);
  font-size: var(--font-body-sm-size);
  height: auto;
  margin-bottom: var(--space-1);
}

.create-project-form .ant-input,
.create-project-form .ant-input-affix-wrapper,
.create-project-form .ant-input-textarea {
  border-color: var(--color-border-default);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  background: var(--color-surface-2);
}

.create-project-form .ant-input::placeholder,
.create-project-form .ant-input-textarea textarea::placeholder {
  color: var(--color-text-placeholder);
}

.create-project-form .ant-input:hover,
.create-project-form .ant-input-affix-wrapper:hover,
.create-project-form .ant-input-textarea textarea:hover {
  border-color: var(--color-border-default);
  background: var(--color-surface-hover);
}

.create-project-form .ant-input:focus,
.create-project-form .ant-input-focused,
.create-project-form .ant-input-affix-wrapper:focus,
.create-project-form .ant-input-affix-wrapper-focused,
.create-project-form .ant-input-textarea textarea:focus {
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--color-brand-focus);
}

.create-project-form .ant-input-show-count-suffix {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
}

.create-project-form .ant-form-item-explain-error {
  color: var(--color-error);
  font-size: var(--font-caption-size);
}

/* 类型与标签多选组：换行排布并保持可点击区域舒适 */

.create-project-form__choice-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
}

.create-project-form__choice-group .ant-checkbox-wrapper {
  color: var(--color-text-secondary);
  font-size: var(--font-body-size);
  line-height: var(--font-body-line-height);
}

.create-project-form__choice-group .ant-checkbox-wrapper:hover .ant-checkbox-inner {
  border-color: var(--color-brand-500);
}

.create-project-form__choice-group .ant-checkbox-checked .ant-checkbox-inner {
  border-color: var(--color-brand-500);
  background: var(--color-brand-500);
}

.create-project-form .ant-upload-list-item {
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  background: var(--color-surface-2);
}

/* 底部操作区：固定在弹窗底部，不随中部内容滚动。 */

.create-project-form__actions {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-8);
  border-top: 1px solid var(--color-border-subtle);
}

.create-project-form__cancel {
  border-color: var(--color-border-default);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  background: transparent;
}

.create-project-form__cancel:hover,
.create-project-form__cancel:focus-visible {
  border-color: var(--color-border-default);
  color: var(--color-text-primary);
  background: var(--color-surface-hover);
}

.create-project-form__submit {
  border: none;
  border-radius: var(--radius-md);
  color: var(--color-text-inverse);
  background: var(--color-brand-500);
  font-weight: var(--font-weight-medium);
}

.create-project-form__submit:hover,
.create-project-form__submit:focus-visible {
  color: var(--color-text-inverse);
  background: var(--color-brand-600);
}

/* 字段标签行：字段名与必填星号紧贴，附加说明由行间距分隔并排展示 */

.create-project-form__label-row {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.create-project-form__label-name {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

/* 必填星号：图形由 ::before 内容绘制，不进标签文本；必填语义由控件的 aria-required 承载。 */
.create-project-form__label-required {
  color: var(--color-error);
  font-weight: var(--font-weight-regular);
}

.create-project-form__label-required::before {
  content: '*';
}

.create-project-form__label-hint {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  font-weight: var(--font-weight-regular);
  line-height: var(--font-caption-line-height);
}

/* 数字输入（游戏变量初始值）：与文本输入保持同一深色外观 */

.create-project-form .ant-input-number {
  border-color: var(--color-border-default);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  background: var(--color-surface-2);
}

.create-project-form .ant-input-number:hover {
  border-color: var(--color-border-default);
  background: var(--color-surface-hover);
}

.create-project-form .ant-input-number-focused,
.create-project-form .ant-input-number:focus-within {
  border-color: var(--color-brand-500);
  box-shadow: 0 0 0 2px var(--color-brand-focus);
}

.create-project-form .ant-input-number .ant-input-number-input {
  color: var(--color-text-primary);
  background: transparent;
}

/* 画面风格：分类标签页 + 风格卡片网格 */

.art-style-picker {
  display: grid;
  gap: var(--space-3);
}

/* 分类页签：横线页签，激活项使用品牌底线指示，与项目详情页签保持同一视觉 */

.art-style-picker__tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  border-bottom: 1px solid var(--color-border-subtle);
}

.art-style-picker__tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-3) var(--space-4);
  border: none;
  color: var(--color-text-secondary);
  background: transparent;
  font-size: var(--font-body-size);
  line-height: var(--font-body-line-height);
  cursor: pointer;
  transition:
    color var(--duration-fast) var(--easing-standard),
    background-color var(--duration-fast) var(--easing-standard);
}

.art-style-picker__tab:hover,
.art-style-picker__tab:focus-visible {
  color: var(--color-text-primary);
  background: var(--color-surface-hover);
}

/* 选中态：品牌文字加粗 + 底部品牌指示线 */
.art-style-picker__tab--active {
  color: var(--color-text-primary);
  font-weight: var(--font-weight-medium);
}

.art-style-picker__tab--active::after {
  content: '';
  position: absolute;
  right: var(--space-2);
  bottom: 0;
  left: var(--space-2);
  height: var(--layout-project-progress-height);
  border-radius: var(--radius-full);
  background: var(--color-brand-500);
}

.art-style-picker__tab-label {
  white-space: nowrap;
}

.art-style-picker__tab-count {
  color: var(--color-text-tertiary);
  font-family: var(--font-family-number);
  font-size: var(--font-caption-size);
  font-weight: var(--font-weight-regular);
  line-height: var(--font-caption-line-height);
}

/* 卡片网格使用 auto-fill：列数由容器宽度决定，各分类标签页卡片尺寸保持一致。 */
.art-style-picker__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
  gap: var(--space-3);
}

.art-style-card {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-2);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  background: var(--color-surface-2);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--duration-fast) var(--easing-standard);
}

.art-style-card:hover {
  border-color: var(--color-brand-500);
}

.art-style-card--selected {
  border-color: var(--color-brand-500);
  color: var(--color-text-primary);
}

/* 风格缩略图：16:9 模板图铺满卡片，选中后在右上角展示勾选标记 */

.art-style-card__preview {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radius-sm);
  background: var(--color-surface-hover);
}

.art-style-card__preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.art-style-card__check {
  position: absolute;
  top: var(--space-1);
  right: var(--space-1);
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  padding: 2px;
  border-radius: var(--radius-full);
  color: var(--color-text-inverse);
  background: var(--color-brand-500);
}

.art-style-card__label {
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
}

/* 单选卡片组（预计篇幅、画面比例） */

.project-option-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--space-2);
}

.project-option-card {
  display: grid;
  gap: var(--space-1);
  align-content: start;
  padding: var(--space-3);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  background: var(--color-surface-2);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--duration-fast) var(--easing-standard);
}

.project-option-card:hover {
  border-color: var(--color-brand-500);
}

.project-option-card--selected {
  border-color: var(--color-brand-500);
  color: var(--color-text-primary);
}

.project-option-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--icon-size-md);
  color: var(--color-text-tertiary);
}

.project-option-card__icon {
  display: inline-flex;
}

.project-option-card__check {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  color: var(--color-brand-500);
}

.project-option-card__label {
  font-size: var(--font-body-size);
  line-height: var(--font-body-line-height);
}

.project-option-card__description {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
}

/* 单选列表（互动程度） */

.project-option-list {
  display: grid;
  gap: var(--space-2);
}

.project-option-list__item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  background: var(--color-surface-2);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--duration-fast) var(--easing-standard);
}

.project-option-list__item:hover {
  border-color: var(--color-brand-500);
}

.project-option-list__item--selected {
  border-color: var(--color-brand-500);
  color: var(--color-text-primary);
  background: var(--color-surface-active);
}

.project-option-list__marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-full);
  color: var(--color-brand-500);
}

.project-option-list__item--selected .project-option-list__marker {
  border-color: transparent;
}

.project-option-list__marker svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
}

.project-option-list__text {
  display: grid;
  gap: var(--space-1);
}

.project-option-list__label {
  font-size: var(--font-body-size);
  line-height: var(--font-body-line-height);
}

.project-option-list__description {
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
}

/* 自定义选择控件统一键盘焦点样式 */

.art-style-picker__tab:focus-visible,
.art-style-card:focus-visible,
.project-option-card:focus-visible,
.project-option-list__item:focus-visible {
  outline: 2px solid var(--color-brand-500);
  outline-offset: 2px;
}

/* 登录与设置密码弹窗样式，全部消费全局设计令牌（UI 规范 6.11 / 6.18）。 */

.auth-dialog-root .ant-modal-mask {
  background: var(--color-overlay) !important;
}

.auth-dialog .ant-modal-content {
  padding: 0;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-xl);
  color: var(--color-text-primary);
  background: var(--color-surface-1) !important;
  box-shadow: var(--shadow-modal);
}

.auth-dialog .ant-modal-header {
  margin: 0;
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border-subtle);
  background: transparent;
}

.auth-dialog .ant-modal-title {
  color: var(--color-text-primary) !important;
  font-size: var(--font-h3-size);
  font-weight: var(--font-weight-semibold);
  line-height: var(--font-h3-line-height);
  text-align: center;
}

/* 登录标题：品牌标 + Inyou，图标与文字基线对齐，间距走全局令牌 */
.auth-dialog__title {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}

.auth-dialog__logo {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}

.auth-dialog .ant-modal-close {
  top: 15px;
  color: var(--color-text-tertiary);
}

.auth-dialog .ant-modal-close:hover,
.auth-dialog .ant-modal-close:focus-visible {
  color: var(--color-text-primary);
  background: var(--color-surface-hover);
}

.auth-dialog .ant-modal-body {
  padding: var(--space-5) var(--space-8) var(--space-6);
}

.auth-dialog .ant-tabs-nav {
  margin-bottom: var(--space-5);
}

.auth-dialog .ant-tabs-tab {
  color: var(--color-text-secondary);
  font-size: var(--font-body-size);
  padding: var(--space-2) var(--space-1);
}

.auth-dialog .ant-tabs-tab + .ant-tabs-tab {
  margin-left: var(--space-5);
}

.auth-dialog .ant-tabs-tab:hover {
  color: var(--color-text-primary);
}

.auth-dialog .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--color-text-brand);
}

.auth-dialog .ant-tabs-ink-bar {
  background: var(--color-brand-500);
}

/*
 * 表单控件换肤说明：antd 5 的运行时样式为 `.css-xxx.ant-input`（0,2,0），
 * 与普通双类选择器打平后按插入顺序后者的 antd 胜出，导致白色默认底色；
 * 因此以下视觉属性统一加 !important 锁定深色令牌，选择器仍限定在
 * .auth-dialog / .auth-form 作用域内，不影响弹窗之外的任何组件。
 */

.auth-form .ant-input,
.auth-form .ant-input-affix-wrapper {
  border-color: var(--color-border-default) !important;
  border-radius: var(--radius-md);
  color: var(--color-text-primary) !important;
  background: var(--color-surface-2) !important;
}

.auth-form .ant-input::placeholder {
  color: var(--color-text-placeholder) !important;
}

.auth-form .ant-input:hover,
.auth-form .ant-input-affix-wrapper:hover {
  background: var(--color-surface-hover) !important;
}

.auth-form .ant-input:focus,
.auth-form .ant-input-focused,
.auth-form .ant-input-affix-wrapper:focus,
.auth-form .ant-input-affix-wrapper:focus-within,
.auth-form .ant-input-affix-wrapper-focused {
  background: var(--color-surface-2) !important;
  border-color: var(--color-brand-500) !important;
  box-shadow: 0 0 0 2px var(--color-brand-focus) !important;
}

/* 密码显隐图标与后缀保持次级文字色。 */
.auth-form .ant-input-password-icon,
.auth-form .ant-input-clear-icon {
  color: var(--color-text-tertiary) !important;
}

.auth-form .ant-input-password-icon:hover,
.auth-form .ant-input-clear-icon:hover {
  color: var(--color-text-secondary) !important;
}

/* 校验错误态沿用 antd 的红色边框语义，仅锁定底色。 */
.auth-form .ant-input-status-error,
.auth-form .ant-input-affix-wrapper-status-error {
  background: var(--color-surface-2) !important;
  color: var(--color-text-primary) !important;
}

.auth-form .ant-form-item .ant-form-item-label > label {
  color: var(--color-text-secondary) !important;
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
  height: auto;
  margin-bottom: var(--space-1);
}

.auth-form .ant-form-item .ant-form-item-label {
  line-height: var(--font-body-sm-line-height);
  padding-bottom: var(--space-2);
}

.auth-form .ant-form-item-explain-error {
  color: var(--color-error) !important;
  font-size: var(--font-caption-size);
}

.auth-form__captcha-row {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}

.auth-form__captcha-field {
  flex: 1;
  min-width: 0;
}

.auth-form .auth-form__captcha-button {
  margin-top: calc(var(--font-body-sm-line-height) + var(--space-1) + var(--space-2));
}

.auth-form .auth-form__captcha-button,
.auth-form .auth-form__captcha-button:not(:disabled):hover,
.auth-form .auth-form__captcha-button:not(:disabled):focus-visible {
  border: 1px solid var(--color-brand-500) !important;
  border-radius: var(--radius-md);
  color: var(--color-text-brand) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.auth-form .auth-form__captcha-button:not(:disabled):hover,
.auth-form .auth-form__captcha-button:not(:disabled):focus-visible {
  border-color: var(--color-brand-300) !important;
  color: var(--color-brand-300) !important;
  background: var(--color-surface-hover) !important;
}

.auth-form .auth-form__captcha-button:disabled {
  border-color: var(--color-border-subtle) !important;
  color: var(--color-text-disabled) !important;
  background: transparent !important;
}

.auth-form .auth-form__submit,
.auth-form .auth-form__submit:not(:disabled):hover,
.auth-form .auth-form__submit:not(:disabled):focus-visible {
  border: none !important;
  border-radius: var(--radius-md);
  color: var(--color-text-inverse) !important;
  background: var(--color-brand-500) !important;
  font-weight: var(--font-weight-medium);
  box-shadow: none !important;
}

.auth-form .auth-form__submit:not(:disabled):hover,
.auth-form .auth-form__submit:not(:disabled):focus-visible {
  background: var(--color-brand-600) !important;
}

.auth-form__error {
  margin: 0 0 var(--space-3);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-error);
  border-radius: var(--radius-sm);
  color: var(--color-error);
  background: var(--color-error-soft);
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
}

.auth-form__account {
  margin: 0 0 var(--space-4);
  color: var(--color-text-secondary);
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
}

.auth-form__account strong {
  color: var(--color-text-primary);
  font-weight: var(--font-weight-medium);
}

/* ===== 表单辅助链接：忘记密码 / 返回登录 ===== */

/* 链接行：主按钮下方右对齐，不与提交按钮抢视觉重心。 */
.auth-form__links {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-3);
}

.auth-form .auth-form__link {
  padding: 0;
  border: none;
  color: var(--color-text-brand);
  background: transparent;
  font-size: var(--font-body-sm-size);
  line-height: var(--font-body-sm-line-height);
  cursor: pointer;
  transition: color var(--duration-fast) var(--easing-standard);
}

.auth-form .auth-form__link:hover {
  color: var(--color-brand-300);
}

.auth-form .auth-form__link:focus-visible {
  outline: 2px solid var(--color-brand-500);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* ===== 用户协议勾选：登录按钮上方一行，勾选框与协议链接并列 ===== */

.auth-agreement {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  margin: 0 0 var(--space-4);
  color: var(--color-text-tertiary);
  font-size: var(--font-caption-size);
  line-height: var(--font-caption-line-height);
}

/* 勾选框与协议文案首行垂直居中。
   antd 的 checkbox-wrapper 默认 align-items: baseline，并额外挂了一个 content: '\a0' 的零宽伪元素
   作基线撑杆（antd 自己的注释：Fix checkbox & radio in flex align #30260）。在 12px 小字场景下，
   那套基线定位会把 16px 方框压低——实测勾选框中心比文字中心低 3px。
   这里只做两件事：给一个与文案首行等高的行盒，并把 align-items 从 baseline 改成 center，
   让 16px 方框在 18px 行盒里居中；不再依赖 antd 的基线定位，字号/行高令牌变了也不会错位。
   高度取行高令牌而非魔数；`!important` 用于压过 antd 运行时注入的 CSS-in-JS（本文件既有约定）。
   容器侧仍是 flex-start：协议文案换行到第二行时，勾选框仍对齐首行而不是整段居中。 */
.auth-agreement__check {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center !important;
  height: var(--font-caption-line-height);
}

.auth-agreement__text {
  min-width: 0;
}

.auth-dialog .auth-agreement__link {
  padding: 0;
  border: none;
  color: var(--color-text-brand);
  background: transparent;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
  transition: color var(--duration-fast) var(--easing-standard);
}

.auth-dialog .auth-agreement__link:hover {
  color: var(--color-brand-300);
  text-decoration: underline;
}

.auth-dialog .auth-agreement__link:focus-visible {
  outline: 2px solid var(--color-brand-500);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/*
 * 勾选框换肤：antd 默认以 colorPrimary 派生，未选中态在深色底上偏暗，
 * 这里统一锁定为「表面色底 + 边框，选中转品牌色实底」，与输入框同族。
 */
.auth-dialog .auth-agreement__check .ant-checkbox-inner {
  border-color: var(--color-border-default) !important;
  background: var(--color-surface-2) !important;
}

.auth-dialog .auth-agreement__check:hover .ant-checkbox-inner {
  border-color: var(--color-brand-500) !important;
}

.auth-dialog .auth-agreement__check .ant-checkbox-checked .ant-checkbox-inner {
  border-color: var(--color-brand-500) !important;
  background: var(--color-brand-500) !important;
}

/* 勾号前景色跟随品牌底的前景色令牌，避免浅色主题下勾号发黑。 */
.auth-dialog .auth-agreement__check .ant-checkbox-checked .ant-checkbox-inner::after {
  border-color: var(--color-text-inverse) !important;
}

/* 未勾选协议时主按钮置灰，与可点击的品牌色态形成明确对比。 */
.auth-form .auth-form__submit:disabled,
.auth-form .auth-form__submit:disabled:hover {
  color: var(--color-text-disabled) !important;
  background: var(--color-surface-2) !important;
}


/**
 * 互动文案可选字体的 @font-face 声明。
 *
 * 字体文件统一放在 `src/assets/fonts/`，由 Webpack 的字体规则（asset/resource）处理：
 * 这里的相对 url() 在构建时会被改写成带内容哈希的产物地址，源码中不出现 CDN 地址或绝对路径。
 *
 * 家族名必须与 `src/entities/project/model/eventFonts.ts` 的 cssFamily 一一对应，
 * 面板下拉选中某一款字体后，运行时就是按家族名命中的。
 * `font-display: swap` 保证字体未就绪时先用兜底字体渲染，不阻塞文案显示。
 */

/* 阿里妈妈数黑体：单一字重，本身即为标题级粗体。 */
@font-face {
  font-family: 'Alimama ShuHeiTi';
  src: url(/assets/fonts/AlimamaShuHeiTi-Bold.07ba6db1.woff2) format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* 阿里妈妈方圆体：可变字重字体，声明字重区间让字重轴真正生效。 */
@font-face {
  font-family: 'Alimama FangYuanTi';
  src: url(/assets/fonts/AlimamaFangYuanTiVF-Thin.655d6860.woff2) format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* 阿里妈妈刀隶体：单一字重。 */
@font-face {
  font-family: 'Alimama DaoLiTi';
  src: url(/assets/fonts/AlimamaDaoLiTi.db1bc60b.woff2) format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* 阿里妈妈东方大楷：单一字重。 */
@font-face {
  font-family: 'Alimama DongFangDaKai';
  src: url(/assets/fonts/AlimamaDongFangDaKai-Regular.81021443.woff2) format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* 字体族令牌：正文、数字与代码场景共用。 */
  --font-family-base:
    -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial,
    sans-serif;
  --font-family-number: 'Inter', 'SF Pro Text', -apple-system, sans-serif;
  --font-family-mono: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;

  /* 字号、行高与字重令牌：覆盖规范中的 display、标题、正文和说明文字。 */
  --font-display-size: 32px;
  --font-display-line-height: 40px;
  --font-h1-size: 24px;
  --font-h1-line-height: 32px;
  --font-h2-size: 20px;
  --font-h2-line-height: 28px;
  --font-h3-size: 16px;
  --font-h3-line-height: 24px;
  --font-body-size: 14px;
  --font-body-line-height: 22px;
  --font-body-sm-size: 13px;
  --font-body-sm-line-height: 20px;
  --font-caption-size: 12px;
  --font-caption-line-height: 18px;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;

  /* 间距令牌：页面和组件只从此序列选取。 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-16: 64px;

  /* 圆角与通用尺寸令牌。 */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-full: 9999px;
  --control-size-sm: 32px;
  --control-size-md: 40px;
  --control-size-lg: 48px;
  --icon-size-sm: 16px;
  --icon-size-md: 20px;
  --icon-size-lg: 24px;

  /* 页面结构令牌：与 1920 × 1080 设计基准保持一致。 */
  --layout-sidebar-width: 272px;
  --layout-sidebar-collapsed-width: 72px;
  --layout-header-height: 64px;
  --layout-hero-height: 236px;
  --layout-quick-height: 80px;
  --layout-project-progress-height: 4px;
  --layout-content-max-width: 1648px;
  /* 封面卡片统一宽度（三处网格的最小列宽）：项目列表、回收站、首页「我的项目」共用同一档。
     391px = (--layout-content-max-width 1648 − 左右内边距 48 − 3×间距 12) ÷ 4，
     即内容区 1600px 时 4 列正好铺满；超宽屏下由 1fr 拉伸填满、不留空列。 */
  --layout-project-card-width: 391px;
  /* 封面卡片统一高度：上述三处与首页「最近游玩」共用同一档。
     不用比例定高，避免比例与固定高度并存时浏览器用高度反推宽度、撑破栅格。 */
  --layout-project-card-height: 280px;
  /* 设置页纵向导航宽度与导航选中指示线宽度，对应规范 6.17。 */
  --layout-settings-nav-width: 240px;
  --layout-nav-indicator-width: 3px;
  --layout-asset-card-min-width: 208px;
  --layout-asset-search-width: 288px;
  --layout-asset-filter-width: 168px;
  --layout-asset-preview-min-height: 320px;
  --layout-asset-preview-workspace-width: 1180px;
  --layout-asset-preview-media-height: 520px;
  --layout-asset-preview-detail-width: 360px;
  --layout-asset-strip-card-width: 156px;
  --layout-asset-strip-thumbnail-height: 72px;
  --layout-asset-placeholder-image-size: 128px;

  /* 品牌色令牌：品牌渐变只允许用于首页创建项目按钮。 */
  --color-brand-100: #eae2ff;
  --color-brand-300: #b69cff;
  --color-brand-500: #8448ff;
  --color-brand-600: #6a37d0;
  --color-brand-700: #4f259d;
  --color-brand-focus: rgba(132, 72, 255, 0.4);
  /* 品牌色柔和底：用于选中态背景（分段项/下拉选项/统计卡）。 */
  --color-brand-soft: rgba(132, 72, 255, 0.16);
  /* 连接桩悬停光晕：与剧情树连接桩保持同一视觉强度。 */
  --color-brand-glow: rgba(132, 72, 255, 0.8);
  --gradient-create-project: linear-gradient(135deg, #945bff 0%, #43328f 100%);

  /* 中性色令牌：内容底色最深，卡片其次，输入与编辑面最浅。 */
  --color-canvas: #0b0c0f;
  --color-sidebar: #101116;
  --color-surface-1: #18191e;
  --color-surface-2: #202127;
  --color-surface-hover: #272831;
  --color-surface-active: #2c2938;
  --color-border-subtle: rgba(255, 255, 255, 0.08);
  --color-border-default: rgba(255, 255, 255, 0.12);
  --color-overlay: rgba(5, 6, 8, 0.72);
  --color-overlay-soft: rgba(5, 6, 8, 0.42);
  --color-overlay-strong: rgba(5, 6, 8, 0.9);
  --color-transparent: transparent;

  /* 语义色令牌：进度、会员与状态语义不得替换为品牌色。 */
  --color-success: #52c783;
  --color-warning: #f0b85a;
  --color-error: #ef6b73;
  /* 危险按钮 hover / active：在 error 基础上加深一档，仅用于填充式危险操作按钮。 */
  --color-error-strong: #e6605d;
  --color-error-soft: rgba(239, 107, 115, 0.08);
  /* AI 润色对比中的改动区域：浅红底与同色描边，语义独立于失败提示的 error-soft。 */
  --color-diff-changed: rgba(239, 107, 115, 0.16);
  --color-diff-changed-border: rgba(239, 107, 115, 0.4);
  --color-membership: #e7b75d;
  --color-progress-low: #e6605d;
  --color-progress-mid-low: #e79a55;
  --color-progress-mid-high: #59bb76;
  --color-progress-high: #5b95e8;
  /* 点赞与收藏的选中态：语义独立于失败（error）与风险（warning），不与其复用令牌。 */
  --color-like: #ef6b73;
  --color-like-strong: #e6605d;
  --color-favorite: #f0b85a;
  --color-favorite-strong: #e79a55;
  /* 影视封面上的互动控件表面：半透明深色胶囊，保证封面上的图标与数字可读。 */
  --color-media-control: rgba(5, 6, 8, 0.42);
  --color-media-control-strong: rgba(5, 6, 8, 0.62);
  --color-selection: #45d4e7;
  /* 画布选中框与控制点：编辑器画布与开始页取景画布共用同一套选中视觉。 */
  --color-canvas-control: #3b82f6;
  /* 画布连线：剧情树与脉络图共用常态描边、选中描边和选中光晕。 */
  --color-canvas-edge: #475569;
  --color-canvas-edge-selected: #3b82f6;
  --color-canvas-edge-selected-glow: rgba(59, 130, 246, 0.6);
  /* 画布连接桩外圈描边：压住桩体与节点边界的贴合处。 */
  --color-canvas-handle-ring: rgba(0, 0, 0, 0.5);
  /* 画布小地图：沿用工作流画布的磨砂面板结构，但配色贴合影游深色紫主题。 */
  --color-canvas-minimap-panel: rgba(24, 25, 30, 0.94);
  --color-canvas-minimap-border: rgba(255, 255, 255, 0.14);
  --color-canvas-minimap-surface: rgba(11, 12, 15, 0.88);
  --color-canvas-minimap-node: rgba(132, 72, 255, 0.55);
  --color-canvas-minimap-node-stroke: rgba(182, 156, 255, 0.78);
  --color-canvas-minimap-slider-rail: rgba(255, 255, 255, 0.16);

  /* 素材分类色令牌：用于提交弹窗与素材卡的分类角标，
     角色/场景/道具三类各自独立，语义上区别于进度与会员色。 */
  --color-category-role: #45d4e7;
  --color-category-scene: #f0b85a;
  --color-category-prop: #52c783;

  /* 文字与图标令牌。 */
  --color-text-primary: #f4f2f7;
  --color-text-secondary: #c4c1cb;
  --color-text-tertiary: #928e9a;
  --color-text-placeholder: #77737e;
  --color-text-disabled: #5d5a63;
  --color-text-inverse: #ffffff;
  --color-text-brand: #b69cff;
  --color-icon-functional: #d8d5d0;

  /* 阴影、边界、动效与层级令牌。 */
  --shadow-none: none;
  --color-shadow-float: rgba(0, 0, 0, 0.28);
  --shadow-float: 0 12px 28px rgba(0, 0, 0, 0.28);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.48);
  --border-divider: 1px solid var(--color-border-subtle);
  --border-input: 1px solid var(--color-border-default);
  --border-focus: 1px solid var(--color-brand-500);
  --border-error: 1px solid var(--color-error);
  --duration-instant: 100ms;
  --duration-fast: 160ms;
  --duration-normal: 240ms;
  --duration-slow: 320ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --z-base: 0;
  --z-sticky: 100;
  --z-header: 200;
  --z-drawer: 300;
  --z-dropdown: 400;
  --z-mask: 490;
  --z-modal: 500;
  --z-message: 600;

  /* 首页媒体叠层只处理可读性，不承担品牌语义。 */
  --gradient-hero-overlay: linear-gradient(
    90deg,
    var(--color-overlay-strong) 0%,
    var(--color-overlay) 35%,
    var(--color-overlay-soft) 58%,
    var(--color-transparent) 78%
  );

  /* 编辑器兼容别名：现有模块统一映射到全局 UI 令牌。 */
  --cg-canvas: var(--color-canvas);
  --cg-header: var(--color-sidebar);
  --cg-surface: var(--color-surface-1);
  --cg-rail: var(--color-sidebar);
  --cg-card: var(--color-surface-2);
  --cg-input: var(--color-surface-2);
  --cg-timeline: var(--color-sidebar);
  --cg-surface-hover: var(--color-surface-hover);
  --cg-border: var(--color-border-subtle);
  --cg-border-strong: var(--color-border-default);
  --cg-text: var(--color-text-primary);
  --cg-muted: var(--color-text-secondary);
  --cg-faint: var(--color-text-tertiary);
  --cg-accent: var(--color-brand-500);
  --cg-accent-strong: var(--color-brand-600);
  --cg-brand-text: var(--color-text-primary);
  --cg-on-accent: var(--color-text-inverse);
  --cg-accent-text: var(--color-text-brand);
  --cg-accent-soft: var(--color-surface-active);
  --cg-accent-control-text: var(--color-text-brand);
  --cg-accent-control-soft: var(--color-surface-active);
  --cg-media-icon: var(--color-icon-functional);
  --cg-media-thumbnail: var(--color-surface-2);
  --cg-media-duration: var(--color-text-secondary);
  --cg-preview-text: var(--color-text-tertiary);
  --cg-preview-surface: var(--color-surface-2);
  --cg-preview-shadow: var(--color-shadow-float);
  --cg-preview-badge-border: var(--color-border-default);
  --cg-preview-badge-text: var(--color-text-secondary);
  --cg-preview-badge-surface: var(--color-overlay);
  --cg-panel-shadow: var(--color-shadow-float);
  --cg-control-surface: var(--color-surface-2);
  --cg-control-selected: var(--color-surface-active);
  --cg-success: var(--color-success);
  --cg-success-soft: var(--color-surface-active);
  --cg-error: var(--color-error);
  --cg-track-lane: var(--color-surface-2);
  --cg-track-text: var(--color-text-secondary);
  --cg-track-selected: var(--color-text-primary);
  --cg-track-event: var(--color-brand-500);
  --cg-track-video: var(--color-progress-high);
  --cg-track-audio: var(--color-progress-mid-low);
  --cg-track-choice-surface: var(--color-surface-active);
  --cg-track-choice-text: var(--color-text-primary);
  --cg-track-choice-option-text: var(--color-text-secondary);
  --cg-track-choice-marker: var(--color-error);
  --cg-track-qte-marker: var(--color-progress-high);
  --cg-track-choice-marker-text: var(--color-text-inverse);
  --cg-modal-header: var(--color-surface-1);
  --cg-modal-surface: var(--color-surface-2);
  --cg-modal-mask: var(--color-overlay);
  --cg-modal-input-border: var(--color-border-default);
  --cg-modal-placeholder: var(--color-text-placeholder);
  --cg-danger-strong: var(--color-error);
  --cg-danger-hover: var(--color-progress-low);

  /* 编剧视图令牌：默认沿用工作台中性深色，只服务编剧视图一处；
     护眼模式通过 .writer-page[data-theme='eye-care'] 覆盖同一批令牌，模块 CSS 只消费不定义。 */
  --writer-canvas: var(--color-canvas);
  --writer-rail: var(--color-surface-1);
  --writer-surface: var(--color-surface-1);
  --writer-doc: var(--color-surface-2);
  --writer-text: var(--color-text-primary);
  --writer-muted: var(--color-text-secondary);
  --writer-faint: var(--color-text-tertiary);
  --writer-placeholder: var(--color-text-placeholder);
  --writer-border: var(--color-border-subtle);
  --writer-divider: var(--color-border-default);
  --writer-hover: var(--color-surface-hover);
  --writer-active: var(--color-surface-active);
  --writer-accent: var(--color-brand-500);
  --writer-accent-text: var(--color-text-brand);
  --writer-toolbar: var(--color-surface-2);
  /* 护眼模式主色独立定义：antd 主题需要在 TS 侧读取同一值，故不能只存在于作用域覆盖中。
     护眼模式为浅绿底，主色取更深的绿，保证按钮、链接与开关在浅底上仍然清晰。 */
  --writer-eyecare-accent: #2e7d4f;

  color: var(--color-text-primary);
  background: var(--color-canvas);
  font-family: var(--font-family-base);
  font-synthesis: none;
}

/* 编剧视图护眼模式：整块统一浅绿底（产品指定 #C7EDCC），配深色文字；
   侧栏、工具栏、编辑框与画布用同一底色，不区分层级明暗；只替换编剧视图令牌，不影响工作台其余区域。 */
.writer-page[data-theme='eye-care'] {
  --writer-canvas: #d4f7d9;
  --writer-rail: #d4f7d9;
  --writer-surface: #d4f7d9;
  --writer-doc: #d4f7d9;
  --writer-text: #1f2a20;
  --writer-muted: #3f5c42;
  --writer-faint: #5d7a60;
  --writer-placeholder: #76927a;
  --writer-border: rgba(31, 42, 32, 0.16);
  --writer-divider: rgba(31, 42, 32, 0.3);
  --writer-hover: rgba(31, 42, 32, 0.06);
  --writer-active: rgba(31, 42, 32, 0.12);
  --writer-accent: var(--writer-eyecare-accent);
  --writer-accent-text: #14532d;
  --writer-toolbar: #d4f7d9;
}

* {
  box-sizing: border-box;
}

html,
body,
#root {
  min-width: 320px;
  min-height: 100%;
  margin: 0;
}

body {
  min-height: 100vh;
  background: var(--color-canvas);
}

/* 全站禁用界面文字选中：避免拖拽画布、连续点击时把标签和列表文字刷成选区高亮。
   输入框、可编辑区域以及显式标记 data-selectable="true" 的元素仍然放行，保证可复制。 */
html,
body {
  user-select: none;
}

input,
textarea,
[contenteditable='true'],
[contenteditable='plaintext-only'],
[data-selectable='true'] {
  user-select: text;
}

button,
input,
textarea,
select {
  font: inherit;
}

/* 全站数字输入统一隐藏步进箭头：Ant Design 控件与外层/内层原生数字输入一并覆盖，
   避免积分、时长、变量值等场景出现上下调节按钮，保持纯文本输入外观。 */
.ant-input-number .ant-input-number-handler-wrap {
  display: none !important;
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}

input[type='number'] {
  -moz-appearance: textfield;
  appearance: textfield;
}

button:focus-visible,
a:focus-visible,
[role='button']:focus-visible,
[role='separator']:focus-visible {
  outline: 2px solid var(--color-brand-focus);
  outline-offset: 2px;
}

.sr-only {
  width: 1px;
  height: 1px;
  position: absolute;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.route-loading,
.not-found-page,
.app-error {
  min-height: 100vh;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: var(--space-3);
  padding: var(--space-6);
  color: var(--color-text-primary);
  background: var(--color-canvas);
  text-align: center;
}

.not-found-page p,
.app-error p {
  margin: 0;
  color: var(--color-text-tertiary);
}

.not-found-page a,
.app-error button {
  min-height: var(--control-size-md);
  padding: 0 var(--space-4);
  border: var(--border-input);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  background: var(--color-surface-2);
  text-decoration: none;
  cursor: pointer;
}

/* 应用级降级页的按钮组，返回首页与重新加载并排展示。 */
.app-error__actions {
  display: flex;
  gap: var(--space-3);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* 脉络图章节卡片尺寸：与剧情树基础卡片宽度一致，预留统计及快捷入口。 */
:root {
  --storyline-node-width: 270px;
  --storyline-node-height: 160px;
}

/* stylelint-disable */
html,
body {
  width: 100%;
  height: 100%;
}
input::-ms-clear,
input::-ms-reveal {
  display: none;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
@-ms-viewport {
  width: device-width;
}
body {
  margin: 0;
}
[tabindex='-1']:focus {
  outline: none;
}
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  margin-bottom: 0.5em;
  font-weight: 500;
}
p {
  margin-top: 0;
  margin-bottom: 1em;
}
abbr[title],
abbr[data-original-title] {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  border-bottom: 0;
  cursor: help;
}
address {
  margin-bottom: 1em;
  font-style: normal;
  line-height: inherit;
}
input[type='text'],
input[type='password'],
input[type='number'],
textarea {
  -webkit-appearance: none;
}
ol,
ul,
dl {
  margin-top: 0;
  margin-bottom: 1em;
}
ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}
dt {
  font-weight: 500;
}
dd {
  margin-bottom: 0.5em;
  margin-left: 0;
}
blockquote {
  margin: 0 0 1em;
}
dfn {
  font-style: italic;
}
b,
strong {
  font-weight: bolder;
}
small {
  font-size: 80%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
pre,
code,
kbd,
samp {
  font-size: 1em;
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
}
pre {
  margin-top: 0;
  margin-bottom: 1em;
  overflow: auto;
}
figure {
  margin: 0 0 1em;
}
img {
  vertical-align: middle;
  border-style: none;
}
a,
area,
button,
[role='button'],
input:not([type='range']),
label,
select,
summary,
textarea {
  touch-action: manipulation;
}
table {
  border-collapse: collapse;
}
caption {
  padding-top: 0.75em;
  padding-bottom: 0.3em;
  text-align: left;
  caption-side: bottom;
}
input,
button,
select,
optgroup,
textarea {
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
}
button,
input {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html [type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button;
}
button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
  padding: 0;
  border-style: none;
}
input[type='radio'],
input[type='checkbox'] {
  box-sizing: border-box;
  padding: 0;
}
input[type='date'],
input[type='time'],
input[type='datetime-local'],
input[type='month'] {
  -webkit-appearance: listbox;
}
textarea {
  overflow: auto;
  resize: vertical;
}
fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
legend {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-bottom: 0.5em;
  padding: 0;
  color: inherit;
  font-size: 1.5em;
  line-height: inherit;
  white-space: normal;
}
progress {
  vertical-align: baseline;
}
[type='number']::-webkit-inner-spin-button,
[type='number']::-webkit-outer-spin-button {
  height: auto;
}
[type='search'] {
  outline-offset: -2px;
  -webkit-appearance: none;
}
[type='search']::-webkit-search-cancel-button,
[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}
::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}
output {
  display: inline-block;
}
summary {
  display: list-item;
}
template {
  display: none;
}
[hidden] {
  display: none !important;
}
mark {
  padding: 0.2em;
  background-color: #feffe6;
}


/*# sourceMappingURL=main.8b457a9a.css.map*/