/* R44: default-state legibility and connection visibility.
   Visual-only overrides: no node geometry, routing or business state changes. */

html,
body,
button,
input,
select,
textarea {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  text-rendering: geometricPrecision;
  font-kerning: normal;
}

/* Animated filter/brightness on the whole control rasterised its text. Keep
   the moving liquid background, but render the label in a stable text layer. */
button,
[role="button"] {
  filter: none !important;
}

.quiet-header *,
.graph-node *,
.result-card *,
.floating-toolbar *,
.history-panel *,
.account-panel *,
.portable-settings-panel *,
.portable-setup-panel *,
.canvas-context-menu *,
.yz-assistant-panel *,
.yz-cutout-dialog *,
.yz-cutout-node *,
.yz-region-dialog *,
.yz-guest-permissions-modal *,
.yz-upscale-modal *,
.yz-local-edit-dialog * {
  text-shadow: none !important;
}

button:not(:disabled),
input:not(:disabled),
select:not(:disabled),
textarea:not(:disabled),
[role="button"]:not([aria-disabled="true"]) {
  opacity: 1 !important;
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
[aria-disabled="true"] {
  opacity: .66;
}

/* Light theme: clear default hierarchy, including unselected states. */
.quiet-header,
.graph-node,
.result-card,
.floating-toolbar,
.history-panel,
.account-panel,
.portable-settings-panel,
.portable-setup-panel,
.canvas-context-menu,
.yz-assistant-panel,
.yz-cutout-dialog,
.yz-cutout-node,
.yz-region-dialog,
.yz-guest-permissions-modal,
.yz-upscale-modal,
.yz-local-edit-dialog {
  color: #20242b;
}

.project-name,
.signed-user,
.api-ready,
.canvas-tip,
.task-summary,
.control-row,
.task-card-summary,
.task-card-row-label,
.mode-tabs button:not(.active),
.choice-group button:not(.selected),
.result-card footer,
.empty-result,
.history-panel small,
.account-panel small,
.portable-settings-panel label span,
.yz-assistant-panel small,
.yz-assistant-tabs button:not(.active),
.yz-cutout-dialog small,
.yz-cutout-dialog p,
.yz-cutout-dialog label,
.yz-region-dialog small,
.yz-guest-permissions-modal small {
  color: #555d68 !important;
  opacity: 1 !important;
}

input::placeholder,
textarea::placeholder {
  color: #68717e !important;
  opacity: 1 !important;
}

.clean-node > header span,
.task-node > header span,
.task-card-title,
.result-card strong,
.account-panel strong,
.portable-settings-panel strong,
.yz-assistant-panel strong,
.yz-cutout-dialog strong,
.yz-region-dialog strong,
.yz-guest-permissions-modal strong {
  color: #171b22;
}

.quiet-header { font-size: 12px; }
.quiet-brand strong,
.signed-user b,
.header-actions > button { font-size: 11px; }
.signed-user i { font-size: 9px; }
.task-summary,
.control-row,
.mode-tabs button,
.choice-group button,
.control-row select { font-size: 11px; }
.primary-run { font-size: 13px; }
.result-card footer,
.empty-result small,
.image-input-card footer span { font-size: 10px; }
.result-card footer button,
.floating-toolbar button,
.canvas-tip,
.history-panel small,
.account-panel small { font-size: 10px; }

/* Selected controls remain high contrast without a softened label layer. */
.mode-tabs button.active,
.choice-group button.selected,
.primary-run,
.yz-spectrum-button,
.yz-assistant-send,
.yz-task-mode.active,
.yz-task-choice.selected {
  color: #fff !important;
  font-weight: 650;
}

/* Dark theme: increase all enabled foreground contrast without changing the
   panels' existing dark palette. */
html[data-yz-theme="dark"] .quiet-header,
html[data-yz-theme="dark"] .graph-node,
html[data-yz-theme="dark"] .result-card,
html[data-yz-theme="dark"] .floating-toolbar,
html[data-yz-theme="dark"] .history-panel,
html[data-yz-theme="dark"] .account-panel,
html[data-yz-theme="dark"] .portable-settings-panel,
html[data-yz-theme="dark"] .canvas-context-menu,
html[data-yz-theme="dark"] .yz-assistant-panel,
html[data-yz-theme="dark"] .yz-cutout-dialog,
html[data-yz-theme="dark"] .yz-cutout-node,
html[data-yz-theme="dark"] .yz-region-dialog,
html[data-yz-theme="dark"] .yz-guest-permissions-modal,
html[data-yz-theme="dark"] .yz-upscale-modal,
html[data-yz-theme="dark"] .yz-local-edit-dialog {
  color: #f4f6fb;
}

html[data-yz-theme="dark"] .project-name,
html[data-yz-theme="dark"] .signed-user,
html[data-yz-theme="dark"] .api-ready,
html[data-yz-theme="dark"] .canvas-tip,
html[data-yz-theme="dark"] .task-summary,
html[data-yz-theme="dark"] .control-row,
html[data-yz-theme="dark"] .task-card-summary,
html[data-yz-theme="dark"] .task-card-row-label,
html[data-yz-theme="dark"] .mode-tabs button:not(.active),
html[data-yz-theme="dark"] .choice-group button:not(.selected),
html[data-yz-theme="dark"] .result-card footer,
html[data-yz-theme="dark"] .empty-result,
html[data-yz-theme="dark"] .history-panel small,
html[data-yz-theme="dark"] .account-panel small,
html[data-yz-theme="dark"] .portable-settings-panel label span,
html[data-yz-theme="dark"] .yz-assistant-panel small,
html[data-yz-theme="dark"] .yz-assistant-tabs button:not(.active),
html[data-yz-theme="dark"] .yz-cutout-dialog small,
html[data-yz-theme="dark"] .yz-cutout-dialog p,
html[data-yz-theme="dark"] .yz-cutout-dialog label,
html[data-yz-theme="dark"] .yz-region-dialog small,
html[data-yz-theme="dark"] .yz-guest-permissions-modal small {
  color: #cbd2de !important;
  opacity: 1 !important;
}

html[data-yz-theme="dark"] input::placeholder,
html[data-yz-theme="dark"] textarea::placeholder {
  color: #aeb8c8 !important;
}

html[data-yz-theme="dark"] .clean-node > header span,
html[data-yz-theme="dark"] .task-node > header span,
html[data-yz-theme="dark"] .task-card-title,
html[data-yz-theme="dark"] .result-card strong,
html[data-yz-theme="dark"] .account-panel strong,
html[data-yz-theme="dark"] .portable-settings-panel strong,
html[data-yz-theme="dark"] .yz-assistant-panel strong,
html[data-yz-theme="dark"] .yz-cutout-dialog strong,
html[data-yz-theme="dark"] .yz-region-dialog strong,
html[data-yz-theme="dark"] .yz-guest-permissions-modal strong {
  color: #f7f8fc;
}

/* Stable, high-contrast connection rendering at any zoom/DPR. */
.thin-connections .yz-flow-wire-base {
  stroke-width: 1.9px;
  opacity: .94;
  shape-rendering: geometricPrecision;
  vector-effect: non-scaling-stroke;
}

.thin-connections .yz-flow-wire-pulse {
  stroke-width: 2.35px;
  opacity: 1;
  shape-rendering: geometricPrecision;
}

.thin-connections .active-wire {
  stroke-width: 2.1px;
  opacity: 1;
  shape-rendering: geometricPrecision;
}

.output-pin,
.input-pin,
.task-input-handle,
.connect-handle,
.yz-cutout-input-pin,
.yz-cutout-output-pin {
  background: #fff;
  border-color: #565e69;
  box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(71, 80, 94, .28);
}

.task-input-handle.accepts-reference,
.input-pin.accepts-reference {
  background: #fff;
  border-color: #7856f4;
  box-shadow: 0 0 0 1px #fff, 0 0 0 4px rgba(120, 86, 244, .25);
}

html[data-yz-theme="dark"] .output-pin,
html[data-yz-theme="dark"] .input-pin,
html[data-yz-theme="dark"] .task-input-handle,
html[data-yz-theme="dark"] .connect-handle,
html[data-yz-theme="dark"] .yz-cutout-input-pin,
html[data-yz-theme="dark"] .yz-cutout-output-pin {
  background: #f9fbff;
  border-color: #5f6878;
  box-shadow: 0 0 0 1px #111722, 0 0 0 3px rgba(214, 223, 240, .42);
}

html[data-yz-theme="dark"] .task-input-handle.accepts-reference,
html[data-yz-theme="dark"] .input-pin.accepts-reference {
  border-color: #a587ff;
  box-shadow: 0 0 0 1px #111722, 0 0 0 4px rgba(165, 135, 255, .4);
}

.yz-cutout-wires path {
  stroke-width: 2.25px;
  opacity: .9;
  shape-rendering: geometricPrecision;
  vector-effect: non-scaling-stroke;
}

.yz-cutout-wires path.active {
  stroke-width: 2.65px;
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .thin-connections .yz-flow-wire-pulse {
    opacity: .94;
    stroke-dasharray: none;
  }
}