/* AIWP near-future commerce console.
   This stylesheet intentionally sits after the legacy layers so the product has
   one visual language without changing its Vue state or production workflows. */

:root {
  color-scheme: dark;
  --neo-bg: #080b10;
  --neo-bg-raised: #0d1118;
  --neo-panel: #111721;
  --neo-panel-2: #161d28;
  --neo-panel-3: #1b2430;
  --neo-line: rgba(156, 196, 218, .18);
  --neo-line-strong: rgba(113, 222, 244, .42);
  --neo-text: #f3f7fa;
  --neo-text-soft: #c0cad3;
  --neo-muted: #7f8c99;
  --neo-cyan: #70e4f7;
  --neo-cyan-strong: #2bc4df;
  --neo-orange: #ff7043;
  --neo-orange-strong: #f05023;
  --neo-lime: #a9e66e;
  --neo-magenta: #ff6ba7;
  --neo-danger: #ff6b6b;
  --neo-shadow: 0 18px 48px rgba(0, 0, 0, .34);
  --neo-shadow-soft: 0 9px 26px rgba(0, 0, 0, .22);
  --bg-0: var(--neo-bg);
  --bg-1: var(--neo-panel);
  --bg-2: var(--neo-panel-2);
  --bg-3: var(--neo-panel-3);
  --border: var(--neo-line);
  --text-0: var(--neo-text);
  --text-1: var(--neo-text-soft);
  --text-2: var(--neo-muted);
  --c1: var(--neo-cyan);
  --c2: var(--neo-cyan-strong);
  --c3: var(--neo-orange);
  --c4: var(--neo-lime);
  --c5: var(--neo-orange-strong);
  --coral: var(--neo-orange);
  --studio-accent: var(--neo-orange);
}

html,
body.theme-neofuture {
  background: var(--neo-bg) !important;
  color: var(--neo-text);
  font-family: "HarmonyOS Sans SC", "MiSans", "PingFang SC", "Noto Sans CJK SC",
    "Microsoft YaHei", system-ui, sans-serif !important;
  font-weight: 560;
  letter-spacing: 0 !important;
}

body.theme-neofuture {
  background-image:
    linear-gradient(rgba(112, 228, 247, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .035) 1px, transparent 1px);
  background-size: 40px 40px;
}

body.theme-neofuture ::selection {
  color: #081015;
  background: var(--neo-cyan);
}

body.theme-neofuture button,
body.theme-neofuture input,
body.theme-neofuture textarea,
body.theme-neofuture select {
  font-family: inherit;
  letter-spacing: 0;
}

body.theme-neofuture button,
body.theme-neofuture a,
body.theme-neofuture [role="button"] {
  -webkit-tap-highlight-color: transparent;
}

/* Header */
body.theme-neofuture .app-header {
  height: 64px;
  min-height: 64px;
  padding: 0 22px;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
  gap: 18px;
  border: 0;
  border-bottom: 1px solid var(--neo-line);
  background: rgba(8, 11, 16, .94);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28);
  backdrop-filter: blur(20px);
}

body.theme-neofuture .app-header::after {
  left: 22px;
  right: 22px;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, var(--neo-orange) 0 11%, var(--neo-cyan) 11% 42%, transparent 42%);
}

body.theme-neofuture .app-header h1 {
  display: flex;
  align-items: center;
  color: var(--neo-text);
  font-size: 17px;
  font-weight: 850;
}

body.theme-neofuture .app-header h1::before {
  min-width: 48px;
  justify-content: center;
  margin-right: 10px;
  padding: 4px 9px;
  border: 1px solid rgba(112, 228, 247, .62);
  border-radius: 3px;
  clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
  background: var(--neo-cyan);
  color: #071016;
  font-size: 11px;
  font-weight: 950;
  box-shadow: 0 0 20px rgba(112, 228, 247, .17);
}

body.theme-neofuture .app-header h1::after {
  content: "VISUAL ENGINE";
  margin-left: 10px;
  color: var(--neo-muted);
  font-family: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
  font-weight: 700;
}

body.theme-neofuture .header-navigation {
  padding: 3px;
  border: 1px solid var(--neo-line);
  border-radius: 7px;
  background: #0d1219;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
}

body.theme-neofuture .workspace-switch,
body.theme-neofuture .studio-mode-switch {
  border: 0;
  background: transparent;
}

body.theme-neofuture .workspace-switch button,
body.theme-neofuture .studio-mode-switch button {
  min-width: 102px;
  height: 36px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: #85919e;
  font-size: 11px;
  font-weight: 760;
}

body.theme-neofuture .workspace-switch button:hover,
body.theme-neofuture .studio-mode-switch button:hover {
  color: var(--neo-text);
  background: rgba(255, 255, 255, .035);
}

body.theme-neofuture .workspace-switch button.active,
body.theme-neofuture .studio-mode-switch button.active {
  border-color: rgba(112, 228, 247, .24);
  background: #17212b;
  color: var(--neo-text);
  box-shadow: inset 0 -2px var(--neo-cyan), 0 5px 14px rgba(0, 0, 0, .2);
}

body.theme-neofuture .workspace-switch button:disabled,
body.theme-neofuture .studio-mode-switch button:disabled {
  cursor: not-allowed;
  opacity: .52;
}

body.theme-neofuture .app-body.locked > .panel-left,
body.theme-neofuture .app-body.locked .studio-toolbar {
  pointer-events: none;
  user-select: none;
  opacity: .62;
}

body.theme-neofuture .workspace-switch button.video.active {
  border-color: rgba(255, 112, 67, .28);
  box-shadow: inset 0 -2px var(--neo-orange), 0 5px 14px rgba(0, 0, 0, .2);
}

body.theme-neofuture .workspace-switch svg,
body.theme-neofuture .studio-mode-switch svg {
  width: 15px;
  height: 15px;
}

body.theme-neofuture .contact-pill,
body.theme-neofuture .user-pill {
  border: 1px solid var(--neo-line);
  border-radius: 5px;
  background: #111821;
  color: var(--neo-text-soft);
  box-shadow: none;
}

body.theme-neofuture .contact-pill {
  color: var(--neo-cyan);
}

body.theme-neofuture .contact-pill b,
body.theme-neofuture .user-pill b {
  color: var(--neo-text);
}

/* Shared controls and Element Plus */
body.theme-neofuture .el-button,
body.theme-neofuture button.formal-secondary-action,
body.theme-neofuture button.text-button {
  border-color: var(--neo-line);
  border-radius: 5px;
  background: #151c25;
  color: var(--neo-text-soft);
  box-shadow: none;
}

body.theme-neofuture .el-button:hover,
body.theme-neofuture button.formal-secondary-action:hover,
body.theme-neofuture button.text-button:hover {
  border-color: var(--neo-line-strong);
  background: #1a2530;
  color: var(--neo-cyan);
}

body.theme-neofuture .el-button--primary,
body.theme-neofuture .btn-generate {
  border-color: var(--neo-orange);
  background: var(--neo-orange);
  color: #130b08;
  font-weight: 820;
}

body.theme-neofuture .el-button--primary:hover {
  border-color: #ff8a64;
  background: #ff8a64;
  color: #130b08;
}

body.theme-neofuture .el-input__wrapper,
body.theme-neofuture .el-select__wrapper,
body.theme-neofuture .el-textarea__inner,
body.theme-neofuture .el-input-number,
body.theme-neofuture .el-checkbox-button__inner,
body.theme-neofuture .el-radio-button__inner {
  border: 0 !important;
  background: #0d131b !important;
  color: var(--neo-text) !important;
  box-shadow: 0 0 0 1px var(--neo-line) inset !important;
}

body.theme-neofuture .el-input__wrapper.is-focus,
body.theme-neofuture .el-select__wrapper.is-focused,
body.theme-neofuture .el-textarea__inner:focus {
  box-shadow: 0 0 0 1px var(--neo-cyan) inset, 0 0 0 3px rgba(112, 228, 247, .08) !important;
}

body.theme-neofuture .el-input__inner,
body.theme-neofuture .el-textarea__inner,
body.theme-neofuture .el-select__placeholder,
body.theme-neofuture .el-select__selected-item {
  color: var(--neo-text) !important;
}

body.theme-neofuture .el-input__inner::placeholder,
body.theme-neofuture .el-textarea__inner::placeholder {
  color: #667380 !important;
}

body.theme-neofuture .el-tabs__item {
  color: var(--neo-muted);
  font-size: 12px;
  font-weight: 730;
}

body.theme-neofuture .el-tabs__item:hover,
body.theme-neofuture .el-tabs__item.is-active {
  color: var(--neo-cyan);
}

body.theme-neofuture .el-tabs__active-bar {
  background: var(--neo-cyan);
}

body.theme-neofuture .el-tabs__nav-wrap::after {
  background: var(--neo-line);
}

body.theme-neofuture .el-dialog {
  border: 1px solid var(--neo-line);
  border-radius: 8px;
  background: #111721;
  color: var(--neo-text);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .55);
}

body.theme-neofuture .el-dialog__header,
body.theme-neofuture .el-dialog__footer {
  border-color: var(--neo-line);
}

body.theme-neofuture .el-dialog__title,
body.theme-neofuture .el-form-item__label,
body.theme-neofuture .el-checkbox__label,
body.theme-neofuture .el-radio__label {
  color: var(--neo-text-soft);
}

body.theme-neofuture .el-overlay {
  background: rgba(2, 5, 8, .78);
  backdrop-filter: blur(5px);
}

/* Image workspace */
body.theme-neofuture .app-body.studio-v5 {
  grid-template-columns: 292px minmax(620px, 1fr) 356px;
  height: calc(100vh - 64px);
  background: var(--neo-bg);
  color: var(--neo-text);
}

body.theme-neofuture .app-body.studio-v5 > .panel-left,
body.theme-neofuture .app-body.studio-v5 > .panel-right {
  border-color: var(--neo-line);
  background: #0d1219;
}

body.theme-neofuture .app-body.studio-v5 > .panel-left {
  padding: 22px 18px;
}

body.theme-neofuture .app-body.studio-v5 > .panel-right {
  padding: 22px 18px;
}

body.theme-neofuture .app-body.studio-v5 > .panel-canvas {
  padding: 24px 28px 40px;
  background-color: #090d12;
  background-image:
    linear-gradient(rgba(112, 228, 247, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .032) 1px, transparent 1px);
  background-size: 32px 32px;
}

body.theme-neofuture .drawer-heading strong,
body.theme-neofuture .formal-creation-head h2 {
  color: var(--neo-text);
  font-weight: 820;
}

body.theme-neofuture .drawer-heading p,
body.theme-neofuture .formal-creation-head p {
  color: var(--neo-muted);
}

body.theme-neofuture .drawer-heading::before {
  content: "";
  width: 3px;
  height: 30px;
  margin-right: 9px;
  flex: 0 0 auto;
  background: var(--neo-cyan);
  box-shadow: 0 0 14px rgba(112, 228, 247, .34);
}

body.theme-neofuture .drawer-heading {
  display: flex;
  align-items: flex-start;
}

body.theme-neofuture .drawer-heading > div {
  flex: 1;
}

body.theme-neofuture .example-carousel,
body.theme-neofuture .app-body.studio-v5 .example-carousel {
  border-color: var(--neo-line);
  border-radius: 7px;
  background: var(--neo-panel);
  box-shadow: var(--neo-shadow-soft);
}

body.theme-neofuture .example-visual,
body.theme-neofuture .app-body.studio-v5 .example-visual,
body.theme-neofuture .reference-pair {
  background: #090d12;
}

body.theme-neofuture .example-visual::after,
body.theme-neofuture .reference-pair::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .055);
  box-shadow: inset 0 -54px 52px rgba(4, 7, 10, .22);
}

body.theme-neofuture .example-mode,
body.theme-neofuture .reference-shot span {
  border: 1px solid rgba(112, 228, 247, .28);
  background: rgba(8, 12, 17, .86);
  color: var(--neo-cyan);
}

body.theme-neofuture .example-copy strong {
  color: var(--neo-text);
  font-weight: 780;
}

body.theme-neofuture .example-copy p {
  color: var(--neo-muted);
}

body.theme-neofuture .example-meta span {
  border: 1px solid var(--neo-line);
  border-radius: 3px;
  background: #171e28;
  color: #aeb9c3;
}

body.theme-neofuture .example-meta span:last-child {
  border-color: rgba(255, 112, 67, .3);
  background: rgba(255, 112, 67, .1);
  color: #ff9a78;
}

body.theme-neofuture .example-page-btn,
body.theme-neofuture .example-apply {
  border-color: var(--neo-line);
  background: #171e28;
  color: var(--neo-text-soft);
}

body.theme-neofuture .example-page-btn:hover,
body.theme-neofuture .example-apply:hover {
  border-color: var(--neo-cyan);
  color: var(--neo-cyan);
}

body.theme-neofuture .example-dot {
  background: #35414c;
}

body.theme-neofuture .example-dot.active {
  background: var(--neo-orange);
}

body.theme-neofuture .formal-case-thumbs button {
  border-color: transparent;
  border-radius: 5px;
  background: #131a23;
}

body.theme-neofuture .formal-case-thumbs button:hover {
  border-color: rgba(112, 228, 247, .4);
}

body.theme-neofuture .formal-case-thumbs button.active {
  border-color: var(--neo-orange);
  box-shadow: 0 0 0 2px rgba(255, 112, 67, .15);
}

body.theme-neofuture .formal-creation-head {
  max-width: 940px;
}

body.theme-neofuture .formal-creation-head h2 {
  font-size: 21px;
}

body.theme-neofuture .app-body.studio-v5 .studio-workspace {
  max-width: 940px;
  margin: 0 auto;
  border: 1px solid var(--neo-line);
  border-radius: 8px;
  background: rgba(14, 19, 27, .95);
  box-shadow: var(--neo-shadow);
  overflow: hidden;
}

body.theme-neofuture .app-body.studio-v5 .studio-workspace::before {
  content: "";
  display: block;
  height: 2px;
  background: linear-gradient(90deg, var(--neo-orange) 0 18%, var(--neo-cyan) 18% 62%, transparent 62%);
}

body.theme-neofuture .app-body.studio-v5 .studio-toolbar {
  min-height: 52px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--neo-line);
  background: #0f151e;
}

body.theme-neofuture .app-body.studio-v5 .studio-tool {
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: var(--neo-muted);
  font-weight: 740;
}

body.theme-neofuture .app-body.studio-v5 .studio-tool:hover {
  color: var(--neo-text);
  background: rgba(255, 255, 255, .035);
}

body.theme-neofuture .app-body.studio-v5 .studio-tool.active {
  border-color: rgba(112, 228, 247, .24);
  background: #1a2530;
  color: var(--neo-cyan);
  box-shadow: inset 0 -2px var(--neo-cyan);
}

body.theme-neofuture .app-body.studio-v5 .studio-lock-banner {
  border-color: rgba(255, 112, 67, .3);
  background: rgba(255, 112, 67, .1);
  color: #ff9c7c;
}

body.theme-neofuture .app-body.studio-v5 .studio-source-strip {
  margin: 18px;
  border-color: var(--neo-line);
  border-radius: 7px;
  background: #111823;
}

body.theme-neofuture .app-body.studio-v5 .studio-source-preview {
  border-color: var(--neo-line);
  background: #090d12;
}

body.theme-neofuture .app-body.studio-v5 .studio-source-preview > button {
  border: 1px dashed rgba(112, 228, 247, .28);
  border-radius: 6px;
  background: #0b1017;
  color: var(--neo-text-soft);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-preview > button:hover {
  border-color: var(--neo-cyan);
  color: var(--neo-cyan);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-actions strong,
body.theme-neofuture .app-body.studio-v5 .studio-field > span,
body.theme-neofuture .app-body.studio-v5 .studio-compact-field > span {
  color: var(--neo-text-soft);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-actions p {
  color: var(--neo-muted);
}

body.theme-neofuture .app-body.studio-v5 .studio-upload,
body.theme-neofuture .app-body.studio-v5 .studio-manage-source {
  border-color: var(--neo-line);
  border-radius: 5px;
  background: #171f2a;
  color: var(--neo-text-soft);
}

body.theme-neofuture .app-body.studio-v5 .studio-upload {
  border-color: rgba(255, 112, 67, .35);
  color: #ff9a78;
}

body.theme-neofuture .app-body.studio-v5 .studio-composer {
  padding: 22px 24px 20px;
  background: #111721;
}

body.theme-neofuture .app-body.studio-v5 .studio-title,
body.theme-neofuture .app-body.studio-v5 .studio-prompt-field textarea,
body.theme-neofuture .app-body.studio-v5 .studio-select {
  border-color: var(--neo-line);
  border-radius: 6px;
  background: #0b1017;
  color: var(--neo-text);
}

body.theme-neofuture .app-body.studio-v5 .studio-title:focus,
body.theme-neofuture .app-body.studio-v5 .studio-prompt-field textarea:focus,
body.theme-neofuture .app-body.studio-v5 .studio-select:focus {
  border-color: var(--neo-cyan);
  outline: 3px solid rgba(112, 228, 247, .08);
}

body.theme-neofuture .app-body.studio-v5 .studio-title::placeholder,
body.theme-neofuture .app-body.studio-v5 .studio-prompt-field textarea::placeholder {
  color: #64717e;
}

body.theme-neofuture .app-body.studio-v5 .studio-setting-row {
  border-color: var(--neo-line);
}

body.theme-neofuture .app-body.studio-v5 .studio-type {
  border-color: var(--neo-line);
  background: #151c26;
  color: var(--neo-muted);
}

body.theme-neofuture .app-body.studio-v5 .studio-type.active {
  border-color: var(--neo-orange);
  background: rgba(255, 112, 67, .1);
  color: #ff9b79;
  box-shadow: inset 0 -2px var(--neo-orange);
}

body.theme-neofuture .app-body.studio-v5 .studio-composer-foot {
  border-color: var(--neo-line);
}

body.theme-neofuture .app-body.studio-v5 .studio-delivery-summary strong {
  color: var(--neo-text);
}

body.theme-neofuture .app-body.studio-v5 .studio-delivery-summary span {
  color: var(--neo-muted);
}

body.theme-neofuture .studio-generate,
body.theme-neofuture .video-quick-generate {
  border: 1px solid #ff7c51;
  border-radius: 5px;
  background: var(--neo-orange);
  color: #160b07;
  font-weight: 850;
  box-shadow: 0 9px 24px rgba(255, 80, 35, .22);
}

body.theme-neofuture .studio-generate:hover:not(:disabled),
body.theme-neofuture .video-quick-generate:hover:not(:disabled) {
  background: #ff875f;
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(255, 80, 35, .3);
}

body.theme-neofuture .drawer-form-block,
body.theme-neofuture .drawer-disclosure,
body.theme-neofuture .preview-hero,
body.theme-neofuture .generation-failure {
  border-color: var(--neo-line);
  background: var(--neo-panel);
}

body.theme-neofuture .drawer-block-head,
body.theme-neofuture .drawer-disclosure summary,
body.theme-neofuture .preview-title-row {
  color: var(--neo-text);
}

body.theme-neofuture .drawer-block-note,
body.theme-neofuture .drawer-disclosure-body,
body.theme-neofuture .empty {
  color: var(--neo-muted);
}

body.theme-neofuture .drawer-asset-item,
body.theme-neofuture .history-card,
body.theme-neofuture .result-card,
body.theme-neofuture .variant-card {
  border-color: var(--neo-line);
  background: #131a23;
  color: var(--neo-text-soft);
}

body.theme-neofuture .panel-right .empty .em {
  filter: saturate(.4);
}

body.theme-neofuture .loading-stage {
  color: var(--neo-cyan);
}

/* Video quick studio */
body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
body.theme-neofuture .video-workspace.canvas-v5.library-mode {
  height: calc(100vh - 64px);
  background-color: #090d12;
  background-image:
    linear-gradient(rgba(112, 228, 247, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .032) 1px, transparent 1px);
  background-size: 36px 36px;
}

body.theme-neofuture .video-quick-studio {
  color: var(--neo-text);
}

body.theme-neofuture .video-quick-title strong,
body.theme-neofuture .video-quick-composer h2,
body.theme-neofuture .video-quick-empty strong,
body.theme-neofuture .video-quick-examples-head strong {
  color: var(--neo-text);
  font-weight: 820;
}

body.theme-neofuture .video-quick-title span,
body.theme-neofuture .video-quick-composer > p,
body.theme-neofuture .video-quick-empty p,
body.theme-neofuture .video-quick-examples-head span {
  color: var(--neo-muted);
}

body.theme-neofuture .video-quick-actions button {
  border-color: var(--neo-line);
  background: #111821;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-kind-switch {
  border-color: var(--neo-line);
  background: #0d131b;
}

body.theme-neofuture .video-kind-switch button {
  color: var(--neo-muted);
}

body.theme-neofuture .video-kind-switch button:hover {
  color: var(--neo-text);
  background: rgba(255, 255, 255, .035);
}

body.theme-neofuture .video-kind-switch button.active {
  background: #17232d;
  color: var(--neo-orange);
  box-shadow: inset 0 -2px var(--neo-orange);
}

body.theme-neofuture .video-quick-actions button:hover {
  border-color: var(--neo-cyan);
  color: var(--neo-cyan);
}

body.theme-neofuture .video-quick-stage {
  border-color: var(--neo-line);
  border-radius: 8px;
  background: var(--neo-panel);
  box-shadow: var(--neo-shadow);
}

body.theme-neofuture .video-quick-preview {
  border-color: var(--neo-line);
  background-color: #090d12;
  background-image:
    linear-gradient(rgba(112, 228, 247, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .045) 1px, transparent 1px);
}

body.theme-neofuture .video-quick-empty span {
  border-color: rgba(112, 228, 247, .3);
  background: #121a23;
  color: var(--neo-cyan);
  box-shadow: 0 0 24px rgba(112, 228, 247, .12);
}

body.theme-neofuture .video-quick-preview-badge {
  border: 1px solid rgba(112, 228, 247, .3);
  background: rgba(7, 11, 15, .84);
  color: var(--neo-cyan);
}

body.theme-neofuture .video-quick-composer {
  background: #111721;
}

body.theme-neofuture .video-quick-kicker {
  color: var(--neo-cyan);
}

body.theme-neofuture .video-quick-upload,
body.theme-neofuture .video-quick-asset,
body.theme-neofuture .video-quick-production,
body.theme-neofuture .video-quick-presenter-upload,
body.theme-neofuture .video-quick-presenter-file {
  border-color: var(--neo-line);
  background: #0e151e;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-quick-production-head strong,
body.theme-neofuture .video-quick-voice > span {
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-quick-production-head > span,
body.theme-neofuture .video-quick-production-note {
  color: var(--neo-muted);
}

body.theme-neofuture .video-quick-mode {
  border-color: var(--neo-line);
  background: #0b1017;
}

body.theme-neofuture .video-quick-mode button {
  color: var(--neo-muted);
}

body.theme-neofuture .video-quick-mode button.active {
  background: #1b2833;
  color: var(--neo-cyan);
  box-shadow: inset 0 -2px var(--neo-cyan);
}

body.theme-neofuture .video-quick-voice select,
body.theme-neofuture .video-quick-prompt textarea,
body.theme-neofuture .video-quick-adjust input {
  border-color: var(--neo-line);
  background: #0b1017;
  color: var(--neo-text);
}

body.theme-neofuture .video-quick-voice select:focus,
body.theme-neofuture .video-quick-prompt textarea:focus,
body.theme-neofuture .video-quick-adjust input:focus {
  border-color: var(--neo-cyan);
  outline: 3px solid rgba(112, 228, 247, .08);
}

body.theme-neofuture .video-quick-prompt textarea::placeholder {
  color: #64717e;
}

body.theme-neofuture .video-quick-auto {
  color: var(--neo-muted);
}

body.theme-neofuture .video-quick-auto span {
  border: 1px solid var(--neo-line);
  background: #141c25;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-quick-auto b {
  color: var(--neo-cyan);
}

body.theme-neofuture .video-quick-progress {
  border-color: rgba(112, 228, 247, .26);
  background: rgba(112, 228, 247, .07);
}

body.theme-neofuture .video-quick-progress-head,
body.theme-neofuture .video-quick-progress-head strong {
  color: #a8edf7;
}

body.theme-neofuture .video-quick-progress-track {
  background: #1a3038;
}

body.theme-neofuture .video-quick-progress-track span {
  background: var(--neo-cyan);
}

body.theme-neofuture .video-quick-after,
body.theme-neofuture .video-quick-example {
  border-color: var(--neo-line);
  background: var(--neo-panel);
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-quick-example:hover {
  border-color: var(--neo-cyan);
  box-shadow: 0 12px 26px rgba(0, 0, 0, .3);
}

body.theme-neofuture .video-quick-example strong,
body.theme-neofuture .video-quick-summary strong {
  color: var(--neo-text);
}

body.theme-neofuture .video-quick-example span,
body.theme-neofuture .video-quick-summary p {
  color: var(--neo-muted);
}

body.theme-neofuture .video-quick-summary-actions button,
body.theme-neofuture .video-quick-summary-actions a,
body.theme-neofuture .video-quick-adjust button {
  border-color: var(--neo-line);
  background: #17202a;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-quick-adjust button {
  background: var(--neo-cyan);
  color: #071116;
}

/* Video library and professional canvas */
body.theme-neofuture .video-library-page {
  background: transparent;
  color: var(--neo-text);
}

body.theme-neofuture .video-library-head strong,
body.theme-neofuture .video-library-card strong {
  color: var(--neo-text);
}

body.theme-neofuture .video-library-head span,
body.theme-neofuture .video-library-card-body > span,
body.theme-neofuture .video-library-card-body time {
  color: var(--neo-muted);
}

body.theme-neofuture .video-library-back,
body.theme-neofuture .video-library-refresh,
body.theme-neofuture .video-library-state > button {
  border-color: var(--neo-line);
  background: #151d27;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-library-back:hover,
body.theme-neofuture .video-library-refresh:hover,
body.theme-neofuture .video-library-state > button:hover {
  border-color: var(--neo-cyan);
  color: var(--neo-cyan);
}

body.theme-neofuture .video-library-create {
  background: var(--neo-orange);
  color: #160b07;
  box-shadow: 0 9px 24px rgba(255, 80, 35, .22);
}

body.theme-neofuture .video-library-toolbar {
  border-color: var(--neo-line);
  background: var(--neo-panel);
}

body.theme-neofuture .video-library-search {
  border-color: var(--neo-line);
  background: #0b1017;
}

body.theme-neofuture .video-library-search input {
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-library-search input::placeholder {
  color: #65727f;
}

body.theme-neofuture .video-library-filters button {
  color: var(--neo-muted);
}

body.theme-neofuture .video-library-filters button:hover {
  color: var(--neo-text);
  background: rgba(255, 255, 255, .035);
}

body.theme-neofuture .video-library-filters button span {
  background: #1a222c;
  color: var(--neo-muted);
}

body.theme-neofuture .video-library-filters button.active {
  border-color: rgba(255, 112, 67, .35);
  background: rgba(255, 112, 67, .1);
  color: #ff9b79;
}

body.theme-neofuture .video-library-filters button.active span {
  background: var(--neo-orange);
  color: #160b07;
}

body.theme-neofuture .video-library-card,
body.theme-neofuture .video-library-filter,
body.theme-neofuture .video-library-empty {
  border-color: var(--neo-line);
  background: var(--neo-panel);
}

body.theme-neofuture .video-library-card-body > strong {
  color: var(--neo-text);
}

body.theme-neofuture .video-library-card footer {
  border-color: var(--neo-line);
}

body.theme-neofuture .video-library-card footer button {
  border-color: var(--neo-line);
  background: #151d27;
  color: var(--neo-text-soft);
}

body.theme-neofuture .video-library-card footer button.primary {
  border-color: var(--neo-orange);
  background: var(--neo-orange);
  color: #160b07;
}

body.theme-neofuture .video-library-state {
  color: var(--neo-muted);
}

body.theme-neofuture .video-library-state > strong {
  color: var(--neo-text-soft);
}

body.theme-neofuture .professional-workspace {
  background: var(--neo-bg);
  color: var(--neo-text);
}

body.theme-neofuture .pro-rail,
body.theme-neofuture .pro-inspector,
body.theme-neofuture .pro-inspector-head,
body.theme-neofuture .pro-save-bar,
body.theme-neofuture .pro-stage-status {
  border-color: var(--neo-line);
  background: #0d1219;
  color: var(--neo-text-soft);
}

body.theme-neofuture .pro-stage {
  background-color: #090d12;
  background-image:
    linear-gradient(rgba(112, 228, 247, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .04) 1px, transparent 1px);
}

body.theme-neofuture .professional-workspace .pro-canvas-viewport {
  background-color: #090d12;
  background-image:
    linear-gradient(rgba(112, 228, 247, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .045) 1px, transparent 1px);
  background-size: 28px 28px;
}

body.theme-neofuture .professional-workspace .pro-rail-section {
  border-color: var(--neo-line);
}

body.theme-neofuture .professional-workspace .pro-asset-empty {
  border-color: var(--neo-line);
  background: #0b1017;
  color: var(--neo-muted);
}

body.theme-neofuture .professional-workspace .pro-small-action,
body.theme-neofuture .professional-workspace .pro-toolbar-actions button {
  border-color: var(--neo-line);
  background: #151d27;
  color: var(--neo-text-soft);
}

body.theme-neofuture .professional-workspace .pro-small-action:hover,
body.theme-neofuture .professional-workspace .pro-toolbar-actions button:hover:not(:disabled) {
  border-color: var(--neo-cyan);
  color: var(--neo-cyan);
}

body.theme-neofuture .professional-workspace .pro-toolbar-actions button.primary {
  border-color: var(--neo-orange);
  background: var(--neo-orange);
  color: #160b07;
}

body.theme-neofuture .pro-stage-toolbar {
  border-color: var(--neo-line);
  background: rgba(13, 18, 25, .9);
}

body.theme-neofuture .pro-node-card {
  border-color: var(--neo-line);
  background: #131b25;
  color: var(--neo-text-soft);
  box-shadow: var(--neo-shadow-soft);
}

body.theme-neofuture .pro-node-card:hover,
body.theme-neofuture .pro-node-card.selected {
  border-color: var(--neo-cyan);
  box-shadow: 0 0 0 2px rgba(112, 228, 247, .1), 0 12px 28px rgba(0, 0, 0, .32);
}

body.theme-neofuture .pro-node-card.selected {
  border-top-color: var(--neo-orange);
}

body.theme-neofuture .pro-node-icon,
body.theme-neofuture .pro-inspector-head-line > span {
  background: #1a2b36;
  color: var(--neo-cyan);
}

body.theme-neofuture .pro-input,
body.theme-neofuture .pro-select,
body.theme-neofuture .pro-textarea,
body.theme-neofuture .pro-choice,
body.theme-neofuture .pro-scene-item,
body.theme-neofuture .pro-size-option {
  border-color: var(--neo-line);
  background: #0b1017;
  color: var(--neo-text-soft);
}

body.theme-neofuture .pro-choice.active,
body.theme-neofuture .pro-scene-item.active {
  border-color: var(--neo-orange);
  background: rgba(255, 112, 67, .1);
  color: #ff9b79;
}

body.theme-neofuture .pro-save-bar button {
  border-color: var(--neo-line);
  background: #151d27;
  color: var(--neo-text-soft);
}

body.theme-neofuture .pro-save-bar button.primary {
  border-color: var(--neo-orange);
  background: var(--neo-orange);
  color: #170b07;
}

/* Login and responsive */
body.theme-neofuture .login-screen {
  background-color: var(--neo-bg);
  background-image:
    linear-gradient(rgba(112, 228, 247, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 228, 247, .04) 1px, transparent 1px);
  background-size: 34px 34px;
}

body.theme-neofuture .login-card {
  border: 1px solid var(--neo-line);
  border-radius: 8px;
  background: rgba(17, 23, 33, .96);
  color: var(--neo-text);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .5);
}

body.theme-neofuture .login-card h2 {
  color: var(--neo-text);
}

body.theme-neofuture .login-card .sub {
  color: var(--neo-muted);
}

body.theme-neofuture * {
  scrollbar-width: thin;
  scrollbar-color: #33424e #0b1017;
}

body.theme-neofuture *::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body.theme-neofuture *::-webkit-scrollbar-track {
  background: #0b1017;
}

body.theme-neofuture *::-webkit-scrollbar-thumb {
  border: 2px solid #0b1017;
  border-radius: 8px;
  background: #33424e;
}

body.theme-neofuture *::-webkit-scrollbar-thumb:hover {
  background: #486071;
}

@media (prefers-reduced-motion: no-preference) {
  body.theme-neofuture .studio-generate,
  body.theme-neofuture .video-quick-generate,
  body.theme-neofuture .example-carousel,
  body.theme-neofuture .video-quick-stage {
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
  }
}

@media (max-width: 1320px) {
  body.theme-neofuture .app-body.studio-v5 {
    grid-template-columns: 260px minmax(560px, 1fr) 320px;
  }
}

@media (max-width: 1060px) {
  body.theme-neofuture .app-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 0 12px;
  }

  body.theme-neofuture .app-header h1::after {
    display: none;
  }
}

@media (max-width: 760px) {
  body.theme-neofuture .app-header {
    min-height: 78px;
    height: auto;
    padding: 8px 10px;
  }

  body.theme-neofuture .app-header h1::before {
    margin: 0;
  }

  body.theme-neofuture .header-navigation {
    width: 100%;
  }

  body.theme-neofuture .workspace-switch button,
  body.theme-neofuture .studio-mode-switch button {
    min-width: 0;
  }

  body.theme-neofuture .app-body.studio-v5 {
    height: calc(100vh - 78px);
    background: var(--neo-bg);
  }

  body.theme-neofuture .app-body.studio-v5 > .panel-canvas {
    padding: 14px 12px 28px;
  }

  body.theme-neofuture .formal-creation-head {
    align-items: flex-start;
  }

  body.theme-neofuture .formal-creation-head h2 {
    font-size: 18px;
  }

  body.theme-neofuture .studio-composer {
    padding: 18px 14px 16px;
  }

  body.theme-neofuture .studio-source-strip {
    margin: 12px;
  }

  body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
  body.theme-neofuture .video-workspace.canvas-v5.library-mode {
    height: auto;
    min-height: calc(100vh - 78px);
  }

  body.theme-neofuture .video-quick-stage {
    box-shadow: none;
  }
}

/* Unified motion system
   Motion communicates system state across image, video, canvas, library and dialogs.
   The ambient layer stays quiet; stronger motion is reserved for active work. */
@keyframes neo-grid-drift {
  from { background-position: 0 0, 0 0; }
  to { background-position: 40px 40px, 40px 40px; }
}

@keyframes neo-grid-drift-compact {
  from { background-position: 0 0, 0 0; }
  to { background-position: 32px 32px, 32px 32px; }
}

@keyframes neo-header-signal {
  0%, 100% { background-position: 0 0; opacity: .72; }
  50% { background-position: 100% 0; opacity: 1; }
}

@keyframes neo-signal-pulse {
  0%, 100% { opacity: .52; box-shadow: 0 0 0 rgba(112, 228, 247, 0); }
  50% { opacity: 1; box-shadow: 0 0 15px rgba(112, 228, 247, .42); }
}

@keyframes neo-energy-sweep {
  0% { transform: translateX(-155%) skewX(-22deg); }
  100% { transform: translateX(260%) skewX(-22deg); }
}

@keyframes neo-stage-scan {
  0% { top: 0; opacity: 0; }
  8% { opacity: .8; }
  88% { opacity: .34; }
  100% { top: calc(100% - 2px); opacity: 0; }
}

@keyframes neo-flow {
  from { background-position: 0 0; }
  to { background-position: 32px 0; }
}

@keyframes neo-running-node {
  0%, 100% { box-shadow: 0 0 0 1px rgba(112, 228, 247, .12), 0 10px 26px rgba(0, 0, 0, .26); }
  50% { box-shadow: 0 0 0 3px rgba(112, 228, 247, .18), 0 0 24px rgba(112, 228, 247, .16), 0 12px 30px rgba(0, 0, 0, .32); }
}

@keyframes neo-warning-pulse {
  0%, 100% { border-color: rgba(255, 107, 107, .34); }
  50% { border-color: rgba(255, 107, 107, .9); box-shadow: 0 0 0 3px rgba(255, 107, 107, .08); }
}

@keyframes neo-progress-shimmer {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}

@keyframes neo-card-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes neo-dialog-enter {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes neo-status-blink {
  0%, 46%, 100% { opacity: 1; }
  48%, 52% { opacity: .25; }
}

@media (prefers-reduced-motion: no-preference) {
  body.theme-neofuture {
    animation: neo-grid-drift 42s linear infinite;
  }

  body.theme-neofuture .app-header::after {
    display: block;
    background-size: 220% 100%;
    animation: neo-header-signal 9s ease-in-out infinite;
  }

  body.theme-neofuture .app-header h1::after {
    position: relative;
    padding-left: 10px;
  }

  body.theme-neofuture .app-header h1::after {
    text-shadow: 0 0 11px rgba(112, 228, 247, .26);
    animation: neo-status-blink 8s steps(1, end) infinite;
  }

  body.theme-neofuture .app-body.studio-v5 > .panel-canvas,
  body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
  body.theme-neofuture .video-workspace.canvas-v5.library-mode {
    animation: neo-grid-drift-compact 36s linear infinite;
  }

  body.theme-neofuture .studio-workspace::before {
    background-size: 220% 100%;
    animation: neo-header-signal 7s ease-in-out infinite;
  }

  body.theme-neofuture .studio-source-preview,
  body.theme-neofuture .studio-composer,
  body.theme-neofuture .video-quick-production,
  body.theme-neofuture .video-quick-prompt textarea,
  body.theme-neofuture .pro-node-card,
  body.theme-neofuture .video-library-card,
  body.theme-neofuture .history-card,
  body.theme-neofuture .result-card,
  body.theme-neofuture .variant-card,
  body.theme-neofuture .drawer-asset-item {
    transition:
      border-color .18s ease,
      box-shadow .18s ease,
      background-color .18s ease,
      transform .18s ease,
      opacity .18s ease;
  }

  body.theme-neofuture .studio-source-preview:hover,
  body.theme-neofuture .drawer-asset-item:hover {
    border-color: rgba(112, 228, 247, .5);
    box-shadow: 0 0 0 2px rgba(112, 228, 247, .07), 0 10px 26px rgba(0, 0, 0, .24);
    transform: translateY(-1px);
  }

  body.theme-neofuture .history-card,
  body.theme-neofuture .result-card,
  body.theme-neofuture .variant-card,
  body.theme-neofuture .video-library-card,
  body.theme-neofuture .video-quick-after,
  body.theme-neofuture .generation-failure {
    animation: neo-card-enter .34s ease both;
  }

  body.theme-neofuture .history-card:nth-child(2),
  body.theme-neofuture .video-library-card:nth-child(2) { animation-delay: 35ms; }
  body.theme-neofuture .history-card:nth-child(3),
  body.theme-neofuture .video-library-card:nth-child(3) { animation-delay: 70ms; }
  body.theme-neofuture .history-card:nth-child(4),
  body.theme-neofuture .video-library-card:nth-child(4) { animation-delay: 105ms; }
  body.theme-neofuture .history-card:nth-child(5),
  body.theme-neofuture .video-library-card:nth-child(5) { animation-delay: 140ms; }
  body.theme-neofuture .history-card:nth-child(6),
  body.theme-neofuture .video-library-card:nth-child(6) { animation-delay: 175ms; }

  body.theme-neofuture .example-visual img,
  body.theme-neofuture .reference-pair img,
  body.theme-neofuture .formal-case-thumbs img,
  body.theme-neofuture .video-quick-example img,
  body.theme-neofuture .video-library-poster > img,
  body.theme-neofuture .pro-asset-thumb img {
    transition: transform .32s cubic-bezier(.2, .7, .2, 1), filter .25s ease;
  }

  body.theme-neofuture .example-carousel:hover .example-visual img,
  body.theme-neofuture .video-quick-example:hover img,
  body.theme-neofuture .video-library-card:hover .video-library-poster > img,
  body.theme-neofuture .pro-asset-thumb:hover img {
    transform: scale(1.025);
    filter: saturate(1.05) contrast(1.02);
  }

  body.theme-neofuture .studio-generate,
  body.theme-neofuture .video-quick-generate,
  body.theme-neofuture .pro-toolbar-actions button.primary,
  body.theme-neofuture .pro-save-bar button.primary,
  body.theme-neofuture .video-library-create,
  body.theme-neofuture .login-submit {
    position: relative;
    isolation: isolate;
    overflow: hidden;
  }

  body.theme-neofuture .studio-generate::after,
  body.theme-neofuture .video-quick-generate::after,
  body.theme-neofuture .pro-toolbar-actions button.primary::after,
  body.theme-neofuture .pro-save-bar button.primary::after,
  body.theme-neofuture .video-library-create::after,
  body.theme-neofuture .login-submit::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: -45%;
    left: 0;
    width: 34%;
    height: 190%;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent);
    transform: translateX(-155%) skewX(-22deg);
  }

  body.theme-neofuture .studio-generate:hover:not(:disabled)::after,
  body.theme-neofuture .video-quick-generate:hover:not(:disabled)::after,
  body.theme-neofuture .pro-toolbar-actions button.primary:hover:not(:disabled)::after,
  body.theme-neofuture .pro-save-bar button.primary:hover:not(:disabled)::after,
  body.theme-neofuture .video-library-create:hover::after,
  body.theme-neofuture .login-submit:hover:not(:disabled)::after {
    animation: neo-energy-sweep .72s ease-out;
  }

  body.theme-neofuture .app-body.locked .studio-stage::after {
    left: 0;
    right: auto;
    top: 0;
    z-index: 5;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent 3%, var(--neo-cyan) 24% 76%, transparent 97%);
    box-shadow: 0 0 18px rgba(112, 228, 247, .7);
    animation: neo-stage-scan 2.2s linear infinite;
  }

  body.theme-neofuture .app-body.locked .studio-lock-banner {
    position: relative;
  }

  body.theme-neofuture .app-body.locked .studio-lock-banner::before,
  body.theme-neofuture .video-workspace.busy .video-quick-progress-head::before,
  body.theme-neofuture .professional-workspace.busy .pro-stage-status::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--neo-cyan);
    animation: neo-signal-pulse 1.2s ease-in-out infinite;
  }

  body.theme-neofuture .video-workspace.busy .video-quick-preview::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    z-index: 4;
    width: 100%;
    height: 2px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent 2%, var(--neo-cyan) 28% 72%, transparent 98%);
    box-shadow: 0 0 20px rgba(112, 228, 247, .75);
    animation: neo-stage-scan 2.5s linear infinite;
  }

  body.theme-neofuture .video-workspace.busy .video-quick-preview::after {
    content: "RENDERING";
    position: absolute;
    z-index: 5;
    right: 14px;
    top: 14px;
    padding: 5px 7px;
    border: 1px solid rgba(112, 228, 247, .35);
    border-radius: 3px;
    background: rgba(5, 10, 15, .8);
    color: var(--neo-cyan);
    font-family: "Cascadia Mono", Consolas, monospace;
    font-size: 8px;
    font-weight: 800;
    animation: neo-status-blink 1.8s steps(1, end) infinite;
  }

  body.theme-neofuture .video-quick-progress-track span {
    background:
      linear-gradient(90deg, var(--neo-cyan-strong), var(--neo-cyan), #f4ffff, var(--neo-cyan-strong));
    background-size: 220% 100%;
    animation: neo-progress-shimmer 1.8s linear infinite;
  }

  body.theme-neofuture .workflow-node-card:not(:last-child)::after,
  body.theme-neofuture .pro-node-card:not(:last-child)::after {
    background:
      repeating-linear-gradient(90deg, rgba(112, 228, 247, .18) 0 6px, var(--neo-cyan) 6px 11px, rgba(112, 228, 247, .18) 11px 16px);
    background-size: 32px 100%;
    animation: neo-flow 1.4s linear infinite;
  }

  body.theme-neofuture .workflow-node-card.complete:not(:last-child)::after,
  body.theme-neofuture .pro-node-card.complete:not(:last-child)::after {
    background:
      repeating-linear-gradient(90deg, rgba(169, 230, 110, .2) 0 6px, var(--neo-lime) 6px 11px, rgba(169, 230, 110, .2) 11px 16px);
    background-size: 32px 100%;
  }

  body.theme-neofuture .pro-canvas-viewport {
    animation: neo-grid-drift 34s linear infinite;
  }

  body.theme-neofuture .pro-node-card.running,
  body.theme-neofuture .workflow-node-card.running {
    border-color: var(--neo-cyan);
    animation: neo-running-node 1.35s ease-in-out infinite;
  }

  body.theme-neofuture .pro-node-card.running .pro-node-icon svg,
  body.theme-neofuture .professional-workspace.busy .pro-toolbar-actions button.primary svg,
  body.theme-neofuture .video-workspace.busy .video-quick-generate svg {
    animation: spin 1s linear infinite;
  }

  body.theme-neofuture .pro-node-card.failed,
  body.theme-neofuture .workflow-node-card.failed,
  body.theme-neofuture .generation-failure {
    animation: neo-warning-pulse .75s ease-in-out 2;
  }

  body.theme-neofuture .pro-node-card.complete .pro-node-icon,
  body.theme-neofuture .workflow-node-card.complete .workflow-node-top i {
    filter: drop-shadow(0 0 7px rgba(169, 230, 110, .36));
  }

  body.theme-neofuture .example-dot.active {
    animation: neo-signal-pulse 2.2s ease-in-out infinite;
  }

  body.theme-neofuture .el-dialog,
  body.theme-neofuture .el-message-box,
  body.theme-neofuture .el-notification {
    transform-origin: center top;
    animation: neo-dialog-enter .22s ease-out both;
  }
}

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

/* Contrast-first cyber workspace
   Dark chrome carries the identity; bright work surfaces protect readability,
   product color accuracy and long-session efficiency. */
body.theme-neofuture {
  --work-bg: #e4ebf2;
  --work-bg-2: #d8e2eb;
  --work-panel: #f8fafc;
  --work-surface: #ffffff;
  --work-surface-2: #f1f5f8;
  --work-line: #c7d3de;
  --work-line-strong: #9eb4c4;
  --work-text: #172330;
  --work-text-soft: #3d4d5c;
  --work-muted: #6c7c8b;
  --work-cyan: #087f99;
  --work-orange: #df5b2e;
  --work-magenta: #bd3f7a;
  color-scheme: light;
  background-color: var(--work-bg) !important;
  background-image:
    linear-gradient(rgba(8, 127, 153, .065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .065) 1px, transparent 1px) !important;
  color: var(--work-text);
}

/* Keep the system chrome dark and compact. */
body.theme-neofuture .app-header {
  color-scheme: dark;
  background: rgba(8, 12, 19, .96);
}

body.theme-neofuture .app-header .el-button {
  border-color: rgba(156, 196, 218, .2);
  background: #151c25;
  color: #c0cad3;
}

body.theme-neofuture .app-header .el-button:hover {
  border-color: rgba(112, 228, 247, .5);
  background: #1a2530;
  color: #70e4f7;
}

/* Shared readable controls and overlays. */
body.theme-neofuture .el-button,
body.theme-neofuture button.formal-secondary-action,
body.theme-neofuture button.text-button {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .el-button:hover,
body.theme-neofuture button.formal-secondary-action:hover,
body.theme-neofuture button.text-button:hover {
  border-color: var(--work-cyan);
  background: #f2fbfd;
  color: var(--work-cyan);
}

body.theme-neofuture .el-button--primary,
body.theme-neofuture .btn-generate {
  border-color: var(--work-orange);
  background: var(--work-orange);
  color: #fff;
}

body.theme-neofuture .el-input__wrapper,
body.theme-neofuture .el-select__wrapper,
body.theme-neofuture .el-textarea__inner,
body.theme-neofuture .el-input-number,
body.theme-neofuture .el-checkbox-button__inner,
body.theme-neofuture .el-radio-button__inner {
  background: var(--work-surface) !important;
  color: var(--work-text) !important;
  box-shadow: 0 0 0 1px var(--work-line) inset !important;
}

body.theme-neofuture .el-input__inner,
body.theme-neofuture .el-textarea__inner,
body.theme-neofuture .el-select__placeholder,
body.theme-neofuture .el-select__selected-item,
body.theme-neofuture .el-checkbox__label,
body.theme-neofuture .el-radio__label {
  color: var(--work-text) !important;
}

body.theme-neofuture .el-input__inner::placeholder,
body.theme-neofuture .el-textarea__inner::placeholder {
  color: #8996a2 !important;
}

body.theme-neofuture .el-tabs__item {
  color: var(--work-muted);
}

body.theme-neofuture .el-tabs__item:hover,
body.theme-neofuture .el-tabs__item.is-active {
  color: var(--work-cyan);
}

body.theme-neofuture .el-tabs__active-bar {
  background: var(--work-cyan);
}

body.theme-neofuture .el-tabs__nav-wrap::after {
  background: var(--work-line);
}

body.theme-neofuture .el-dialog,
body.theme-neofuture .el-message-box {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text);
  box-shadow: 0 28px 80px rgba(28, 45, 60, .28);
}

body.theme-neofuture .el-dialog__header,
body.theme-neofuture .el-dialog__footer {
  border-color: var(--work-line);
}

body.theme-neofuture .el-dialog__title,
body.theme-neofuture .el-form-item__label {
  color: var(--work-text);
}

body.theme-neofuture .el-overlay {
  background: rgba(8, 15, 23, .56);
}

/* Image creation and reference library. */
body.theme-neofuture .app-body.studio-v5 {
  --bg-0: var(--work-bg);
  --bg-1: var(--work-surface);
  --bg-2: var(--work-surface-2);
  --bg-3: #e6edf3;
  --border: var(--work-line);
  --text-0: var(--work-text);
  --text-1: var(--work-text-soft);
  --text-2: var(--work-muted);
  --c1: var(--work-cyan);
  --c2: #119fbc;
  --c3: var(--work-orange);
  background: var(--work-bg);
  color: var(--work-text);
}

body.theme-neofuture .app-body.studio-v5 > .panel-left,
body.theme-neofuture .app-body.studio-v5 > .panel-right {
  border-color: var(--work-line);
  background: var(--work-panel);
  color: var(--work-text);
}

body.theme-neofuture .app-body.studio-v5 > .panel-right {
  background: #f4f7fa;
}

body.theme-neofuture .app-body.studio-v5 > .panel-canvas {
  background-color: var(--work-bg);
  background-image:
    linear-gradient(rgba(8, 127, 153, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .075) 1px, transparent 1px);
}

body.theme-neofuture .drawer-heading strong,
body.theme-neofuture .formal-creation-head h2,
body.theme-neofuture .drawer-block-head,
body.theme-neofuture .drawer-disclosure summary,
body.theme-neofuture .preview-title-row {
  color: var(--work-text);
}

body.theme-neofuture .drawer-heading p,
body.theme-neofuture .formal-creation-head p,
body.theme-neofuture .drawer-block-note,
body.theme-neofuture .drawer-disclosure-body,
body.theme-neofuture .empty {
  color: var(--work-muted);
}

body.theme-neofuture .example-carousel,
body.theme-neofuture .app-body.studio-v5 .example-carousel {
  border-color: var(--work-line);
  background: var(--work-surface);
  box-shadow: 0 12px 30px rgba(39, 58, 74, .1);
}

body.theme-neofuture .example-visual,
body.theme-neofuture .app-body.studio-v5 .example-visual,
body.theme-neofuture .reference-pair {
  background: #eaf0f5;
}

body.theme-neofuture .example-copy strong {
  color: var(--work-text);
}

body.theme-neofuture .example-copy p {
  color: var(--work-muted);
}

body.theme-neofuture .example-meta span {
  border-color: #d4dee6;
  background: #eef3f6;
  color: #4d5e6c;
}

body.theme-neofuture .example-meta span:last-child {
  border-color: rgba(189, 63, 122, .25);
  background: rgba(189, 63, 122, .08);
  color: #9b2f61;
}

body.theme-neofuture .example-page-btn,
body.theme-neofuture .example-apply {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .formal-case-thumbs button {
  background: #eaf0f5;
}

body.theme-neofuture .app-body.studio-v5 .studio-workspace {
  border-color: var(--work-line-strong);
  background: var(--work-surface);
  box-shadow: 0 18px 44px rgba(35, 55, 72, .14);
}

body.theme-neofuture .app-body.studio-v5 .studio-toolbar {
  border-color: var(--work-line);
  background: #eef3f7;
}

body.theme-neofuture .app-body.studio-v5 .studio-tool {
  color: #657686;
}

body.theme-neofuture .app-body.studio-v5 .studio-tool:hover {
  color: var(--work-text);
  background: rgba(8, 127, 153, .06);
}

body.theme-neofuture .app-body.studio-v5 .studio-tool.active {
  border-color: rgba(8, 127, 153, .26);
  background: #dfeff3;
  color: #086f86;
  box-shadow: inset 0 -2px var(--work-cyan);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-strip {
  border-color: var(--work-line);
  background: #f2f6f9;
}

body.theme-neofuture .app-body.studio-v5 .studio-source-preview {
  border-color: var(--work-line);
  background: var(--work-surface);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-preview > button {
  border-color: rgba(8, 127, 153, .4);
  background: #f5fbfc;
  color: var(--work-text-soft);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-actions strong,
body.theme-neofuture .app-body.studio-v5 .studio-field > span,
body.theme-neofuture .app-body.studio-v5 .studio-compact-field > span,
body.theme-neofuture .app-body.studio-v5 .studio-delivery-summary strong {
  color: var(--work-text);
}

body.theme-neofuture .app-body.studio-v5 .studio-source-actions p,
body.theme-neofuture .app-body.studio-v5 .studio-delivery-summary span {
  color: var(--work-muted);
}

body.theme-neofuture .app-body.studio-v5 .studio-upload,
body.theme-neofuture .app-body.studio-v5 .studio-manage-source {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .app-body.studio-v5 .studio-upload {
  border-color: rgba(223, 91, 46, .4);
  color: #b84620;
}

body.theme-neofuture .app-body.studio-v5 .studio-composer {
  background: var(--work-surface);
}

body.theme-neofuture .app-body.studio-v5 .studio-title,
body.theme-neofuture .app-body.studio-v5 .studio-prompt-field textarea,
body.theme-neofuture .app-body.studio-v5 .studio-select {
  border-color: var(--work-line);
  background: #fbfcfd;
  color: var(--work-text);
}

body.theme-neofuture .app-body.studio-v5 .studio-title::placeholder,
body.theme-neofuture .app-body.studio-v5 .studio-prompt-field textarea::placeholder {
  color: #8996a2;
}

body.theme-neofuture .app-body.studio-v5 .studio-setting-row,
body.theme-neofuture .app-body.studio-v5 .studio-composer-foot {
  border-color: #dce4ea;
}

body.theme-neofuture .app-body.studio-v5 .studio-type {
  border-color: var(--work-line);
  background: #eef3f6;
  color: #607180;
}

body.theme-neofuture .app-body.studio-v5 .studio-type.active {
  border-color: var(--work-orange);
  background: #fff1eb;
  color: #a8411e;
}

body.theme-neofuture .drawer-form-block,
body.theme-neofuture .drawer-disclosure,
body.theme-neofuture .preview-hero,
body.theme-neofuture .generation-failure,
body.theme-neofuture .drawer-asset-item,
body.theme-neofuture .history-card,
body.theme-neofuture .result-card,
body.theme-neofuture .variant-card {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .history-body,
body.theme-neofuture .history-body strong,
body.theme-neofuture .result-summary,
body.theme-neofuture .result-summary strong {
  color: var(--work-text);
}

body.theme-neofuture .history-instruction,
body.theme-neofuture .history-feedback-label,
body.theme-neofuture .history-item {
  color: var(--work-text-soft);
}

body.theme-neofuture .history-feedback,
body.theme-neofuture .result-summary .row {
  border-color: #dce4ea;
}

body.theme-neofuture .history-thumb-missing,
body.theme-neofuture .preview-img-wrap {
  background: #eef3f6;
  color: var(--work-muted);
}

body.theme-neofuture .history-delete {
  border-color: rgba(199, 211, 222, .9);
  background: rgba(255, 255, 255, .96);
  color: #5f6f7d;
}

body.theme-neofuture .loading-stage {
  color: var(--work-cyan);
}

/* Video studio and video library. */
body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
body.theme-neofuture .video-workspace.canvas-v5.library-mode {
  --video-ink: var(--work-text);
  --video-muted: var(--work-muted);
  --video-line: var(--work-line);
  --video-paper: var(--work-surface);
  background-color: var(--work-bg);
  background-image:
    linear-gradient(rgba(8, 127, 153, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .075) 1px, transparent 1px);
}

body.theme-neofuture .video-quick-studio,
body.theme-neofuture .video-library-page {
  color: var(--work-text);
}

body.theme-neofuture .video-quick-title strong,
body.theme-neofuture .video-quick-composer h2,
body.theme-neofuture .video-quick-empty strong,
body.theme-neofuture .video-quick-examples-head strong,
body.theme-neofuture .video-library-head strong,
body.theme-neofuture .video-library-card strong {
  color: var(--work-text);
}

body.theme-neofuture .video-quick-title span,
body.theme-neofuture .video-quick-composer > p,
body.theme-neofuture .video-quick-empty p,
body.theme-neofuture .video-quick-examples-head span,
body.theme-neofuture .video-library-head span,
body.theme-neofuture .video-library-card-body > span,
body.theme-neofuture .video-library-card-body time {
  color: var(--work-muted);
}

body.theme-neofuture .video-quick-actions button,
body.theme-neofuture .video-library-back,
body.theme-neofuture .video-library-refresh,
body.theme-neofuture .video-library-state > button {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .video-kind-switch {
  border-color: var(--work-line);
  background: #eef3f7;
}

body.theme-neofuture .video-kind-switch button {
  color: var(--work-muted);
}

body.theme-neofuture .video-kind-switch button:hover {
  color: var(--work-text);
  background: rgba(8, 127, 153, .06);
}

body.theme-neofuture .video-kind-switch button.active {
  background: var(--work-surface);
  color: #b84721;
  box-shadow: inset 0 -2px var(--work-orange);
}

body.theme-neofuture .video-quick-stage {
  border-color: var(--work-line-strong);
  background: var(--work-surface);
  box-shadow: 0 18px 44px rgba(35, 55, 72, .14);
}

body.theme-neofuture .video-quick-preview {
  border-color: var(--work-line);
  background-color: #eaf0f5;
  background-image:
    linear-gradient(rgba(8, 127, 153, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .075) 1px, transparent 1px);
}

body.theme-neofuture .video-quick-empty span {
  border-color: rgba(8, 127, 153, .3);
  background: var(--work-surface);
  color: var(--work-cyan);
  box-shadow: 0 8px 24px rgba(26, 72, 88, .1);
}

body.theme-neofuture .video-quick-composer {
  background: var(--work-surface);
}

body.theme-neofuture .video-quick-kicker {
  color: var(--work-cyan);
}

body.theme-neofuture .video-quick-upload,
body.theme-neofuture .video-quick-asset,
body.theme-neofuture .video-quick-production,
body.theme-neofuture .video-quick-presenter-upload,
body.theme-neofuture .video-quick-presenter-file {
  border-color: var(--work-line);
  background: var(--work-surface-2);
  color: var(--work-text-soft);
}

body.theme-neofuture .video-quick-production-head strong,
body.theme-neofuture .video-quick-voice > span {
  color: var(--work-text);
}

body.theme-neofuture .video-quick-production-head > span,
body.theme-neofuture .video-quick-production-note {
  color: var(--work-muted);
}

body.theme-neofuture .video-quick-mode {
  border-color: var(--work-line);
  background: var(--work-surface);
}

body.theme-neofuture .video-quick-mode button {
  color: var(--work-muted);
}

body.theme-neofuture .video-quick-mode button.active {
  background: #dcecf1;
  color: #086f86;
  box-shadow: inset 0 -2px var(--work-cyan);
}

body.theme-neofuture .video-quick-voice select,
body.theme-neofuture .video-quick-prompt textarea,
body.theme-neofuture .video-quick-adjust input {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text);
}

body.theme-neofuture .video-quick-prompt textarea::placeholder,
body.theme-neofuture .video-library-search input::placeholder {
  color: #8996a2;
}

body.theme-neofuture .video-quick-auto {
  color: var(--work-muted);
}

body.theme-neofuture .video-quick-auto span {
  border-color: #d4dee6;
  background: #edf3f6;
  color: #4f6170;
}

body.theme-neofuture .video-quick-progress {
  border-color: rgba(8, 127, 153, .28);
  background: #edf9fb;
}

body.theme-neofuture .video-quick-progress-head,
body.theme-neofuture .video-quick-progress-head strong {
  color: #176477;
}

body.theme-neofuture .video-quick-progress-track {
  background: #cfe1e6;
}

body.theme-neofuture .video-quick-after,
body.theme-neofuture .video-quick-example,
body.theme-neofuture .video-library-toolbar,
body.theme-neofuture .video-library-card,
body.theme-neofuture .video-library-filter,
body.theme-neofuture .video-library-empty {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .video-quick-example strong,
body.theme-neofuture .video-quick-summary strong,
body.theme-neofuture .video-library-card-body > strong,
body.theme-neofuture .video-library-state > strong {
  color: var(--work-text);
}

body.theme-neofuture .video-quick-example span,
body.theme-neofuture .video-quick-summary p,
body.theme-neofuture .video-library-state {
  color: var(--work-muted);
}

body.theme-neofuture .video-quick-summary-actions button,
body.theme-neofuture .video-quick-summary-actions a,
body.theme-neofuture .video-library-card footer button {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .video-quick-adjust button {
  border-color: var(--work-cyan);
  background: var(--work-cyan);
  color: #fff;
}

body.theme-neofuture .video-library-search {
  border-color: var(--work-line);
  background: var(--work-surface);
}

body.theme-neofuture .video-library-search input {
  color: var(--work-text);
}

body.theme-neofuture .video-library-filters button {
  color: var(--work-muted);
}

body.theme-neofuture .video-library-filters button:hover {
  color: var(--work-text);
  background: #edf3f6;
}

body.theme-neofuture .video-library-filters button span {
  background: #e6edf2;
  color: #647584;
}

body.theme-neofuture .video-library-card footer {
  border-color: #dce4ea;
}

/* Professional canvas: bright operational rails with a technical blue grid. */
body.theme-neofuture .professional-workspace {
  --text-0: var(--work-text);
  --text-1: var(--work-text-soft);
  --text-2: var(--work-muted);
  --border: var(--work-line);
  background: var(--work-bg);
  color: var(--work-text);
}

body.theme-neofuture .pro-rail,
body.theme-neofuture .pro-inspector,
body.theme-neofuture .pro-inspector-head,
body.theme-neofuture .pro-save-bar,
body.theme-neofuture .pro-stage-status {
  border-color: var(--work-line);
  background: var(--work-panel);
  color: var(--work-text-soft);
}

body.theme-neofuture .pro-stage,
body.theme-neofuture .professional-workspace .pro-canvas-viewport {
  background-color: #dfe8ef;
  background-image:
    linear-gradient(rgba(8, 127, 153, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .1) 1px, transparent 1px);
}

body.theme-neofuture .professional-workspace .pro-rail-section {
  border-color: var(--work-line);
}

body.theme-neofuture .professional-workspace .pro-asset-empty {
  border-color: var(--work-line);
  background: #eef3f6;
  color: var(--work-muted);
}

body.theme-neofuture .professional-workspace .pro-small-action,
body.theme-neofuture .professional-workspace .pro-toolbar-actions button,
body.theme-neofuture .pro-save-bar button {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .pro-stage-toolbar {
  border-color: var(--work-line);
  background: rgba(248, 250, 252, .94);
  color: var(--work-text);
}

body.theme-neofuture .pro-node-card {
  border-color: var(--work-line-strong);
  background: var(--work-surface);
  color: var(--work-text-soft);
  box-shadow: 0 9px 24px rgba(39, 58, 74, .13);
}

body.theme-neofuture .pro-node-card:hover,
body.theme-neofuture .pro-node-card.selected {
  border-color: var(--work-cyan);
  box-shadow: 0 0 0 2px rgba(8, 127, 153, .1), 0 13px 30px rgba(39, 58, 74, .16);
}

body.theme-neofuture .pro-node-icon,
body.theme-neofuture .pro-inspector-head-line > span {
  background: #dcecf1;
  color: #086f86;
}

body.theme-neofuture .pro-input,
body.theme-neofuture .pro-select,
body.theme-neofuture .pro-textarea,
body.theme-neofuture .pro-choice,
body.theme-neofuture .pro-scene-item,
body.theme-neofuture .pro-size-option {
  border-color: var(--work-line);
  background: var(--work-surface);
  color: var(--work-text-soft);
}

body.theme-neofuture .pro-choice.active,
body.theme-neofuture .pro-scene-item.active {
  border-color: var(--work-orange);
  background: #fff1eb;
  color: #a8411e;
}

body.theme-neofuture .pro-field > span,
body.theme-neofuture .pro-field-label,
body.theme-neofuture .pro-range-head,
body.theme-neofuture .pro-toggle-row {
  color: var(--work-text-soft);
}

body.theme-neofuture .pro-node-card > strong,
body.theme-neofuture .pro-stage-title strong,
body.theme-neofuture .pro-inspector-head-line strong,
body.theme-neofuture .pro-project-fact strong {
  color: var(--work-text);
}

body.theme-neofuture .pro-node-value,
body.theme-neofuture .pro-stage-title span,
body.theme-neofuture .pro-inspector-head-line span,
body.theme-neofuture .pro-project-fact span {
  color: var(--work-muted);
}

body.theme-neofuture .pro-inspector-note {
  border-left-color: var(--work-cyan);
  background: #edf9fb;
  color: #3a6570;
}

/* Light scroll surfaces keep long work sessions legible. */
body.theme-neofuture * {
  scrollbar-color: #9fb3c1 #edf2f5;
}

body.theme-neofuture *::-webkit-scrollbar-track {
  background: #edf2f5;
}

body.theme-neofuture *::-webkit-scrollbar-thumb {
  border-color: #edf2f5;
  background: #9fb3c1;
}

body.theme-neofuture .app-header *::-webkit-scrollbar-track {
  background: #0b1017;
}

body.theme-neofuture .app-header *::-webkit-scrollbar-thumb {
  border-color: #0b1017;
  background: #33424e;
}

/* Cyber-anime atmosphere without wallpaper grids. */
body.theme-neofuture {
  background-image: none !important;
}

body.theme-neofuture::after {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 64px 0 0;
  pointer-events: none;
  background:
    linear-gradient(118deg, transparent 0 68%, rgba(8, 127, 153, .055) 68% 68.18%, transparent 68.18%),
    linear-gradient(62deg, transparent 0 81%, rgba(189, 63, 122, .045) 81% 81.14%, transparent 81.14%),
    linear-gradient(154deg, transparent 0 89%, rgba(223, 91, 46, .05) 89% 89.16%, transparent 89.16%);
}

body.theme-neofuture #app {
  position: relative;
  z-index: 1;
}

body.theme-neofuture .neo-ambient-field {
  position: fixed;
  z-index: 30;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .92;
}

body.theme-neofuture .app-body.studio-v5 > .panel-canvas,
body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
body.theme-neofuture .video-workspace.canvas-v5.library-mode {
  background-color: rgba(228, 235, 242, .95);
  background-image: none;
}

body.theme-neofuture .video-quick-preview {
  background-color: #eaf0f5;
  background-image:
    linear-gradient(128deg, transparent 0 72%, rgba(8, 127, 153, .07) 72% 72.3%, transparent 72.3%),
    linear-gradient(52deg, transparent 0 86%, rgba(189, 63, 122, .05) 86% 86.2%, transparent 86.2%);
}

body.theme-neofuture .app-body.studio-v5 .studio-stage::before {
  background-image: none;
}

body.theme-neofuture .professional-workspace .pro-canvas-viewport,
body.theme-neofuture .pro-stage {
  background-size: 48px 48px;
  background-image:
    linear-gradient(rgba(8, 127, 153, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 127, 153, .075) 1px, transparent 1px);
}

body.theme-neofuture .app-body.studio-v5 .example-nav {
  min-width: 126px;
  height: 34px;
  display: grid;
  grid-template-columns: 28px minmax(58px, auto) 28px;
  align-items: center;
  padding: 3px;
  gap: 3px;
  border: 1px solid var(--work-line);
  border-radius: 5px;
  background: #eef3f7;
}

body.theme-neofuture .app-body.studio-v5 .example-page-btn {
  width: 28px;
  height: 26px;
  flex: 0 0 28px;
  border: 0;
  background: var(--work-surface);
  color: #4c6070;
}

body.theme-neofuture .app-body.studio-v5 .example-page-btn:hover {
  background: #dcecf1;
  color: #086f86;
}

body.theme-neofuture .app-body.studio-v5 .example-page-count {
  min-width: 58px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: var(--work-muted);
  font-size: 10px;
  font-weight: 720;
  white-space: nowrap;
}

body.theme-neofuture .app-body.studio-v5 .example-controls {
  grid-template-columns: minmax(126px, 1fr) 76px;
  gap: 5px;
}

body.theme-neofuture .example-page-count b {
  min-width: 17px;
  color: var(--work-cyan);
  font-size: 12px;
  font-weight: 880;
  text-align: right;
}

body.theme-neofuture .example-page-count i {
  color: #a1afba;
  font-style: normal;
}

body.theme-neofuture .example-page-count span {
  min-width: 17px;
  color: #5e7080;
  text-align: left;
}

body.theme-neofuture .example-carousel,
body.theme-neofuture .studio-workspace,
body.theme-neofuture .video-quick-stage,
body.theme-neofuture .video-library-toolbar,
body.theme-neofuture .professional-workspace .pro-canvas-viewport {
  position: relative;
}

body.theme-neofuture .example-carousel {
  box-shadow:
    0 12px 30px rgba(39, 58, 74, .1),
    0 0 0 1px rgba(8, 127, 153, .03);
}

@media (prefers-reduced-motion: no-preference) {
  body.theme-neofuture::after {
    animation: cyber-trace-shift 18s ease-in-out infinite alternate;
  }
}

@keyframes cyber-trace-shift {
  from { transform: translate3d(-1.5%, 0, 0); opacity: .62; }
  to { transform: translate3d(1.5%, -1%, 0); opacity: 1; }
}

@media (max-width: 760px) {
  body.theme-neofuture .neo-ambient-field {
    opacity: .58;
  }

  body.theme-neofuture::after {
    opacity: .55;
  }

  body.theme-neofuture .app-header {
    min-height: 96px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 34px 42px;
    gap: 6px;
  }

  body.theme-neofuture .app-header h1 {
    grid-column: 1;
    justify-self: start;
  }

  body.theme-neofuture .header-navigation {
    grid-column: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    overflow: visible;
  }

  body.theme-neofuture .workspace-switch,
  body.theme-neofuture .studio-mode-switch {
    grid-column: auto;
    grid-row: auto;
    width: 100%;
    min-width: 0;
  }

  body.theme-neofuture .app-body.studio-v5,
  body.theme-neofuture .video-workspace.canvas-v5.quick-mode,
  body.theme-neofuture .video-workspace.canvas-v5.library-mode {
    min-height: calc(100vh - 96px);
  }

  body.theme-neofuture .app-body.studio-v5 > .panel-left {
    order: 0;
    padding: 12px;
  }

  body.theme-neofuture .app-body.studio-v5 > .panel-canvas {
    order: 1;
  }

  body.theme-neofuture .app-body.studio-v5 > .panel-right {
    order: 2;
  }

  body.theme-neofuture .app-body.studio-v5 .asset-sidebar-head {
    margin-bottom: 8px;
    padding-bottom: 8px;
  }

  body.theme-neofuture .app-body.studio-v5 .example-carousel {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
  }

  body.theme-neofuture .app-body.studio-v5 .reference-pair,
  body.theme-neofuture .app-body.studio-v5 .example-visual {
    grid-row: 1 / 3;
    width: 128px;
    height: 150px;
    aspect-ratio: auto;
  }

  body.theme-neofuture .app-body.studio-v5 .example-copy {
    padding: 10px 10px 4px;
  }

  body.theme-neofuture .app-body.studio-v5 .example-copy p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  body.theme-neofuture .app-body.studio-v5 .example-controls {
    grid-column: 2;
    grid-template-columns: minmax(126px, 1fr) 76px;
    gap: 5px;
    padding: 4px 10px 9px;
  }

  body.theme-neofuture .app-body.studio-v5 .formal-case-thumbs {
    display: flex;
    grid-template-columns: none;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  body.theme-neofuture .app-body.studio-v5 .formal-case-thumbs > button {
    flex: 0 0 58px;
  }
}