:root {
  --brand: #007DB7;
  --accent: #00A5D2;
  --text-on-brand: #ffffff;
  --brand-font: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --sans-serif: var(--brand-font);
  --serif: var(--brand-font);
  --lh-copy: 1.45;
  --survey-page-font-size: 1rem;
  --survey-page-line-height: 1.55;
  --survey-page-heading-line-height: 1.18;
  --survey-page-heading-color: var(--theme-foreground, CanvasText);
  --survey-page-muted-color: color-mix(in srgb, var(--theme-foreground, CanvasText) 72%, transparent);
  --survey-management-control-height: 2.375rem;
  --survey-management-control-radius: 0.45rem;
  --survey-management-control-padding-x: 0.95rem;
  --survey-management-control-bg: var(--theme-background-alt, Canvas);
  --survey-management-control-border: color-mix(in srgb, var(--theme-foreground-alt, CanvasText) 18%, transparent);
  --survey-management-control-text: var(--theme-foreground, CanvasText);
  --survey-management-button-bg: var(--brand);
  --survey-management-button-bg-hover: color-mix(in srgb, var(--brand) 88%, black);
  --survey-management-button-border: color-mix(in srgb, var(--brand) 62%, var(--theme-foreground-alt, CanvasText) 16%);
  --survey-management-button-text: #ffffff;
  --survey-management-secondary-bg: color-mix(in srgb, var(--theme-background-alt, Canvas) 90%, var(--theme-foreground-alt, CanvasText) 10%);
  --survey-management-secondary-bg-hover: color-mix(in srgb, var(--theme-background-alt, Canvas) 82%, var(--theme-foreground-alt, CanvasText) 18%);
  --survey-management-secondary-border: color-mix(in srgb, var(--theme-foreground-alt, CanvasText) 22%, transparent);
  --survey-management-danger-bg: color-mix(in srgb, #e9532b 88%, var(--theme-background-alt, Canvas) 12%);
  --survey-management-danger-bg-hover: color-mix(in srgb, #e9532b 94%, black);
  --survey-management-danger-border: color-mix(in srgb, #e9532b 68%, transparent);
  --survey-management-focus-ring: color-mix(in srgb, var(--brand) 42%, white 58%);
  --survey-table-surface: var(--theme-background, Canvas);
  --survey-table-text: var(--theme-foreground, CanvasText);
  --survey-table-header-text: var(--theme-foreground, CanvasText);
  --survey-table-header-bg: var(--theme-background-alt, Canvas);
  --survey-table-header-border: var(--theme-foreground-fainter, var(--survey-management-control-border));
  --survey-table-cell-border: color-mix(
    in srgb,
    var(--theme-foreground, CanvasText) 12%,
    transparent
  );
  --survey-table-header-shadow: inset 0 -1px 0 var(--survey-table-header-border);
  --survey-table-font-size: 0.95rem;
  --survey-table-line-height: 1.4;
  --survey-table-cell-padding-block: 0.42rem;
  --survey-table-cell-padding-inline: 0.58rem;
  --survey-demo-shell-bg: var(--theme-background-alt, Canvas);
  --survey-demo-surface-bg: var(--theme-background, Canvas);
  --survey-demo-surface-text: var(--theme-foreground, CanvasText);
  --survey-demo-muted-text: color-mix(in srgb, var(--theme-foreground, CanvasText) 68%, transparent);
  --survey-demo-border: color-mix(in srgb, var(--theme-foreground, CanvasText) 14%, transparent);
  --survey-site-background-base: var(--theme-background, Canvas);
  --survey-site-background-image: url("./assets/backgrounds/landscape-alpine-fog.jpg");
  --survey-site-background-filter: grayscale(0.35) saturate(0.88) contrast(1.08);
}

@media (prefers-color-scheme: dark) {
  :root {
    --survey-page-muted-color: color-mix(in srgb, var(--theme-foreground, CanvasText) 78%, transparent);
    --survey-management-focus-ring: color-mix(in srgb, var(--accent) 46%, transparent);
    --survey-table-cell-border: color-mix(
      in srgb,
      var(--theme-foreground, CanvasText) 16%,
      transparent
    );
    --survey-site-background-filter: grayscale(0.62) saturate(0.78) contrast(1.16) brightness(0.72);
  }
}

html {
  min-height: 100%;
}

body,
.observablehq,
#observablehq-main,
#observablehq-root {
  color: var(--theme-foreground, CanvasText);
  font-family: var(--brand-font);
  font-size: var(--survey-page-font-size);
  line-height: var(--survey-page-line-height);
}

body {
  min-height: 100%;
}

body[data-survey-filler-mode="direct"] {
  margin: 0;
  min-height: 100vh;
}

body[data-survey-filler-mode="direct"] #observablehq-center,
body[data-survey-filler-mode="direct"] #observablehq-root,
body[data-survey-filler-mode="direct"] #observablehq-main {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}

body[data-survey-filler-mode="direct"] #observablehq-main > .observablehq--block,
body[data-survey-filler-mode="direct"] .survey-filler-runtime-block {
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}

body[data-survey-filler-mode="direct"] #observablehq-main > .observablehq--block:not(.survey-filler-runtime-block) {
  display: none !important;
}

body[data-survey-filler-mode="direct"] #observablehq-footer {
  display: none !important;
}

body[data-survey-filler-mode="direct"] .survey-filler-runtime,
body[data-survey-filler-mode="direct"] .survey-filler-host {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-height: 100vh;
  height: 100vh;
  margin: 0;
  padding: 0;
}

body[data-survey-filler-mode="direct"] .survey-filler-runtime > *,
body[data-survey-filler-mode="direct"] .survey-filler-host > * {
  margin-top: 0;
}

body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell,
body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell > header,
body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell > main,
body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell > footer {
  margin-top: 0 !important;
}

body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell {
  padding-top: 0 !important;
  border-top: 0 !important;
}

body[data-survey-filler-mode="direct"] .survey-filler-host--direct .survey-app-shell > style {
  display: none !important;
}

.survey-landscape-stack {
  --survey-landscape-stack-image: var(--survey-site-background-image);
  --survey-landscape-stack-filter: var(--survey-site-background-filter);
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--theme-background, Canvas) 94%, transparent), color-mix(in srgb, var(--theme-background, Canvas) 42%, transparent)),
    linear-gradient(145deg, color-mix(in srgb, var(--brand) 14%, transparent), transparent 66%),
    var(--survey-landscape-stack-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.survey-landscape-stack--alpine {
  --survey-landscape-stack-image: url("./assets/backgrounds/landscape-alpine-fog.jpg");
}

.survey-landscape-stack--forest {
  --survey-landscape-stack-image: url("./assets/backgrounds/landscape-forest-falls.jpg");
}

.survey-landscape-stack--desert {
  --survey-landscape-stack-image: url("./assets/backgrounds/landscape-desert-ridge.jpg");
}

.survey-landscape-stack--coast {
  --survey-landscape-stack-image: url("./assets/backgrounds/landscape-coastal-cliffs.jpg");
}

#observablehq-main h1,
#observablehq-main h2,
#observablehq-main h3,
#observablehq-main h4,
#observablehq-main h5,
#observablehq-main h6,
.observablehq h1,
.observablehq h2,
.observablehq h3,
.observablehq h4,
.observablehq h5,
.observablehq h6 {
  color: var(--survey-page-heading-color);
  font-family: var(--brand-font);
  line-height: var(--survey-page-heading-line-height);
  letter-spacing: 0;
}

#observablehq-main h1,
.observablehq h1 {
  font-size: 2rem;
}

#observablehq-main h2,
.observablehq h2 {
  font-size: 1.5rem;
}

#observablehq-main h3,
.observablehq h3 {
  font-size: 1.18rem;
}

#observablehq-main p,
#observablehq-main li,
.observablehq p,
.observablehq li {
  line-height: var(--survey-page-line-height);
}

.hide { display: none; }
.sticky-top {
  z-index: 1;
  position: sticky;
  top: 0;
}
.sticky-bottom {
  z-index: 1;
  bottom: 0;
}
.lh-copy {
  line-height: var(--lh-copy);
}

.survey-slate-demo-shell {
  box-sizing: border-box;
  background: var(--survey-demo-shell-bg);
  color: var(--survey-demo-surface-text);
  border: 1px solid var(--survey-demo-border);
}

.survey-slate-demo-card {
  background: var(--survey-demo-surface-bg);
  color: var(--survey-demo-surface-text);
  border: 1px solid var(--survey-demo-border);
  box-shadow: 0 1px 2px color-mix(in srgb, black 10%, transparent);
}

.survey-slate-demo-shell table,
.survey-slate-demo-card table {
  width: 100%;
  background: var(--survey-demo-surface-bg);
  color: var(--survey-demo-surface-text);
}

.survey-slate-demo-shell th,
.survey-slate-demo-shell td,
.survey-slate-demo-card th,
.survey-slate-demo-card td {
  color: var(--survey-demo-surface-text);
  border-color: var(--survey-demo-border);
}

.survey-slate-demo-shell label,
.survey-slate-demo-card label {
  color: var(--survey-demo-surface-text);
}

.survey-slate-demo-shell input,
.survey-slate-demo-shell textarea,
.survey-slate-demo-shell select,
.survey-slate-demo-card input,
.survey-slate-demo-card textarea,
.survey-slate-demo-card select {
  background: var(--survey-management-control-bg);
  color: var(--survey-management-control-text);
  border-color: var(--survey-management-control-border);
}

.brand-preset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
}

.brand-preset-card {
  display: grid;
  gap: 0.55rem;
  padding: 0.85rem;
  border: 1px solid var(--survey-demo-border);
  background: var(--survey-demo-surface-bg);
  color: var(--survey-demo-surface-text);
}

.brand-preset-card__name {
  margin: 0;
  font-weight: 700;
}

.brand-preset-card__context {
  margin: 0;
  color: var(--survey-demo-muted-text);
  font-size: 0.9rem;
  line-height: 1.35;
}

.brand-preset-card__swatches {
  display: flex;
  gap: 0.35rem;
}

.brand-preset-card__swatch {
  display: block;
  width: 2rem;
  height: 2rem;
  border: 1px solid color-mix(in srgb, black 16%, transparent);
}

.brand-preset-card__swatch--small {
  width: 1rem;
}

.theme-editor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0.8rem;
  margin: 1rem 0;
}

.theme-editor-field {
  position: relative;
  min-width: 0;
  padding: 0.75rem;
  border: 1px solid var(--survey-demo-border);
  background: var(--survey-demo-surface-bg);
  color: var(--survey-demo-surface-text);
}

.theme-editor-field--wide {
  grid-column: 1 / -1;
}

.theme-editor-label {
  display: block;
  margin: 0 0 0.45rem;
  font-size: 0.9rem;
  color: var(--survey-demo-surface-text);
}

.theme-text-editor input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--survey-management-control-border);
  border-radius: var(--survey-management-control-radius);
  background: var(--survey-management-control-bg);
  color: var(--survey-management-control-text);
}

.theme-color-editor {
  min-height: 4.35rem;
}

.theme-color-editor__swatch {
  display: block;
  width: 3.75rem;
  height: 2.25rem;
  padding: 0;
  border: 1px solid var(--survey-management-control-border);
  border-radius: var(--survey-management-control-radius);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, white 80%, transparent);
  cursor: pointer;
}

.theme-color-editor__swatch:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

.theme-color-editor__swatch svg {
  display: block;
  width: 100%;
  height: 100%;
}

.theme-color-editor__popover {
  position: absolute;
  z-index: 20;
  left: 0.75rem;
  top: calc(100% - 0.35rem);
  display: grid;
  grid-template-columns: auto minmax(7.5rem, 1fr);
  gap: 0.55rem;
  align-items: center;
  min-width: 14rem;
  padding: 0.7rem;
  border: 1px solid var(--survey-management-control-border);
  background: var(--survey-management-control-bg);
  color: var(--survey-management-control-text);
  box-shadow: 0 0.85rem 1.75rem rgba(0, 0, 0, 0.28);
}

.theme-color-editor__popover[hidden] {
  display: none;
}

.theme-color-editor__popover input[type="color"] {
  width: 3rem;
  height: 2.35rem;
}

.theme-color-editor__popover input[type="text"] {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--survey-management-control-border);
  border-radius: var(--survey-management-control-radius);
  background: var(--survey-management-control-bg);
  color: var(--survey-management-control-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.theme-editor-status {
  margin: 0.25rem 0 1rem;
  color: var(--survey-demo-muted-text);
  font-size: 0.9rem;
}

.theme-editor-status[data-state="saving"] {
  color: var(--accent);
}

.theme-editor-status[data-state="error"] {
  color: #d92d20;
}

.theme-editor-field .inputs-3a86ea,
.theme-editor-field input,
.theme-editor-field label {
  max-width: 100%;
}

.theme-editor-field .inputs-3a86ea-input,
.theme-editor-field .inputs-3a86ea-input > div {
  min-width: 0;
}

.theme-editor-field .inputs-3a86ea-input > div {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.theme-editor-field input[type="text"] {
  width: 100%;
  min-width: 0;
}

.theme-editor-field input[type="color"] {
  width: 5rem;
  min-height: 2.25rem;
  padding: 0.15rem;
  border: 1px solid var(--survey-management-control-border);
  border-radius: var(--survey-management-control-radius);
  background: var(--survey-management-control-bg);
}

.theme-editor-field input[type="color"] + output {
  display: none;
}

.theme-token-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 1rem;
  margin: 1rem 0;
  padding: 0.85rem;
  border: 1px solid var(--survey-demo-border);
  background: color-mix(in srgb, var(--survey-demo-surface-bg) 94%, var(--brand) 6%);
  color: var(--survey-demo-surface-text);
}

.theme-token-summary__label {
  margin: 0 0 0.45rem;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--survey-demo-muted-text);
}

.theme-token-summary__swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.theme-token-summary__swatch {
  display: block;
  width: 2.25rem;
  height: 1.75rem;
  border: 1px solid var(--survey-demo-border);
}

.theme-preview-frame {
  box-sizing: border-box;
  width: 100%;
  max-width: 58rem;
  height: 38rem;
  border: 1px solid var(--survey-demo-border);
  background: var(--survey-demo-shell-bg);
  overflow: hidden;
}

.theme-preview-frame > .survey-app-shell {
  height: 100%;
}

.theme-token-code {
  box-sizing: border-box;
  max-width: 100%;
  overflow-x: auto;
  padding: 0.85rem;
  border: 1px solid var(--survey-demo-border);
  background: color-mix(in srgb, var(--theme-background-alt, Canvas) 92%, var(--theme-foreground, CanvasText) 8%);
  color: var(--theme-foreground, CanvasText);
  font-size: 0.85rem;
  line-height: 1.45;
}

a:not([class]),
.observablehq a:not([class]):not(.observablehq-header-anchor),
#observablehq-main a:not([class]):not(.observablehq-header-anchor) {
  text-decoration: none;
  color: var(--brand);
}

a:not([class]):hover,
a:not([class]):focus,
a:not([class]):active,
.observablehq a:not([class]):not(.observablehq-header-anchor):hover,
.observablehq a:not([class]):not(.observablehq-header-anchor):focus,
.observablehq a:not([class]):not(.observablehq-header-anchor):active,
#observablehq-main a:not([class]):not(.observablehq-header-anchor):hover,
#observablehq-main a:not([class]):not(.observablehq-header-anchor):focus,
#observablehq-main a:not([class]):not(.observablehq-header-anchor):active {
  text-decoration: underline;
}

.observablehq .observablehq-header-anchor,
#observablehq-main .observablehq-header-anchor {
  color: inherit;
  text-decoration: none;
  pointer-events: none;
  cursor: text;
}

.inputs-3a86ea input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.inputs-3a86ea select,
.inputs-3a86ea textarea {
  border-color: var(--survey-management-control-border);
  border-radius: var(--survey-management-control-radius);
  background: var(--survey-management-control-bg);
  color: var(--survey-management-control-text);
}

.inputs-3a86ea input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.inputs-3a86ea select,
.inputs-3a86ea button {
  min-height: var(--survey-management-control-height);
}

.inputs-3a86ea input::placeholder,
.inputs-3a86ea textarea::placeholder {
  color: var(--theme-foreground-alt, GrayText);
  opacity: 0.88;
}

[data-theme="spectre"] .nav-item,
[data-theme="spectre"] .nav-item .nav-link,
[data-theme="spectre"] .nav-item .nav-link * {
  color: var(--survey-management-button-text, #ffffff) !important;
}

[data-theme="spectre"] .nav-tabs .nav-item,
[data-theme="spectre"] .nav-tabs .nav-item a,
[data-theme="spectre"] .nav-tabs .nav-item button,
[data-theme="spectre"] .nav-tabs .nav-item a *,
[data-theme="spectre"] .nav-tabs .nav-item button * {
  color: var(--survey-management-button-text, #ffffff) !important;
}

[data-theme="spectre"] .nav-item {
  background: var(--survey-management-button-bg, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
}

[data-theme="spectre"] .nav-item:hover {
  background: var(--survey-management-button-bg-hover, var(--brand));
}

[data-theme="spectre"] .nav-item .nav-link {
  background: transparent;
}

[data-theme="spectre"] [class*="json-editor-btn"] {
  background: var(--survey-management-button-bg, var(--brand)) !important;
  border-color: var(--survey-management-button-border, var(--brand)) !important;
  color: var(--survey-management-button-text, #ffffff) !important;
}

[data-theme="spectre"] [class*="json-editor-btn"]:hover,
[data-theme="spectre"] [class*="json-editor-btn"]:focus {
  background: var(--survey-management-button-bg-hover, var(--brand)) !important;
}

[data-theme="spectre"] [class*="json-editor-btntype-"],
[data-theme="spectre"] [class*="json-editor-btntype-"] * {
  color: var(--survey-management-button-text, #ffffff) !important;
}

[data-theme="spectre"] [class*="json-editor-btntype-"] {
  background: var(--survey-management-button-bg, var(--brand)) !important;
  border-color: var(--survey-management-button-border, var(--brand)) !important;
}

[data-theme="spectre"] [class*="json-editor-btntype-"]:hover,
[data-theme="spectre"] [class*="json-editor-btntype-"]:focus {
  background: var(--survey-management-button-bg-hover, var(--brand)) !important;
}

.json-editor-btns button,
.json-editor-btns a,
.json-editor-btns [class*="json-editor-btntype-"] {
  background: var(--survey-management-button-bg, var(--brand)) !important;
  border-color: var(--survey-management-button-border, var(--brand)) !important;
  color: var(--survey-management-button-text, #ffffff) !important;
}

.json-editor-btns button:hover,
.json-editor-btns a:hover,
.json-editor-btns [class*="json-editor-btntype-"]:hover {
  background: var(--survey-management-button-bg-hover, var(--brand)) !important;
}

.json-editor-btns button *,
.json-editor-btns a *,
.json-editor-btns [class*="json-editor-btntype-"] * {
  color: var(--survey-management-button-text, #ffffff) !important;
}

[data-theme="spectre"] .je-tab,
[data-theme="spectre"] .je-tab--top {
  background: var(--survey-management-button-bg, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
  color: var(--survey-management-button-text, #ffffff);
}

[data-theme="spectre"] .form-input,
[data-theme="spectre"] .form-select,
[data-theme="spectre"] select,
[data-theme="spectre"] textarea {
  background: var(--survey-management-control-bg) !important;
  color: var(--survey-management-control-text) !important;
  border-color: var(--survey-management-control-border) !important;
}

[data-theme="spectre"] .form-input::placeholder,
[data-theme="spectre"] textarea::placeholder {
  color: var(--theme-foreground-alt, GrayText) !important;
  opacity: 0.9;
}

[data-theme="spectre"] .form-input:hover,
[data-theme="spectre"] .form-input:focus,
[data-theme="spectre"] .form-select:hover,
[data-theme="spectre"] .form-select:focus,
[data-theme="spectre"] select:hover,
[data-theme="spectre"] select:focus,
[data-theme="spectre"] textarea:hover,
[data-theme="spectre"] textarea:focus {
  background: var(--survey-management-control-bg) !important;
  color: var(--survey-management-control-text) !important;
  border-color: var(--survey-management-control-border) !important;
  box-shadow: 0 0 0 0.1rem var(--survey-management-focus-ring);
  outline: none;
}

[data-theme="spectre"] div[data-schematype]:not([data-schematype='object']):hover,
[data-theme="spectre"] div[data-schematype]:not([data-schematype='object']):focus-within {
  background: color-mix(in srgb, var(--survey-management-secondary-bg) 80%, transparent) !important;
}

.inputs-3a86ea button,
.inputs-3a86ea input[type="button"],
.inputs-3a86ea input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0.5rem var(--survey-management-control-padding-x);
  border: 1px solid var(--survey-management-button-border);
  border-radius: var(--survey-management-control-radius);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
  background: var(--survey-management-button-bg);
  color: var(--survey-management-button-text) !important;
  box-shadow: 0 1px 2px color-mix(in srgb, black 14%, transparent);
  cursor: pointer;
}

.inputs-3a86ea button:hover,
.inputs-3a86ea button:focus-visible,
.inputs-3a86ea input[type="button"]:hover,
.inputs-3a86ea input[type="submit"]:hover,
.inputs-3a86ea input[type="button"]:focus-visible,
.inputs-3a86ea input[type="submit"]:focus-visible {
  background: var(--survey-management-button-bg-hover) !important;
}

.inputs-3a86ea button:focus-visible,
.inputs-3a86ea input[type="button"]:focus-visible,
.inputs-3a86ea input[type="submit"]:focus-visible,
.survey-selection-table tbody tr:focus-visible {
  outline: 2px solid var(--survey-management-focus-ring);
  outline-offset: 2px;
}

.inputs-3a86ea button:disabled,
.inputs-3a86ea input[type="button"]:disabled,
.inputs-3a86ea input[type="submit"]:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

button.survey-ui__primary-button,
input[type="button"].survey-ui__primary-button,
input[type="submit"].survey-ui__primary-button,
button.survey-ui__danger-button,
input[type="button"].survey-ui__danger-button,
input[type="submit"].survey-ui__danger-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: var(--survey-management-control-height);
  padding: 0.5rem var(--survey-management-control-padding-x);
  border: 1px solid var(--survey-management-button-border);
  border-radius: var(--survey-management-control-radius);
  font-family: var(--sans-serif);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
  box-shadow: 0 1px 2px color-mix(in srgb, black 14%, transparent);
  cursor: pointer;
}

.survey-ui__primary-button {
  background: var(--survey-management-button-bg, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
  color: var(--survey-management-button-text, #ffffff) !important;
}

a.survey-ui__button-link,
.observablehq a.survey-ui__button-link,
#observablehq-main a.survey-ui__button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--survey-management-control-height);
  padding: 0.5rem 1rem;
  border: 1px solid var(--survey-management-button-border, var(--brand));
  border-radius: var(--survey-management-control-radius);
  background: var(--survey-management-button-bg, var(--brand));
  color: var(--survey-management-button-text, #ffffff) !important;
  font-family: var(--sans-serif);
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none !important;
}

.inputs-3a86ea .survey-ui__primary-button {
  background: var(--survey-management-button-bg, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
  color: var(--survey-management-button-text, #ffffff);
}

.survey-ui__primary-button:hover,
.survey-ui__primary-button:focus-visible {
  background: var(--survey-management-button-bg-hover, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
}

.inputs-3a86ea .survey-ui__primary-button:hover,
.inputs-3a86ea .survey-ui__primary-button:focus-visible {
  background: var(--survey-management-button-bg-hover, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
}

a.survey-ui__button-link:hover,
a.survey-ui__button-link:focus-visible,
.observablehq a.survey-ui__button-link:hover,
.observablehq a.survey-ui__button-link:focus-visible,
#observablehq-main a.survey-ui__button-link:hover,
#observablehq-main a.survey-ui__button-link:focus-visible {
  background: var(--survey-management-button-bg-hover, var(--brand));
  border-color: var(--survey-management-button-border, var(--brand));
  color: var(--survey-management-button-text, #ffffff) !important;
}

.survey-ui__danger-button {
  background: var(--survey-management-danger-bg, #e9532b);
  border-color: var(--survey-management-danger-border, #e9532b);
  color: #ffffff !important;
}

.inputs-3a86ea .survey-ui__danger-button {
  background: var(--survey-management-danger-bg, #e9532b);
  border-color: var(--survey-management-danger-border, #e9532b);
  color: #ffffff;
}

.survey-ui__danger-button:hover,
.survey-ui__danger-button:focus-visible {
  background: var(--survey-management-danger-bg-hover, #d9482a);
  border-color: var(--survey-management-danger-border, #e9532b);
}

button.survey-ui__primary-button:disabled,
input[type="button"].survey-ui__primary-button:disabled,
input[type="submit"].survey-ui__primary-button:disabled,
button.survey-ui__danger-button:disabled,
input[type="button"].survey-ui__danger-button:disabled,
input[type="submit"].survey-ui__danger-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.inputs-3a86ea .survey-ui__danger-button:hover,
.inputs-3a86ea .survey-ui__danger-button:focus-visible {
  background: var(--survey-management-danger-bg-hover, #d9482a);
  border-color: var(--survey-management-danger-border, #e9532b);
}

.survey-ui__primary-button .icon,
.survey-ui__danger-button .icon {
  color: currentColor;
}

form.roles-action-btn,
form.users-accounts-action {
  display: block;
  width: fit-content;
  max-width: 100%;
  min-height: auto;
  margin: 0.75rem 0;
}

.roles-action-btn button,
.users-accounts-action button {
  max-width: 100%;
  white-space: normal;
}

.users-accounts-action--secondary button {
  background: var(--survey-management-secondary-bg);
  color: var(--survey-management-control-text);
  border-color: var(--survey-management-secondary-border);
  box-shadow: none;
}

.users-accounts-action--secondary button:hover,
.users-accounts-action--secondary button:focus-visible {
  background: var(--survey-management-secondary-bg-hover);
}

.users-accounts-action--danger button {
  background: var(--survey-management-danger-bg);
  border-color: var(--survey-management-danger-border);
  box-shadow: none;
}

.survey-management-action--danger button,
.access-key-control--danger button,
.users-accounts-action--danger button {
  background: var(--survey-management-danger-bg);
  border-color: var(--survey-management-danger-border);
  box-shadow: none;
}

.survey-management-action--danger button:hover,
.survey-management-action--danger button:focus-visible,
.access-key-control--danger button:hover,
.access-key-control--danger button:focus-visible,
.users-accounts-action--danger button:hover,
.users-accounts-action--danger button:focus-visible {
  background: var(--survey-management-danger-bg-hover);
}

.observablehq table,
#observablehq-main table {
  border-collapse: collapse;
  border-spacing: 0;
  color: var(--survey-table-text);
  font-family: var(--brand-font);
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
}

.observablehq table thead th,
.observablehq table th,
#observablehq-main table thead th,
#observablehq-main table th {
  background: var(--survey-table-header-bg);
  color: var(--survey-table-header-text);
  font-weight: 700;
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
  text-align: left;
  box-shadow: var(--survey-table-header-shadow);
}

.observablehq table thead th,
#observablehq-main table thead th {
  border-bottom: 1px solid var(--survey-table-header-border);
}

.observablehq table td,
.observablehq table tbody th,
#observablehq-main table td,
#observablehq-main table tbody th {
  color: var(--survey-table-text);
  border-bottom: 1px solid var(--survey-table-cell-border);
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
  vertical-align: top;
}

.observablehq table th,
.observablehq table td,
#observablehq-main table th,
#observablehq-main table td {
  padding: var(--survey-table-cell-padding-block) var(--survey-table-cell-padding-inline);
}

.observablehq .inputs-3a86ea-table,
#observablehq-main .inputs-3a86ea-table {
  color: var(--survey-table-text);
  font-family: var(--brand-font);
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
}

.observablehq .inputs-3a86ea-table thead th,
#observablehq-main .inputs-3a86ea-table thead th {
  background: var(--survey-table-header-bg);
  color: var(--survey-table-header-text);
  font-weight: 700;
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
  box-shadow: var(--survey-table-header-shadow);
}

.observablehq .inputs-3a86ea-table thead tr th,
#observablehq-main .inputs-3a86ea-table thead tr th {
  border-bottom: 1px solid var(--survey-table-header-border);
}

.observablehq .inputs-3a86ea-table td,
.observablehq .inputs-3a86ea-table tbody th,
#observablehq-main .inputs-3a86ea-table td,
#observablehq-main .inputs-3a86ea-table tbody th {
  border-bottom: 1px solid var(--survey-table-cell-border);
  color: var(--survey-table-text);
  font-size: var(--survey-table-font-size);
  line-height: var(--survey-table-line-height);
  vertical-align: top;
}

.observablehq .inputs-3a86ea-table th,
.observablehq .inputs-3a86ea-table td,
#observablehq-main .inputs-3a86ea-table th,
#observablehq-main .inputs-3a86ea-table td {
  padding: var(--survey-table-cell-padding-block) var(--survey-table-cell-padding-inline);
}

.survey-config-table.inputs-3a86ea-table td:last-child {
  overflow-wrap: anywhere;
}

.aws-credentials-control {
  max-width: min(100%, 48rem);
  margin: 0.75rem 0 1rem;
}

.aws-credentials-control form.inputs-3a86ea {
  width: 100%;
  align-items: start;
  gap: 0.85rem;
}

.aws-credentials-control .inputs-3a86ea > label {
  color: var(--theme-foreground, CanvasText);
  font-weight: 600;
}

.aws-credentials-control textarea {
  min-height: 7rem;
  width: 100%;
  background: color-mix(in srgb, var(--theme-background-alt, Canvas) 92%, var(--theme-background, Canvas));
  border-color: color-mix(in srgb, var(--brand) 20%, var(--theme-foreground-fainter, CanvasText));
  box-shadow: inset 0 1px 1px color-mix(in srgb, black 12%, transparent);
}

.aws-credentials-control button {
  justify-self: start;
}

.aws-credentials-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.aws-credentials-control textarea:focus {
  border-color: color-mix(in srgb, var(--brand) 58%, white 8%);
  outline: 2px solid color-mix(in srgb, var(--brand) 24%, transparent);
  outline-offset: 1px;
}

.aws-credentials-control--masked textarea {
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 0 4px color-mix(in srgb, var(--theme-foreground, CanvasText) 42%, transparent),
    0 0 9px color-mix(in srgb, var(--theme-foreground, CanvasText) 22%, transparent),
    0 0 16px color-mix(in srgb, var(--theme-foreground, CanvasText) 12%, transparent);
  caret-color: var(--theme-foreground, CanvasText);
}

.aws-credentials-control--masked textarea:not(:focus) {
  filter: blur(3px);
}

.survey-editor-load-status {
  box-sizing: border-box;
  clear: both;
  width: 100%;
  max-width: min(100%, 64rem);
  margin: 0.75rem 0 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid color-mix(in srgb, var(--brand, #007DB7) 38%, var(--theme-foreground-fainter, CanvasText));
  border-left: 4px solid var(--brand, #007DB7);
  border-radius: 0;
  background: color-mix(in srgb, var(--brand, #007DB7) 10%, var(--theme-background-alt, Canvas));
  color: var(--theme-foreground, CanvasText);
  font-family: var(--sans-serif);
}

.survey-admin-callout {
  justify-self: stretch;
  align-self: stretch;
}

.admin-tools-table {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.admin-tools-table .survey-editor-load-status {
  margin-left: 0;
  margin-right: 0;
}

.survey-editor-load-status[hidden] {
  display: none !important;
}

.survey-editor-load-status__title {
  margin: 0 0 0.15rem;
  font-weight: 700;
}

.survey-editor-load-status__message {
  color: color-mix(in srgb, var(--theme-foreground, CanvasText) 82%, var(--brand, #007DB7));
  font-size: 0.95rem;
  line-height: 1.35;
}

.survey-editor-load-status[data-stage="error"] {
  border-color: color-mix(in srgb, #d1432f 55%, var(--theme-foreground-fainter, CanvasText));
  border-left-color: #d1432f;
  background: color-mix(in srgb, #d1432f 10%, var(--theme-background-alt, Canvas));
}

.survey-editor-load-status[data-stage="ok"] {
  border-color: color-mix(in srgb, #2d8a46 55%, var(--theme-foreground-fainter, CanvasText));
  border-left-color: #2d8a46;
  background: color-mix(in srgb, #2d8a46 12%, var(--theme-background-alt, Canvas));
}

.survey-editor-load-status[data-stage="caution"],
.survey-editor-load-status[data-stage="warning"] {
  border-color: color-mix(in srgb, #fa8c16 56%, var(--theme-foreground-fainter, CanvasText));
  border-left-color: #fa8c16;
  background: color-mix(in srgb, #fa8c16 12%, var(--theme-background-alt, Canvas));
}