html[data-home-theme="editorial"][data-home-motion="enhanced"] {
  --editorial-control: #ad4b29;
  --editorial-control-hover: #af4b29;
  --editorial-control-text: #fff9f4;
  --editorial-raised: linear-gradient(180deg, rgba(18, 21, 18, 0.98), rgba(8, 11, 9, 0.98));
  --editorial-shadow-raised: inset 0 1px 0 rgba(255, 244, 232, 0.04), 0 16px 38px rgba(0, 0, 0, 0.24);
  --editorial-shadow-control: inset 0 1px 0 rgba(255, 244, 232, 0.12), inset 0 -2px 0 rgba(43, 16, 8, 0.42), 0 10px 24px rgba(0, 0, 0, 0.28);
  --process-cycle: 8.4s;
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] header {
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.2);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-open {
  border-color: rgba(128, 89, 65, 0.82);
  background: linear-gradient(180deg, rgba(20, 22, 19, 0.9), rgba(7, 9, 8, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.04), 0 7px 18px rgba(0, 0, 0, 0.2);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #appState[data-state="busy"] {
  color: #c78058;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #appState.error {
  color: #c77d74;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-title-shine {
  color: var(--editorial-text-strong);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions button {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  transition: border-color 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode {
  color: var(--editorial-control-text);
  border-color: #c86b48;
  background: linear-gradient(180deg, #b3512d 0%, var(--editorial-control) 62%, #943d22 100%);
  box-shadow: var(--editorial-shadow-control);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(108deg, transparent 26%, rgba(255, 244, 232, 0.16) 48%, transparent 70%);
  opacity: 0;
  transform: translate3d(-115%, 0, 0);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startAiMode {
  border-color: #70675d;
  background: var(--editorial-raised);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.055), inset 0 -1px 0 rgba(0, 0, 0, 0.72), 0 10px 24px rgba(0, 0, 0, 0.22);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-process--motion {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: rgba(3, 5, 4, 0.2);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.025);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage {
  position: relative;
  isolation: isolate;
  contain: layout paint;
  overflow: hidden;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__base,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__base img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__base img {
  filter: none;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  filter: brightness(1.03) saturate(1.05) contrast(1.08);
  will-change: opacity;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--input {
  --phase-to: inset(0 58% 0 0);
  -webkit-mask-image: linear-gradient(to right, #000 0 36%, transparent 40%);
  mask-image: linear-gradient(to right, #000 0 36%, transparent 40%);
  clip-path: var(--phase-to);
  animation: process-phase-input var(--process-cycle) var(--motion-ease) infinite both;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--recognition {
  --phase-to: inset(0 25% 0 26%);
  -webkit-mask-image: linear-gradient(to right, transparent 28%, #000 32% 68%, transparent 73%);
  mask-image: linear-gradient(to right, transparent 28%, #000 32% 68%, transparent 73%);
  clip-path: var(--phase-to);
  animation: process-phase-recognition var(--process-cycle) var(--motion-ease) infinite both;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--structure {
  --phase-to: inset(0 0 0 66%);
  -webkit-mask-image: linear-gradient(to right, transparent 69%, #000 74% 100%);
  mask-image: linear-gradient(to right, transparent 69%, #000 74% 100%);
  clip-path: var(--phase-to);
  animation: process-phase-structure var(--process-cycle) var(--motion-ease) infinite both;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] main#workflowShell aside,
html[data-home-theme="editorial"][data-home-motion="enhanced"] main#workflowShell section,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-card {
  border-radius: 5px;
  background: var(--editorial-raised);
  box-shadow: var(--editorial-shadow-raised);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .workflow-bar {
  box-shadow: none;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .stepper {
  background: rgba(3, 5, 4, 0.34);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.025), 0 9px 24px rgba(0, 0, 0, 0.14);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .step-item.active {
  background: linear-gradient(180deg, rgba(185, 86, 47, 0.15), rgba(185, 86, 47, 0.06));
  box-shadow: inset 0 1px 0 rgba(255, 225, 205, 0.04);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] select,
html[data-home-theme="editorial"][data-home-motion="enhanced"] textarea,
html[data-home-theme="editorial"][data-home-motion="enhanced"] input[type="file"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] input[type="password"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] input[type="text"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] input[type="number"] {
  border-radius: 4px;
  background: linear-gradient(180deg, #10130f, #0b0e0c);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.028), inset 0 2px 8px rgba(0, 0, 0, 0.3);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] button {
  border-radius: 4px;
  color: var(--editorial-control-text);
  border-color: #c86b48;
  background: linear-gradient(180deg, #b3512d 0%, var(--editorial-control) 64%, #943d22 100%);
  box-shadow: var(--editorial-shadow-control);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] button.secondary,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-feedback-button,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-close,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .resume-banner button,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .image-item button {
  border-color: #5f5a52;
  background: var(--editorial-raised);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.045), inset 0 -1px 0 rgba(0, 0, 0, 0.62), 0 7px 18px rgba(0, 0, 0, 0.18);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #aiButton,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #parseButton,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #specRecognizeBtn {
  color: var(--editorial-control-text);
  border-color: #c86b48;
  background: linear-gradient(180deg, #b3512d 0%, var(--editorial-control) 64%, #943d22 100%);
  box-shadow: var(--editorial-shadow-control);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .metrics,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-identity,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-preview-box,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .preview {
  border-radius: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.025), 0 12px 28px rgba(0, 0, 0, 0.17);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] body.modal-open {
  overflow: hidden;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .step-panel.is-entering {
  animation: editorial-step-enter 190ms var(--motion-ease) both;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #templatePanel,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #aiPanel,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #inputPanel,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #resultPanel,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #outputPanel,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-card {
  transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #templatePanel:focus-within,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #aiPanel:focus-within,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #inputPanel:focus-within,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #resultPanel:focus-within,
html[data-home-theme="editorial"][data-home-motion="enhanced"] #outputPanel:focus-within,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-card:focus-within {
  border-color: rgba(178, 112, 76, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.055), inset 0 0 0 1px rgba(178, 112, 76, 0.08), 0 18px 42px rgba(0, 0, 0, 0.24);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #aiPanel[aria-busy="true"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] #inputPanel[aria-busy="true"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] #resultPanel[aria-busy="true"],
html[data-home-theme="editorial"][data-home-motion="enhanced"] #outputPanel[aria-busy="true"] {
  border-color: rgba(200, 107, 72, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.06), inset 0 0 0 1px rgba(200, 107, 72, 0.1), 0 18px 42px rgba(0, 0, 0, 0.24);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #inputPanel.is-dragover {
  border-color: #c77750;
  background: #15130f;
  box-shadow: inset 0 0 0 1px rgba(214, 129, 86, 0.18), inset 0 1px 18px rgba(185, 86, 47, 0.08), 0 18px 42px rgba(0, 0, 0, 0.24);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] #inputPanel.has-file input[type="file"] {
  border-color: rgba(101, 151, 108, 0.86);
  box-shadow: inset 0 0 0 1px rgba(101, 151, 108, 0.08);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-preview-box img {
  transform-origin: center top;
  animation: editorial-preview-enter 220ms var(--motion-ease) both;
  transition: transform 220ms var(--motion-ease), border-color 180ms ease, box-shadow 220ms ease;
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .progress-wrap.active {
  box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.025);
}

html[data-home-theme="editorial"][data-home-motion="enhanced"] .progress-wrap.active .progress-bar {
  box-shadow: 0 0 12px rgba(185, 86, 47, 0.24);
}

@media (hover: hover) and (pointer: fine) {
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode:hover,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] button:hover {
    border-color: #dc805b;
    background: linear-gradient(180deg, #b3512d 0%, var(--editorial-control-hover) 64%, #943d22 100%);
    box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.16), inset 0 -2px 0 rgba(43, 16, 8, 0.38), 0 14px 30px rgba(0, 0, 0, 0.32);
    transform: translateY(-2px);
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode:hover::after,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode:focus-visible::after {
    opacity: 1;
    transform: translate3d(115%, 0, 0);
    transition: opacity 120ms ease, transform 720ms var(--motion-ease);
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startAiMode:hover,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] button.secondary:hover,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-feedback-button:hover,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .feedback-close:hover {
    border-color: #80634f;
    background: linear-gradient(180deg, #1a1c18, #0b0e0c);
    box-shadow: inset 0 1px 0 rgba(255, 244, 232, 0.065), 0 12px 26px rgba(0, 0, 0, 0.25);
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-preview-box img:hover {
    border-color: #c2a789;
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.46);
    transform: scale(1.012);
  }

}

html[data-home-theme="editorial"][data-home-motion="enhanced"] button:active,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startFormatMode:active,
html[data-home-theme="editorial"][data-home-motion="enhanced"] .landing-actions #startAiMode:active {
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 244, 232, 0.04);
  transform: translateY(1px);
}

@keyframes editorial-step-enter {
  from {
    opacity: 0.86;
    transform: translate3d(0, 6px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes editorial-preview-enter {
  from {
    opacity: 0.82;
    transform: translate3d(0, 4px, 0) scale(0.996);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes process-phase-input {
  0%, 4%, 38%, 100% { opacity: 0; }
  10% { opacity: 0.06; }
  17%, 28% { opacity: 0.18; }
  35% { opacity: 0.04; }
}

@keyframes process-phase-recognition {
  0%, 24%, 70%, 100% { opacity: 0; }
  31% { opacity: 0.07; }
  40%, 58% { opacity: 0.22; }
  66% { opacity: 0.04; }
}

@keyframes process-phase-structure {
  0%, 52%, 100% { opacity: 0; }
  60% { opacity: 0.06; }
  70%, 88% { opacity: 0.2; }
  95% { opacity: 0.04; }
}

@media (max-width: 680px) {
  html[data-home-theme="editorial"][data-home-motion="enhanced"] body {
    background-attachment: scroll;
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--input {
    --phase-to: inset(0 0 66% 0);
    -webkit-mask-image: linear-gradient(to bottom, #000 0 28%, transparent 32%);
    mask-image: linear-gradient(to bottom, #000 0 28%, transparent 32%);
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--recognition {
    --phase-to: inset(24% 0 28% 0);
    -webkit-mask-image: linear-gradient(to bottom, transparent 26%, #000 30% 64%, transparent 69%);
    mask-image: linear-gradient(to bottom, transparent 26%, #000 30% 64%, transparent 69%);
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase--structure {
    --phase-to: inset(55% 0 0 0);
    -webkit-mask-image: linear-gradient(to bottom, transparent 58%, #000 63% 100%);
    mask-image: linear-gradient(to bottom, transparent 58%, #000 63% 100%);
  }
}

@media (max-width: 640px) {
  html[data-home-theme="editorial"][data-home-motion="enhanced"] #appState {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@media (prefers-reduced-motion: reduce), (update: slow) {
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase {
    display: none !important;
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__base img {
    filter: none;
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .step-panel.is-entering,
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .template-preview-box img {
    animation: none !important;
  }
}

@media (forced-colors: active) {
  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__phase {
    display: none;
  }

  html[data-home-theme="editorial"][data-home-motion="enhanced"] .process-stage__base img {
    filter: none;
  }
}