/* V3.01: approved red-accent template studio. Decoration only; no canvas pixels. */
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace),
body[data-theme="tech"] .xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) {
  --xts-toolbar-gold: #e8c76a;
}

/* Same box sizes and one-screen layout; clearer outlines instead of extra borders. */
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-workspace > :is(.xhs-workbench, .xhs-studio-editor) {
  border-color: rgba(var(--ui-source-300bc116a948bc-rgb, 38, 38, 38), var(--ui-source-300bc116a948bc-alpha, 1));
  box-shadow: 0 0 0 1px rgba(var(--ui-source-29a963868a4458-rgb, 21, 21, 21), var(--ui-source-29a963868a4458-alpha, 0.55));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-editor-heading {
  box-shadow: inset 0 -1px 0 rgba(var(--ui-source-d0488fcb336a34-rgb, 21, 21, 21), var(--ui-source-d0488fcb336a34-alpha, 0.7));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) :is(.xhs-studio-tool-tabs, .xhs-page-manager, .xhs-studio-editor-footer, .xhs-studio-assets-section, .xhs-studio-secondary-tools) {
  border-color: rgba(var(--ui-source-ef15c1baae4d21-rgb, 21, 21, 21), var(--ui-source-ef15c1baae4d21-alpha, 0.65));
}
/* Black/gold action strip. The red AI action and other red selections stay red. */
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actionbar {
  border-color: rgba(var(--ui-source-beb089ec1fb3f4-rgb, 21, 21, 21), var(--ui-source-beb089ec1fb3f4-alpha, 1));
  background: linear-gradient(115deg, rgba(var(--ui-source-7dcb7509f83bc7-rgb, 21, 21, 21), var(--ui-source-7dcb7509f83bc7-alpha, 1)), rgba(var(--ui-source-61b90c291242f4-rgb, 39, 39, 39), var(--ui-source-61b90c291242f4-alpha, 1)) 62%, rgba(var(--ui-source-f35eef36490bde-rgb, 25, 25, 25), var(--ui-source-f35eef36490bde-alpha, 1)));
  box-shadow: 0 0 0 1px rgba(var(--ui-source-c1c74e8bd50e11-rgb, 21, 21, 21), var(--ui-source-c1c74e8bd50e11-alpha, 0.3));
  color: rgba(var(--ui-source-f08f174ca3fec8-rgb, 232, 199, 106), var(--ui-source-f08f174ca3fec8-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actionbar :is(.xhs-studio-current-title, .xhs-studio-version) {
  color: rgba(var(--ui-source-f08f174ca3fec8-rgb, 232, 199, 106), var(--ui-source-f08f174ca3fec8-alpha, 1));
  caret-color: rgba(var(--ui-source-06fee775d16413-rgb, 232, 199, 106), var(--ui-source-06fee775d16413-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-current-title[contenteditable]:focus {
  background: rgba(var(--ui-source-b83f168c89af96-rgb, 48, 40, 42), var(--ui-source-b83f168c89af96-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actionbar .xhs-studio-save-state {
  color: rgba(var(--ui-source-b9817e3f994886-rgb, 227, 227, 227), var(--ui-source-b9817e3f994886-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actionbar .xhs-template-status.draft {
  background: rgba(var(--ui-source-cf906c72ef9cbc-rgb, 240, 211, 117), var(--ui-source-cf906c72ef9cbc-alpha, 1));
  color: rgba(var(--ui-source-5046a2309dc508-rgb, 21, 21, 21), var(--ui-source-5046a2309dc508-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actionbar .xhs-template-status.locked {
  background: rgba(var(--ui-source-019ca76e01de32-rgb, 65, 65, 65), var(--ui-source-019ca76e01de32-alpha, 1));
  color: rgba(var(--ui-source-348bce17ee89b4-rgb, 240, 211, 117), var(--ui-source-348bce17ee89b4-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actions button:not(.xhs-studio-primary):not([data-ai-preview-button]) {
  border-color: rgba(var(--ui-source-b6aeb343f3c011-rgb, 232, 199, 106), var(--ui-source-b6aeb343f3c011-alpha, 0.65));
  background: rgba(var(--ui-source-ad90847e0be739-rgb, 32, 32, 32), var(--ui-source-ad90847e0be739-alpha, 1));
  color: rgba(var(--ui-source-1c8d9accf49ad7-rgb, 232, 199, 106), var(--ui-source-1c8d9accf49ad7-alpha, 1));
}
.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-actions button:not(.xhs-studio-primary):not([data-ai-preview-button]):hover:not(:disabled) {
  border-color: rgba(var(--ui-source-c0b6a139ead073-rgb, 232, 199, 106), var(--ui-source-c0b6a139ead073-alpha, 1));
  background: rgba(var(--ui-source-469e78ce1fe666-rgb, 48, 43, 33), var(--ui-source-469e78ce1fe666-alpha, 1));
  color: rgba(var(--ui-source-71005ffffeb3b6-rgb, 232, 199, 106), var(--ui-source-71005ffffeb3b6-alpha, 1));
}
.app-shell:has(> .main > .xhs-note-studio > .xhs-template-studio-workbench:not(.xhs-background-library-workspace)) > .sidebar [data-sidebar-menu-key="xhsCreate"].active {
  border-color: rgba(var(--ui-source-17fba5dadc140f-rgb, 255, 36, 66), var(--ui-source-17fba5dadc140f-alpha, 1));
  background: rgba(var(--ui-source-62b0b03507d986-rgb, 255, 36, 66), var(--ui-source-62b0b03507d986-alpha, 1));
  color: rgba(var(--ui-source-7fca0ab2055083-rgb, 255, 255, 255), var(--ui-source-7fca0ab2055083-alpha, 1));
  box-shadow: 0 3px 12px rgba(var(--ui-source-469ef69fe44a6b-rgb, 255, 36, 66), var(--ui-source-469ef69fe44a6b-alpha, 0.18));
}

/* V3.04: One compact operation row per layer, confined to the studio layer list. */
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-list-compact > .xhs-layer-compact-row {
  grid-template-columns: 18px minmax(0, 1fr) 82px 36px;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 5px 7px;
  cursor: pointer;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row:focus-visible {
  outline: 2px solid rgba(var(--ui-source-547f0e5046af01-rgb, 237, 63, 89), var(--ui-source-547f0e5046af01-alpha, 1));
  outline-offset: 1px;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > .xhs-layer-index {
  min-height: 0;
  padding: 0;
  font-size: 11px;
  font-weight: 400;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > .xhs-layer-inline-name {
  display: block;
  min-height: 0;
  padding: 0;
  border: 0;
  color: inherit;
  font-size: 12px;
  line-height: 1.4;
  cursor: inherit;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > input.xhs-layer-name-editor {
  width: 100%;
  min-width: 0;
  min-height: 28px;
  padding: 3px 5px;
  border: 1px solid rgba(var(--ui-source-14d62d888f083a-rgb, 237, 63, 89), var(--ui-source-14d62d888f083a-alpha, 1));
  background: rgba(var(--ui-source-f8f7c0b315bb50-rgb, 255, 255, 255), var(--ui-source-f8f7c0b315bb50-alpha, 1));
  outline: none;
  cursor: text;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > .xhs-layer-ai-mode {
  min-width: 0;
  padding: 3px 5px;
  color: rgba(var(--ui-source-802f84a3d366ee-rgb, 38, 50, 60), var(--ui-source-802f84a3d366ee-alpha, 1));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > .xhs-layer-kind {
  padding: 0;
  text-align: center;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-layer-section .xhs-layer-compact-row > .xhs-layer-delete {
  min-width: 0;
  width: 100%;
  padding: 4px 3px;
}

/* V3.03: Rednote red applies only to the template-library preview hint strip. */
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) > .xhs-studio-workspace > .xhs-template-library > .xhs-settings-template-section > footer.xhs-template-library-footer {
  background: rgba(var(--ui-source-28e7eca15768ac-rgb, 255, 36, 66), var(--ui-source-28e7eca15768ac-alpha, 1));
  color: rgba(var(--ui-source-ee13f688c7d66c-rgb, 255, 255, 255), var(--ui-source-ee13f688c7d66c-alpha, 1));
  border-top-color: rgba(var(--ui-source-568ab35d9c12f9-rgb, 255, 36, 66), var(--ui-source-568ab35d9c12f9-alpha, 1));
}

/* V3.02: Rednote styling is confined to the existing canvas-background region. */
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-design-tools > .xhs-studio-assets-section {
  border-top-color: rgba(var(--ui-source-dd3499475a3bed-rgb, 255, 36, 66), var(--ui-source-dd3499475a3bed-alpha, 1));
  background: linear-gradient(135deg, rgba(var(--ui-source-6ddfa2058ddd8a-rgb, 255, 249, 251), var(--ui-source-6ddfa2058ddd8a-alpha, 1)), rgba(var(--ui-source-2de6ff2fcc338e-rgb, 255, 240, 244), var(--ui-source-2de6ff2fcc338e-alpha, 1)) 60%, rgba(var(--ui-source-2d60a910fb4ecf-rgb, 255, 247, 249), var(--ui-source-2d60a910fb4ecf-alpha, 1)));
  box-shadow: inset 3px 0 0 rgba(var(--ui-source-92f7421fd41497-rgb, 255, 36, 66), var(--ui-source-92f7421fd41497-alpha, 0.12));
  color: rgba(var(--ui-source-3cf635fd05b0da-rgb, 68, 35, 45), var(--ui-source-3cf635fd05b0da-alpha, 1));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section > .xhs-property-section {
  background: transparent;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section > .xhs-studio-background-heading {
  position: relative;
  color: rgba(var(--ui-source-83bb27d1078683-rgb, 207, 28, 60), var(--ui-source-83bb27d1078683-alpha, 1));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section > .xhs-studio-background-heading::after {
  content: "小红书";
  position: absolute;
  top: 0;
  right: 0;
  padding: 2px 6px;
  border: 1px solid rgba(var(--ui-source-1becc0b483d548-rgb, 255, 193, 205), var(--ui-source-1becc0b483d548-alpha, 1));
  border-radius: 5px;
  background: rgba(var(--ui-source-9892610e70c656-rgb, 255, 229, 235), var(--ui-source-9892610e70c656-alpha, 1));
  color: rgba(var(--ui-source-cf4f91add75436-rgb, 200, 34, 66), var(--ui-source-cf4f91add75436-alpha, 1));
  font-size: 9px;
  line-height: 1.3;
  font-weight: 600;
  pointer-events: none;
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section .xhs-page-background-grid > label > span {
  color: rgba(var(--ui-source-6838a2d77b2604-rgb, 146, 89, 102), var(--ui-source-6838a2d77b2604-alpha, 1));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section .xhs-page-background-grid input[type="color"],
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section :is(.xhs-background-library-entry, .xhs-upload-row > label.xhs-file-button) {
  border-color: rgba(var(--ui-source-45491bc83baa97-rgb, 241, 166, 182), var(--ui-source-45491bc83baa97-alpha, 1));
  background: rgba(var(--ui-source-f8f7c0b315bb50-rgb, 255, 255, 255), var(--ui-source-f8f7c0b315bb50-alpha, 1));
  color: rgba(var(--ui-source-ead8ed55202c80-rgb, 186, 33, 64), var(--ui-source-ead8ed55202c80-alpha, 1));
  box-shadow: 0 2px 6px rgba(var(--ui-source-3fb6e011bbf308-rgb, 210, 33, 65), var(--ui-source-3fb6e011bbf308-alpha, 0.04));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section .xhs-upload-row > .xhs-ai-background-button {
  border-color: rgba(var(--ui-source-dd3499475a3bed-rgb, 255, 36, 66), var(--ui-source-dd3499475a3bed-alpha, 1));
  background: linear-gradient(110deg, rgba(var(--ui-source-28e7eca15768ac-rgb, 255, 36, 66), var(--ui-source-28e7eca15768ac-alpha, 1)), rgba(var(--ui-source-d5d83c6323cabb-rgb, 242, 60, 103), var(--ui-source-d5d83c6323cabb-alpha, 1)));
  color: rgba(var(--ui-source-ee13f688c7d66c-rgb, 255, 255, 255), var(--ui-source-ee13f688c7d66c-alpha, 1));
  box-shadow: 0 3px 9px rgba(var(--ui-source-469ef69fe44a6b-rgb, 255, 36, 66), var(--ui-source-469ef69fe44a6b-alpha, 0.18));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section :is(.xhs-background-library-entry:hover:not(:disabled), .xhs-upload-row > label.xhs-file-button:not(:has(> input:disabled)):hover) {
  border-color: rgba(var(--ui-source-dd3499475a3bed-rgb, 255, 36, 66), var(--ui-source-dd3499475a3bed-alpha, 1));
  background: rgba(var(--ui-source-95c5da3a1e0ba8-rgb, 255, 243, 246), var(--ui-source-95c5da3a1e0ba8-alpha, 1));
  color: rgba(var(--ui-source-9d86b8ac2e6791-rgb, 188, 25, 57), var(--ui-source-9d86b8ac2e6791-alpha, 1));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section .xhs-upload-row > .xhs-ai-background-button:hover:not(:disabled) {
  border-color: rgba(var(--ui-source-36c18d3cc84b41-rgb, 232, 28, 57), var(--ui-source-36c18d3cc84b41-alpha, 1));
  background: linear-gradient(110deg, rgba(var(--ui-source-d33135a8c9af54-rgb, 237, 25, 56), var(--ui-source-d33135a8c9af54-alpha, 1)), rgba(var(--ui-source-417720042be43f-rgb, 230, 47, 91), var(--ui-source-417720042be43f-alpha, 1)));
  color: rgba(var(--ui-source-ee13f688c7d66c-rgb, 255, 255, 255), var(--ui-source-ee13f688c7d66c-alpha, 1));
  box-shadow: 0 4px 12px rgba(var(--ui-source-023fa2a6c85167-rgb, 255, 36, 66), var(--ui-source-023fa2a6c85167-alpha, 0.25));
}
.xhs-minimal-editor.xhs-template-studio-workbench:not(.xhs-background-library-workspace) .xhs-studio-assets-section :is(button:focus-visible, label.xhs-file-button:focus-within) {
  outline-color: rgba(var(--ui-source-335810b040fdf8-rgb, 255, 36, 66), var(--ui-source-335810b040fdf8-alpha, 1));
}

/* The two whole perimeters share a single 8-second sequence. No hit-test layer. */
.xhs-template-studio-workbench .xhs-studio-editor .xhs-studio-canvas-reference > .xhs-reference-panel-compare > .xhs-reference-frame:has(> img),
.xhs-template-studio-workbench .xhs-studio-editor .xhs-template-canvas-layout > .xhs-canvas-frame > .xhs-canvas-shell {
  outline: clamp(2px, .45cqw, 4px) solid #151515;
  outline-offset: 2px;
  border-radius: 2px;
  animation: xhs-studio-synchronized-edge-breath 8s ease-in-out infinite;
}
@keyframes xhs-studio-synchronized-edge-breath {
  0%, 100% {
    outline-color: rgba(var(--ui-source-04a691ab283222-rgb, 21, 21, 21), var(--ui-source-04a691ab283222-alpha, 1));
    box-shadow: 0 0 4px 1px rgba(var(--ui-source-26aa5ee5f54695-rgb, 21, 21, 21), var(--ui-source-26aa5ee5f54695-alpha, 0.24)), 0 0 12px 2px rgba(var(--ui-source-71aa420e63bbd6-rgb, 21, 21, 21), var(--ui-source-71aa420e63bbd6-alpha, 0.1)), 0 12px 28px rgba(var(--ui-source-9fcf41985216b6-rgb, 30, 44, 66), var(--ui-source-9fcf41985216b6-alpha, 0.09));
  }
  25%, 75% {
    outline-color: rgba(var(--ui-source-dd3499475a3bed-rgb, 255, 36, 66), var(--ui-source-dd3499475a3bed-alpha, 1));
    box-shadow: 0 0 7px 1px rgba(var(--ui-source-f3843832b6bc2e-rgb, 255, 36, 66), var(--ui-source-f3843832b6bc2e-alpha, 0.44)), 0 0 18px 3px rgba(var(--ui-source-53155527aa029d-rgb, 255, 36, 66), var(--ui-source-53155527aa029d-alpha, 0.2)), 0 12px 28px rgba(var(--ui-source-9fcf41985216b6-rgb, 30, 44, 66), var(--ui-source-9fcf41985216b6-alpha, 0.09));
  }
  50% {
    outline-color: rgba(var(--ui-source-93aa6b822a4283-rgb, 32, 184, 117), var(--ui-source-93aa6b822a4283-alpha, 1));
    box-shadow: 0 0 7px 1px rgba(var(--ui-source-895cc1703fbe3f-rgb, 32, 184, 117), var(--ui-source-895cc1703fbe3f-alpha, 0.44)), 0 0 18px 3px rgba(var(--ui-source-6fdc033e25cd38-rgb, 32, 184, 117), var(--ui-source-6fdc033e25cd38-alpha, 0.2)), 0 12px 28px rgba(var(--ui-source-9fcf41985216b6-rgb, 30, 44, 66), var(--ui-source-9fcf41985216b6-alpha, 0.09));
  }
}
@media (prefers-reduced-motion: reduce) {
  .xhs-template-studio-workbench .xhs-studio-editor .xhs-studio-canvas-reference > .xhs-reference-panel-compare > .xhs-reference-frame:has(> img),
  .xhs-template-studio-workbench .xhs-studio-editor .xhs-template-canvas-layout > .xhs-canvas-frame > .xhs-canvas-shell {
    animation: none;
    outline-color: #151515;
    box-shadow: 0 0 4px 1px rgba(21, 21, 21, .24), 0 12px 28px rgba(30, 44, 66, .09);
  }
}
@media print {
  .xhs-template-studio-workbench .xhs-studio-editor .xhs-studio-canvas-reference > .xhs-reference-panel-compare > .xhs-reference-frame,
  .xhs-template-studio-workbench .xhs-studio-editor .xhs-template-canvas-layout > .xhs-canvas-frame > .xhs-canvas-shell {
    animation: none !important;
    outline: none;
    box-shadow: none;
  }
}