/* Scoped production adapter for the accepted shared foundation. Only the
   explicitly migrated browser views load this stylesheet. Legacy
   surfaces retain their own frame and controls. Palette values are separate. */
body.operator-surface {
  --u-font: Arial, Helvetica, sans-serif;
  --u-font-data: 'SFMono-Regular', Consolas, monospace;
  --u-text: 14px;
  --u-meta: 12px;
  --u-title: 24px;
  --u-heading: 16px;
  --u-rule: var(--u-line);
  --u-rule-strong: var(--u-strong-line);
  --u-copy: var(--u-ink);
  --u-data: var(--u-muted);
  --u-raised: var(--u-surface);
  --u-signal: var(--u-action);
  --u-bad: var(--u-danger);
  --u-leading: 1.5;
  --u-space-1: 4px;
  --u-space-2: 8px;
  --u-space-3: 12px;
  --u-space-4: 16px;
  --u-space-5: 20px;
  --u-space-6: 24px;
  --u-space-8: 32px;
  --u-edge: 24px;
  --u-control-height: 34px;
  --u-control-height-small: 28px;
  --u-row-action-size: 32px;
  --u-radius-control: 4px;
  --page-gap: var(--u-space-4);
  /* Compatibility aliases for the existing server-rendered shared partials. */
  --font: var(--u-font);
  --mono: var(--u-font-data);
  --text: var(--u-ink);
  --muted: var(--u-muted);
  --dim: var(--u-muted);
  --bg: var(--u-canvas);
  --bg-2: var(--u-canvas);
  --surface: var(--u-surface);
  --surface-2: var(--u-surface);
  --elevated: var(--u-surface);
  --line: var(--u-line);
  --line-soft: var(--u-line);
  --accent: var(--u-action);
  --accent-soft: var(--u-selection);
  --accent-line: var(--u-strong-line);
  --good: var(--u-success);
  --warn: var(--u-attention);
  --bad: var(--u-danger);
  --control-bg: transparent;
  --control-bg-hover: var(--u-selection);
  --field-bg: var(--u-canvas);
  --field-line: var(--u-strong-line);
  margin: 0;
  color: var(--u-ink);
  background: var(--u-canvas);
  font: var(--u-text)/var(--u-leading) var(--u-font);
}
body.operator-surface [hidden] { display: none !important; }
body.operator-surface a { color: var(--u-action); text-underline-offset: 3px; }
body.operator-surface :focus-visible { outline: 2px solid var(--u-focus); outline-offset: 2px; }
body.operator-surface main {
  min-width: 0;
  max-width: none;
  padding: var(--u-space-4) var(--u-edge) var(--u-space-8);
}
body.operator-surface main:focus { outline: none; }
body.operator-surface main h2 { margin: 0; font-size: var(--u-heading); font-weight: 700; }
body.operator-surface .manage-app-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--u-space-4);
  padding: var(--u-space-3) var(--u-edge);
  border-bottom: 1px solid var(--u-line);
}
body.operator-surface .manage-brand { color: var(--u-ink); font-size: var(--u-heading); font-weight: 700; text-decoration: none; }
body.operator-surface .manage-mode { color: var(--u-ink); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 7px; }
body.operator-surface .browser-mode-menu { position: relative; }
body.operator-surface .browser-theme-choice { display: grid; gap: var(--u-space-1); color: var(--u-muted); border-top: 1px solid var(--u-line); padding-top: var(--u-space-2); }
body.operator-surface .browser-mode-menu summary { cursor: pointer; }
body.operator-surface .browser-mode-menu > div { position: absolute; z-index: 30; top: calc(100% + 12px); left: 0; display: grid; gap: var(--u-space-2); min-width: 120px; padding: var(--u-space-3); background: var(--u-canvas); border: 1px solid var(--u-strong-line); box-shadow: 0 4px 16px var(--u-shadow); }
body.operator-surface .browser-mode-menu a { text-decoration: none; }
body.operator-surface .browser-mode-menu a[aria-current] { color: var(--u-ink); font-weight: 700; }
body.operator-surface main .item-choice { display: block; height: auto; min-height: 0; width: 100%; margin: 0; padding: var(--u-space-3) 0; border: 0; border-bottom: 1px solid var(--u-line); border-radius: 0; background: transparent; color: var(--u-ink); font: inherit; text-align: left; justify-content: stretch; align-items: stretch; cursor: pointer; }
body.operator-surface main .item-choice.is-media { display: flex; align-items: flex-start; gap: var(--u-space-3); padding-inline: var(--u-space-2); }
body.operator-surface main .item-choice:hover { background: var(--u-selection); }
body.operator-surface main .item-choice[aria-selected="true"] { background: var(--u-selection); }
body.operator-surface .manage-navigation { display: flex; flex-wrap: wrap; gap: var(--u-space-4); }
body.operator-surface .manage-navigation a { text-decoration: none; }
body.operator-surface .manage-navigation a[aria-current="page"] { color: var(--u-ink); font-weight: 700; }
body.operator-surface .manage-account-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--u-space-4); margin-left: auto; }
body.operator-surface .manage-account-actions > a { text-decoration: none; }
body.operator-surface .manage-account-actions .global-find-trigger {
  display: inline-flex; align-items: center; gap: var(--u-space-2);
  border: 0; background: transparent; color: var(--u-action); padding: 0;
  font: inherit; cursor: pointer;
}
body.operator-surface .manage-account-actions kbd { font-size: var(--u-meta); color: var(--u-muted); }
body.operator-surface .manage-skip { position: absolute; left: -10000px; }
body.operator-surface .manage-skip:focus { left: var(--u-edge); top: var(--u-space-2); z-index: 100; padding: var(--u-space-2); background: var(--u-canvas); }
body.operator-surface main .page-head-row { gap: var(--u-space-3); }
body.operator-surface main .page-title { gap: var(--u-space-4); }
body.operator-surface main .page-title h1 { font-size: var(--u-title); font-weight: 700; line-height: 1.25; letter-spacing: -.4px; overflow-wrap: anywhere; }
body.operator-surface main .page-stats { font-size: var(--u-meta); }
body.operator-surface main .page-actions { gap: var(--u-space-2); }
body.operator-surface main nav.page-tabs.tabbar.line {
  flex-wrap: nowrap; gap: var(--u-space-6); overflow-x: auto;
  border-bottom: 1px solid var(--u-line); scrollbar-width: thin;
}
body.operator-surface main nav.page-tabs.tabbar.line .tab-link {
  display: inline-flex; align-items: center; gap: var(--u-space-1);
  min-height: 38px; height: auto; padding: var(--u-space-2) 0;
  color: var(--u-muted); font-size: var(--u-text); font-weight: 400;
  white-space: nowrap; text-decoration: none;
}
body.operator-surface main nav.page-tabs.tabbar.line .tab-link.on { color: var(--u-ink); font-weight: 700; }
body.operator-surface main nav.page-tabs.tabbar.line .count { background: transparent; border: 0; padding: 0; color: var(--u-muted); font: inherit; }
body.operator-surface main nav.page-tabs.tabbar.line .tab-link.on::after { background: var(--u-action); height: 2px; }
body.operator-surface main nav.page-tabs.tabbar.line .tab-link:focus-visible { outline-offset: -2px; }
body.operator-surface main nav.page-tabs.tabbar.line.is-sub { gap: var(--u-space-4); }
body.operator-surface main nav.page-tabs.tabbar.line.is-sub .tab-link { min-height: 32px; font-size: var(--u-meta); }
body.operator-surface main .page-toolbar { align-items: flex-end; gap: var(--u-space-3); }
body.operator-surface main .control-group { gap: var(--u-space-3); }
/* The legacy search form's flex-basis is a horizontal width. A labelled
   field stacks its children vertically, so do not reinterpret 340px as
   the form's height when the same page-filter partial is nested there. */
body.operator-surface main .manage-search-field > .table-filter { flex: 0 0 auto; width: 100%; min-width: 0; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini, .text-action) {
  min-height: var(--u-control-height); height: auto; max-width: 100%;
  padding: 0 var(--u-space-2); border: 0; border-radius: 2px;
  background: transparent; color: var(--u-action);
  font: 400 var(--u-text)/var(--u-leading) var(--u-font);
  white-space: normal; overflow-wrap: anywhere; text-decoration: none;
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini, .text-action):hover:not(:disabled) { color: var(--u-action); background: var(--u-selection); border: 0; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini).primary { color: var(--u-action); background: transparent; font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini).danger { color: var(--u-danger); }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini):is(.ghost, .quiet) { color: var(--u-muted); }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn, .mini):disabled { color: var(--u-muted); opacity: .6; background: transparent; text-decoration: none; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.btn.small, .mini.small, .page-actions .btn, .page-toolbar .btn, .manage-selection .btn, .data-table .btn, .text-action) {
  min-height: var(--u-control-height-small); height: auto;
  padding-inline: var(--u-space-2); font-size: var(--u-meta);
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) .text-action { padding-inline: 0; font-weight: 600; text-decoration: underline; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="color"]), select:not([multiple]):not([size]):not([hidden]):not([data-raw]), textarea:not([hidden]):not([data-raw])) {
  min-height: var(--u-control-height); height: auto;
  border: 1px solid var(--u-strong-line); border-radius: var(--u-radius-control);
  padding: 4px var(--u-field-padding-end, var(--u-space-2)) 4px var(--u-space-2); background-color: var(--u-canvas);
  color: var(--u-ink); font: 400 var(--u-text)/var(--u-leading) var(--u-font);
  box-shadow: none; color-scheme: inherit;
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(.page-toolbar, .manage-filter-bar) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="color"]), select:not([multiple]):not([size]):not([hidden]):not([data-raw])) {
  min-height: var(--u-control-height); height: auto; font-size: var(--u-text);
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) select:not([multiple]):not([size]):not([hidden]):not([data-raw]) {
  --u-field-padding-end: 36px;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--u-muted) 50%), linear-gradient(135deg, var(--u-muted) 50%, transparent 50%);
  background-position: right 17px center, right 12px center;
  background-size: 5px 5px; background-repeat: no-repeat;
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(input, select, textarea):focus-visible { border-color: var(--u-focus); box-shadow: none; outline: 2px solid var(--u-focus); outline-offset: 2px; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(input, select, textarea):focus { box-shadow: none; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) #addModal.discover-add-workspace .search-bar input:not([type="hidden"]) {
  min-height: var(--u-control-height); height: auto; border-radius: var(--u-radius-control);
  padding: 4px var(--u-space-2) 4px 34px; font: 400 var(--u-text)/var(--u-leading) var(--u-font);
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) #addModal.discover-add-workspace .search-bar input:not([type="hidden"]):focus { box-shadow: none; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--u-action); }
body.operator-surface :is(main, .browser-mode-menu, .global-find) :is(input[type="checkbox"], input[type="radio"]) {
  appearance: auto; width: 16px; height: 16px; min-width: 16px;
  margin: 0; padding: 0; border-radius: 0; background: transparent;
  vertical-align: middle; box-shadow: none;
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) .icon-action {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 var(--u-row-action-size); width: var(--u-row-action-size);
  min-width: var(--u-row-action-size); height: var(--u-row-action-size);
  min-height: var(--u-row-action-size); padding: 0; border: 0; border-radius: 2px;
  background: transparent; color: var(--u-action); font: inherit; cursor: pointer;
}
body.operator-surface :is(main, .browser-mode-menu, .global-find) .icon-action:hover:not(:disabled) { background: var(--u-selection); }
body.operator-surface :is(main, .browser-mode-menu, .global-find) .icon-action.small { --u-row-action-size: 28px; }
body.operator-surface :is(main, .browser-mode-menu, .global-find) .icon-action:disabled { opacity: .5; cursor: default; }
body.operator-surface main fieldset { min-width: 0; border: 0; margin: 0; padding: 0; }
body.operator-surface main legend { font-weight: 700; margin-bottom: var(--u-space-2); }
body.operator-surface dialog { color: var(--u-ink); background: var(--u-canvas); border: 1px solid var(--u-strong-line); border-radius: 4px; max-width: calc(100vw - 32px); }
body.operator-surface dialog::backdrop { background: var(--u-shadow); }
body.operator-surface main :is(.manage-table-wrap, .data-table-wrap) { max-width: 100%; overflow-x: auto; margin-right: 0; padding-right: 0; }
body.operator-surface main table.data-table { width: 100%; border-collapse: collapse; text-align: left; }
body.operator-surface main .data-table :is(th, td) { padding: var(--u-space-2) var(--u-space-3); border-bottom: 1px solid var(--u-line); background: transparent; }
body.operator-surface main .data-table th { color: var(--u-muted); font-size: var(--u-meta); font-weight: 600; text-transform: none; letter-spacing: 0; }
body.operator-surface main .data-table th[scope="row"] { color: var(--u-ink); font-size: var(--u-text); font-weight: 400; }
body.operator-surface main .data-table td { font-size: var(--u-text); }
body.operator-surface main .data-table :is(th, td):first-child { padding-left: 0; }
body.operator-surface main .data-table :is(th, td):last-child { padding-right: 0; }
body.operator-surface main .data-table tr.is-selected { background: var(--u-selection); }
body.operator-surface main .action-pop-body { border: 1px solid var(--u-strong-line); border-radius: 4px; background: var(--u-canvas); box-shadow: 0 4px 16px var(--u-shadow); }
@media (max-width: 650px) {
  body.operator-surface { --u-edge: 16px; }
  body.operator-surface .manage-app-bar { gap: var(--u-space-3); }
  body.operator-surface .manage-navigation { gap: var(--u-space-3); }
  body.operator-surface .manage-account-actions { margin-left: 0; }
  body.operator-surface main nav.page-tabs.tabbar.line { gap: var(--u-space-4); }
  body.operator-surface main .page-toolbar { align-items: stretch; }
}
@media (forced-colors: active) {
  body.operator-surface main select:not([multiple]):not([size]):not([hidden]):not([data-raw]) { --u-field-padding-end: var(--u-space-2); appearance: auto; background-image: none; }
}

/* Find is one purposeful overlay using the same foundation controls. */
body.operator-surface .global-find-stage { border: 1px solid var(--u-strong-line); border-radius: 4px; background: var(--u-canvas); box-shadow: 0 4px 24px var(--u-shadow); animation: none; }
body.operator-surface :is(.global-find-beam, .global-find-kicker, .global-find-stream-mark) { display: none; }
body.operator-surface .global-find-head { padding: var(--u-space-4) var(--u-space-6) var(--u-space-3); align-items: center; }
body.operator-surface .global-find-head h2 { font: 700 var(--u-heading)/var(--u-leading) var(--u-font); letter-spacing: 0; }
body.operator-surface .global-find-query { grid-template-columns: 20px minmax(0, 1fr) auto; padding: 0; gap: var(--u-space-2); background: transparent; border-radius: 0; }
body.operator-surface .global-find-query:focus-within { background: transparent; box-shadow: none; }
body.operator-surface .global-find-query > svg { width: 18px; height: 18px; color: var(--u-muted); }
body.operator-surface .global-find-query input { letter-spacing: 0; }
body.operator-surface .global-find-query-state { font: var(--u-meta)/var(--u-leading) var(--u-font); }
body.operator-surface .global-find-kinds { gap: var(--u-space-2); padding-block: var(--u-space-2); }
body.operator-surface .global-find-kinds button.on { font-weight: 700; color: var(--u-ink); background: var(--u-selection); }
body.operator-surface .global-find-stream h3 { font-size: var(--u-heading); font-weight: 700; }
body.operator-surface .global-find-stream header p { font: var(--u-meta)/var(--u-leading) var(--u-font); }
body.operator-surface .global-find-result { border-radius: 0; border-bottom: 1px solid var(--u-line); transition: none; }
body.operator-surface .global-find-result:is(:hover, :focus-visible) { background: var(--u-selection); transform: none; }
body.operator-surface .global-find-result:focus-visible { outline: 2px solid var(--u-focus); outline-offset: -2px; }
body.operator-surface .global-find-copy strong { font-size: var(--u-text); }
body.operator-surface .global-find-copy small { font-size: var(--u-meta); }
body.operator-surface .global-find-state { border-radius: 0; background: transparent; font: var(--u-meta)/var(--u-leading) var(--u-font); }
@media (max-width: 650px) {
  body.operator-surface .global-find-query { grid-template-columns: 20px minmax(0, 1fr); }
  body.operator-surface .global-find-head { padding-inline: var(--u-space-4); }
}
