#div_url, #it-multi-terms, .it-upload-controls {
  --url-text: #172638;
  --url-muted: #455971;
  --url-placeholder: #53677d;
  --url-field: #fff;
  --url-soft: #f2f6fa;
  --url-line: #a5b4c4;
  --url-focus: #176b9e;
  --url-link: #116593;
  --url-button: #156a9b;
  --url-button-hover: #10547d;
  --url-error: #96372d;
  color-scheme: light;
}
body.bk #div_url, body.bk #it-multi-terms, body.bk .it-upload-controls {
  --url-text: #edf3fa;
  --url-muted: #c1cfde;
  --url-placeholder: #a8b9cb;
  --url-field: #111d2c;
  --url-soft: #233246;
  --url-line: #647b92;
  --url-focus: #70c7f4;
  --url-link: #8ed4fa;
  --url-button: #146f9f;
  --url-button-hover: #0c608e;
  --url-error: #ffb8ab;
  color-scheme: dark;
}
#it-url-form, #it-url-run {
  display: grid;
  gap: 16px;
  color: var(--url-text);
  text-align: left;
  font: 400 14px/1.5 "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
:is(#it-url-form, #it-url-run) *, :is(#it-url-form, #it-url-run) *::before, :is(#it-url-form, #it-url-run) *::after { box-sizing: border-box; }
#div_url [hidden], #it-url-issues:empty, #it-url-status:empty, #it-url-outcomes:empty { display: none !important; }
#it-url-run-title {
  display: block;
  margin: 0;
  color: var(--url-text);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.35;
}
#it-url-form .it-url-entry-header { display: flow-root; }
#it-url-help, #it-url-native-help { margin: 4px 0 0; color: var(--url-muted); text-align: start; }
#it-url-form .it-url-editor { min-width: 0; }
/* The shared shell also defines field colors with !important. Keep the complete pair here. */
#body #div_url #it-url-form :is(textarea, input[type="url"], select),
#body #div_url #it-url-form select option {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid var(--url-line);
  border-radius: 7px;
  background-color: var(--url-field) !important;
  color: var(--url-text) !important;
  -webkit-text-fill-color: var(--url-text) !important;
  caret-color: var(--url-text) !important;
  color-scheme: inherit;
  font: inherit;
}
#body #div_url #it-url-input {
  display: block;
  min-height: 124px;
  resize: vertical;
  overflow: auto;
  font-size: 16px;
  line-height: 1.5;
}
#body #div_url #it-url-form select {
  width: 100% !important;
  max-width: 100% !important;
}
#body #div_url #it-url-input::placeholder,
#body #div_url #it-url-native-first::placeholder {
  color: var(--url-placeholder) !important;
  -webkit-text-fill-color: var(--url-placeholder);
  opacity: 1;
}
#body #div_url #it-url-form :is(textarea:read-only, textarea:disabled, input[type="url"]:read-only, input[type="url"]:disabled, select:disabled, option:disabled) {
  color: var(--url-muted) !important;
  -webkit-text-fill-color: var(--url-muted) !important;
  background-color: var(--url-soft) !important;
  opacity: 1;
}
#body #div_url #it-url-form :is(textarea, input[type="url"], select):is(:-webkit-autofill, :autofill) {
  -webkit-text-fill-color: var(--url-text) !important;
  box-shadow: 0 0 0 1000px var(--url-field) inset !important;
}
:is(#it-url-form, #it-url-run) :is(textarea, input[type="url"], select, button, a, summary):focus-visible {
  outline: 2px solid var(--url-focus);
  outline-offset: 2px;
}
#it-url-form textarea[aria-invalid="true"] { border-color: var(--url-error) !important; }
#it-url-form .it-url-review {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 4px 12px;
}
#it-url-form .it-url-review-details, #it-url-form .it-url-tools, #it-url-run .it-url-run-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
}
#it-url-form .it-url-review-details { min-width: 0; align-items: baseline; }
#it-url-summary, #it-url-status { color: var(--url-muted); font-size: 13px; }
#it-url-summary:not(:empty) { padding: 7px 0; }
#it-url-form .it-url-tools { justify-content: flex-start; }
:is(#it-url-form, #it-url-run) button {
  margin: 0;
  min-height: 36px;
  padding: 5px 7px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--url-link);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
:is(#it-url-form, #it-url-run) button:hover { background-color: var(--url-soft); }
#it-url-issues { margin: 4px 0 0; padding: 0; color: var(--url-error); list-style: none; }
#it-url-issues li { margin: 0; padding: 0; overflow-wrap: anywhere; }
#it-url-issues button { color: var(--url-error); text-align: left; text-decoration: underline; }
#div_file > form, #div_html5 > form, #it-url-settings { container: upload-settings / inline-size; }
#it-url-settings {
  display: flow-root;
  min-width: 0;
  margin-block: 10px;
  color: var(--url-text);
  text-align: left;
  font: 400 14px/1.45 "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* The shared settings row already provides the same top inset used by Multi Upload. */
#body #div_url:has(> #it-url-settings:first-child + form:not([hidden])) { padding-top: 0; }
#div_url > #it-url-settings:first-child { margin-top: 0; }
#div_url:has(> #it-url-form[hidden]) > #it-url-settings { display: none; }
/* All three uploaders share these controls. Override the shell's fixed track widths and 55% select cap. */
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls {
  display: grid;
  grid-template-columns: var(--upload-settings-columns, repeat(2, minmax(0, 1fr))) !important;
  gap: 8px;
}
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls > label {
  display: grid !important;
  grid-template-columns: var(--upload-field-columns, auto minmax(0, 1fr));
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 42px;
  margin: 0;
  padding: 5px 8px;
  border: 1px solid var(--it-line, var(--url-line));
  border-radius: 7px;
  text-align: start;
  font: 400 12px/1.2 "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls select {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 31px;
  margin: 0;
  padding: 3px 6px;
  border: 1px solid var(--url-line) !important;
  border-radius: 6px;
  font: 400 13px/1.25 "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif !important;
  appearance: auto;
}
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls :is(select, option) {
  color-scheme: inherit;
  background-color: var(--url-field) !important;
  color: var(--url-text) !important;
  -webkit-text-fill-color: var(--url-text) !important;
  caret-color: var(--url-text);
}
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls :is(select, option):disabled {
  background-color: var(--url-soft) !important;
  color: var(--url-muted) !important;
  -webkit-text-fill-color: var(--url-muted) !important;
  opacity: 1;
}
#body :is(#div_file, #div_html5, #div_url) .it-upload-controls select:is(:autofill, :-webkit-autofill) {
  box-shadow: 0 0 0 1000px var(--url-field) inset !important;
}
.it-upload-controls select:focus-visible {
  outline: 2px solid var(--url-focus);
  outline-offset: 2px;
}
@container upload-settings (min-width: 704px) {
  .it-upload-controls { --upload-settings-columns: minmax(0, 1.08fr) minmax(0, .72fr) minmax(0, 1.49fr) minmax(0, 1fr); }
}
@container upload-settings (max-width: 470px) {
  .it-upload-controls {
    --upload-settings-columns: minmax(0, 1.08fr) minmax(0, 1fr);
    --upload-field-columns: minmax(0, 1fr);
  }
}
@container upload-settings (max-width: 335px) {
  .it-upload-controls > :is(.domain, .gallery) {
    grid-column: 1 / -1;
    --upload-field-columns: auto minmax(0, 1fr);
  }
}
#body #div_url .it-url-review > #it-url-style-choice {
  width: auto;
  max-width: 100%;
  min-width: 0;
  justify-self: end;
}
#it-url-style-choice label {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  max-width: 100%;
  gap: 4px 8px;
  margin: 0;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
}
#body #div_url #it-url-form #it-url-style { width: auto !important; }
#body #div_url #it-url-style-choice select {
  min-height: 31px;
  max-width: 100%;
  margin: 0;
  padding: 3px 6px;
  border: 1px solid var(--url-line);
  border-radius: 6px;
  font: inherit;
}
#body #div_url #it-url-style-choice :is(select, option) {
  background-color: var(--url-field) !important;
  color: var(--url-text) !important;
  -webkit-text-fill-color: var(--url-text) !important;
  caret-color: var(--url-text) !important;
  color-scheme: inherit;
}
#body #div_url #it-url-style-choice :is(select, option):disabled {
  background-color: var(--url-soft) !important;
  color: var(--url-muted) !important;
  -webkit-text-fill-color: var(--url-muted) !important;
  opacity: 1;
}
#body #div_url #it-url-style-choice select:is(:autofill, :-webkit-autofill) {
  -webkit-text-fill-color: var(--url-text) !important;
  box-shadow: 0 0 0 1000px var(--url-field) inset !important;
}
#it-url-style-choice select:focus-visible {
  outline: 2px solid var(--url-focus);
  outline-offset: 2px;
}
#body :is(#div_html5, #div_url) > .it-upload-terms {
  box-sizing: border-box;
  clear: both;
  width: 100%;
  margin: 18px 0 0;
  padding: 12px 8px 2px;
  border-top: 1px solid var(--url-line);
  color: var(--url-muted);
  text-align: center;
  text-wrap: balance;
  font: 400 13px/1.5 "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
#body :is(#div_html5, #div_url) > .it-upload-terms a, #div_url .it-url-unavailable a, #it-url-myfiles { color: var(--url-link); text-decoration: underline; }
#it-url-form #it-url-submit {
  --submit-surface: var(--url-button);
  float: right;
  margin-inline-start: 12px;
  position: relative;
  isolation: isolate;
  min-height: 32px;
  padding: 4px 12px;
  border-radius: 6px;
  background: transparent;
  color: #fff;
  font-size: 13px;
}
#it-url-form #it-url-submit::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background: var(--submit-surface);
}
#it-url-form #it-url-submit:enabled:hover { --submit-surface: var(--url-button-hover); }
#it-url-run #it-url-results {
  min-height: 42px;
  padding: 9px 20px;
  border-radius: 8px;
  background: var(--url-button);
  color: #fff;
  font-size: 15px;
}
#it-url-run #it-url-results:hover { background: var(--url-button-hover); }
:is(#it-url-form, #it-url-run) button:disabled, #it-url-form #it-url-submit:disabled, #it-url-run #it-url-results:disabled {
  background: var(--url-soft);
  color: var(--url-muted);
  cursor: default;
  opacity: 1;
}
#it-url-form #it-url-submit:disabled { --submit-surface: var(--url-soft); background: transparent; }
#it-url-status, #div_url .it-url-unavailable { margin: 0; }
#div_url .it-url-unavailable { color: var(--url-text); }
#it-url-form .it-url-native { min-width: 0; }
#it-url-form .it-url-native p:last-child { margin: 8px 0 0; color: var(--url-muted); }
#it-url-form .it-url-native a { color: var(--url-link); text-decoration: underline; }
#it-url-form .it-url-native summary { padding: 8px 0; color: var(--url-link); font-weight: 600; cursor: pointer; }
#it-url-form .it-url-native-extra {
  display: grid;
  gap: 8px;
  max-height: 42vh;
  overflow-y: auto;
  padding: 3px;
}
#it-url-form .it-url-native-extra label { display: grid; gap: 4px; margin: 0; color: var(--url-text); font-size: 13px; }
#it-url-run { gap: 10px; }
#it-url-form:not([hidden]) + #it-url-run { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--url-line); }
#it-url-progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  appearance: none;
  border: 0;
  border-radius: 4px;
  background: var(--url-soft);
  color: var(--url-link);
  accent-color: var(--url-link);
}
#it-url-progress::-webkit-progress-bar { background: var(--url-soft); }
#it-url-progress::-webkit-progress-value { background: var(--url-link); }
#it-url-progress::-moz-progress-bar { background: var(--url-link); }
#it-url-progress-text { margin: 0; color: var(--url-muted); font-variant-numeric: tabular-nums; }
#it-url-outcomes {
  margin: 0;
  padding: 0;
  max-height: 18rem;
  overflow: auto;
  overflow-wrap: anywhere;
  list-style: none;
}
#it-url-outcomes li { margin: 0; padding: 7px 0; border-bottom: 1px solid var(--url-line); }
#it-url-run .it-url-run-actions { justify-content: flex-start; }
#it-url-myfiles { display: inline-flex; align-items: center; min-height: 40px; }
@media (max-width: 600px) {
  #it-url-form { gap: 12px; }
  #it-url-form .it-url-review { display: flex; flex-wrap: wrap; align-items: baseline; }
  #it-url-form .it-url-review-details { flex: 1 1 auto; }
  #body #div_url .it-url-review > #it-url-style-choice { margin-inline-start: auto; }
  #it-url-style-choice label { justify-content: flex-end; }
  #body #div_url #it-url-form :is(select, input[type="url"]) { min-height: 44px; font-size: 16px; }
  :is(#it-url-form, #it-url-run) button, #it-url-myfiles { min-height: 44px; }
}
@media (max-width: 420px) {
  #it-url-form .it-url-review-details:not(:has(button:not([hidden]))) { flex-basis: 4rem; }
  #it-url-style-choice label { display: grid; justify-items: end; gap: 2px; }
  #body #div_url #it-url-form #it-url-style { padding: 3px 6px; }
}
@media (pointer: coarse) {
  #it-url-form #it-url-submit { min-height: 44px; }
  #it-url-form #it-url-submit::before { inset-block: 6px; }
}
