/*
 * Nadrzędny kontrakt elementów wspólnych Systemu 0.1.
 * Stopki i bazowa geometria kontrolek nie powinny być kopiowane do aplikacji.
 */
:root {
  --system-ui-blue: #0664a0;
  --system-ui-blue-dark: #044e7d;
  --system-ui-purple: #652483;
  --system-ui-sky: #3ba9e0;
  --system-ui-green: #95c122;
  --system-ui-red: #e94f1d;
  --system-ui-footer: #0c4d78;
  --system-ui-footer-dark: #0c4d78;
  --system-ui-orange: #f39208;
  --system-ui-white: #ffffff;
  --system-ui-control-height: 40px;
  --system-ui-control-radius: 7px;
  --system-ui-focus: #f39208;
  --system-ui-transition: 150ms ease;
  --system-ui-font: "Segoe UI", Arial, sans-serif;

  /* Zgodne aliasy używane przez istniejące aplikacje. */
  --brand-purple: var(--system-ui-purple);
  --brand-orange: var(--system-ui-orange);
  --brand-green: var(--system-ui-green);
  --brand-red: var(--system-ui-red);
  --brand-blue: var(--system-ui-blue);
  --brand-darkblue: var(--system-ui-blue);
  --brand-lightblue: var(--system-ui-sky);
  --brand-sky: var(--system-ui-sky);
  --c-primary: var(--system-ui-blue);
  --c-primary-hover: var(--system-ui-blue-dark);
  --c-secondary: var(--system-ui-orange);
  --c-tertiary: var(--system-ui-purple);
  --c-success: var(--system-ui-green);
  --c-danger: var(--system-ui-red);
}

/* Jeden dialog błędu aplikacji; treść i zgłoszenie pozostają osobnymi akcjami. */
.system-issue-dialog {
  box-sizing: border-box;
  width: min(540px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 24px;
  overflow: auto;
  border: 1px solid #c8d8e5;
  border-radius: 14px;
  background: #ffffff;
  color: #17344b;
  box-shadow: 0 18px 60px rgb(0 0 0 / 0.28);
  font: 16px/1.55 var(--system-ui-font);
  text-align: left;
}

.system-issue-dialog:not([open]),
.system-issue-dialog [hidden] { display: none !important; }
.system-issue-dialog::backdrop { background: rgb(8 24 38 / 0.55); }
.system-issue-dialog h2 {
  margin: 0 0 14px;
  color: inherit;
  font: 700 21px/1.3 var(--system-ui-font);
  overflow-wrap: anywhere;
}
.system-issue-dialog__message {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.system-issue-dialog__status {
  min-height: 1.55em;
  margin: 14px 0;
  color: inherit;
  overflow-wrap: anywhere;
}
.system-issue-dialog__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
.system-issue-dialog__button {
  box-sizing: border-box;
  width: auto;
  min-height: 44px;
  margin: 0;
  padding: 9px 16px;
  border: 1px solid var(--system-ui-blue);
  border-radius: var(--system-ui-control-radius);
  background: #ffffff;
  color: var(--system-ui-blue);
  font: 600 15px/1.4 var(--system-ui-font);
  cursor: pointer;
}
.system-issue-dialog__button--report {
  background: var(--system-ui-blue);
  color: #ffffff;
}
.system-issue-dialog__button:hover { border-color: var(--system-ui-blue-dark); }
.system-issue-dialog__button:focus-visible {
  outline: 3px solid var(--system-ui-focus);
  outline-offset: 3px;
}
.system-issue-dialog__button:disabled { cursor: wait; opacity: 0.65; }
:root[data-theme="dark"] .system-issue-dialog,
body:is(.dark, .dark-mode, .system-theme-dark) .system-issue-dialog {
  border-color: #526c84;
  background: #172b3c;
  color: #f2f6fa;
}
:root[data-theme="dark"] .system-issue-dialog__button--close,
body:is(.dark, .dark-mode, .system-theme-dark) .system-issue-dialog__button--close {
  border-color: #8ec8ef;
  background: #172b3c;
  color: #cbe8fb;
}

/* Wspólny nagłówek aplikacji. Lokalne arkusze określają układ roboczy,
 * natomiast kolor, typografia i geometria topbara należą do systemu. */
.system-app-topbar {
  width: 100%;
  min-height: 68px;
  margin: 0 !important;
  padding: 0 24px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 20;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--system-ui-blue) !important;
  color: var(--system-ui-white) !important;
  box-shadow: 0 3px 14px rgb(6 100 160 / 0.25);
  font-family: var(--system-ui-font);
  box-sizing: border-box;
}

.system-app-topbar__brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  color: var(--system-ui-white) !important;
  text-decoration: none;
  white-space: nowrap;
}

.system-app-topbar__brand img {
  width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  flex: 0 0 auto;
  object-fit: contain;
  border-radius: 8px;
  background: var(--system-ui-white);
  box-shadow: none !important;
}

.system-app-topbar__title,
.system-app-topbar__brand h1,
.system-app-topbar__brand span {
  margin: 0 !important;
  color: var(--system-ui-white) !important;
  font: 700 18px/1.2 var(--system-ui-font) !important;
  letter-spacing: 0 !important;
  text-align: left;
}

.system-app-topbar__project-area,
.system-app-topbar__project,
#sessionProjectControl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 0 0 auto;
  font: 600 13px/1.2 var(--system-ui-font);
  color: var(--system-ui-white);
  white-space: nowrap;
}

.system-app-topbar__project-label {
  color: #e0f0fa;
  font: 600 13px/1.2 var(--system-ui-font);
  letter-spacing: 0.2px;
  white-space: nowrap;
  user-select: none;
}

.system-app-topbar__project-select,
#sessionProjectSelect {
  width: 210px;
  max-width: 210px;
  min-width: 140px;
  height: 38px;
  margin: 0;
  padding: 0 32px 0 11px;
  display: inline-block;
  vertical-align: middle;
  border: 1px solid rgb(255 255 255 / 0.45);
  border-radius: var(--system-ui-control-radius);
  background-color: rgb(2 38 61 / 0.28);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 9px center;
  background-size: 15px 15px;
  color: var(--system-ui-white);
  font: 600 13.5px/36px var(--system-ui-font);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;
  transition: background-color var(--system-ui-transition), border-color var(--system-ui-transition), box-shadow var(--system-ui-transition);
}

.system-app-topbar__project-select:hover,
#sessionProjectSelect:hover {
  border-color: var(--system-ui-white);
  background-color: rgb(255 255 255 / 0.16);
}

.system-app-topbar__project-select:focus-visible,
#sessionProjectSelect:focus-visible {
  outline: 3px solid var(--system-ui-focus);
  outline-offset: 2px;
  border-color: var(--system-ui-white);
}

.system-app-topbar__project-select option,
#sessionProjectSelect option {
  background-color: #ffffff;
  color: #0f172a;
  font: 500 13.5px var(--system-ui-font);
  padding: 8px 12px;
}

body:is(.dark, .dark-mode, .system-theme-dark) .system-app-topbar__project-select option,
body:is(.dark, .dark-mode, .system-theme-dark) #sessionProjectSelect option,
html[data-theme="dark"] .system-app-topbar__project-select option,
html[data-theme="dark"] #sessionProjectSelect option {
  background-color: #1e293b;
  color: #f8fafc;
}

.system-app-topbar__project-status,
#sessionProjectStatus {
  margin: 0;
  padding: 0;
  font: 500 12px/1.2 var(--system-ui-font);
  color: #dceef8;
  white-space: nowrap;
  max-width: 220px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.system-app-topbar__button--compact {
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 11px !important;
  font-size: 13px !important;
}

.system-app-topbar__nav,
.system-app-topbar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.system-app-topbar__nav {
  min-width: 0;
  align-self: stretch;
}

.system-app-topbar__actions {
  margin-left: auto;
  flex: 0 0 auto;
}

.system-app-topbar__session {
  min-width: 0;
  margin-left: auto;
  padding-left: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
  border-left: 1px solid rgb(255 255 255 / 0.25);
}

.system-app-topbar__actions + .system-app-topbar__session {
  margin-left: 0;
}

.system-app-topbar__theme {
  width: 40px;
  height: 40px;
  min-width: 40px;
  margin: 0;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 0.48);
  border-radius: 50%;
  background: transparent;
  color: var(--system-ui-white);
  cursor: pointer;
  transition: background-color var(--system-ui-transition), border-color var(--system-ui-transition);
}

.system-app-topbar__theme:hover {
  border-color: var(--system-ui-white);
  background: rgb(255 255 255 / 0.14);
}

.system-app-topbar__theme:focus-visible {
  outline: 3px solid var(--system-ui-focus);
  outline-offset: 2px;
}

.system-app-topbar__theme svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.system-app-topbar__identity {
  width: 172px;
  min-width: 0;
  height: 40px;
  padding: 5px 11px;
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgb(255 255 255 / 0.28);
  border-radius: var(--system-ui-control-radius);
  background: rgb(2 38 61 / 0.2);
  color: var(--system-ui-white);
  box-sizing: border-box;
}

.system-app-topbar__user-name {
  max-width: 100%;
  min-height: 1.1em;
  overflow: hidden;
  color: var(--system-ui-white);
  font: 700 13px/1.1 var(--system-ui-font);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.system-app-topbar__timer {
  color: #dceef8;
  font: 650 11px/1.1 var(--system-ui-font);
  font-variant-numeric: tabular-nums;
}

.system-app-topbar__button,
.system-app-topbar .analysis-help-family-trigger {
  min-width: 0;
  min-height: var(--system-ui-control-height);
  margin: 0;
  padding: 9px 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgb(255 255 255 / 0.48) !important;
  border-radius: var(--system-ui-control-radius) !important;
  background: transparent !important;
  color: var(--system-ui-white) !important;
  box-shadow: none;
  font: 650 14px/1.2 var(--system-ui-font) !important;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--system-ui-transition), border-color var(--system-ui-transition);
}

.system-app-topbar__button:hover,
.system-app-topbar .analysis-help-family-trigger:hover,
.system-app-topbar .analysis-help-family:focus-within .analysis-help-family-trigger,
.system-app-topbar .analysis-help-family.is-open .analysis-help-family-trigger {
  border-color: var(--system-ui-white) !important;
  background: rgb(255 255 255 / 0.14) !important;
  color: var(--system-ui-white) !important;
}

.system-app-topbar__button--primary {
  border-color: var(--system-ui-orange) !important;
  background: rgb(243 146 8 / 0.22) !important;
  box-shadow: inset 0 -3px 0 var(--system-ui-orange);
  font-weight: 750 !important;
}

.system-app-topbar__button--primary:hover {
  border-color: #ffb13b !important;
  background: rgb(243 146 8 / 0.34) !important;
}

.system-app-topbar__tab {
  min-height: 68px;
  padding: 0 14px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #e9f4fb;
  font: 650 14px/1.2 var(--system-ui-font);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--system-ui-transition), border-color var(--system-ui-transition), color var(--system-ui-transition);
}

.system-app-topbar__tab:hover:not(:disabled) {
  background: rgb(255 255 255 / 0.09);
  color: var(--system-ui-white);
}

.system-app-topbar__tab.active {
  border-bottom-color: var(--system-ui-orange);
  background: rgb(243 146 8 / 0.16);
  color: var(--system-ui-white);
}

.system-app-topbar :is(button, [role="button"]):disabled {
  opacity: 0.48;
}

.system-app-footer {
  width: 100%;
  min-height: 8vh;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  margin-top: 0;
  padding: 8px 24px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  background: var(--system-ui-footer) !important;
  color: var(--system-ui-white) !important;
  border: 0;
  border-top: 3px solid var(--system-ui-orange);
  box-shadow: 0 -3px 12px rgb(7 31 50 / 0.16);
  font-family: var(--system-ui-font);
  font-size: 14px;
  line-height: 1.25;
  box-sizing: border-box;
  z-index: 120;
}

body.system-has-fixed-footer {
  padding-bottom: var(--system-footer-offset, 84px) !important;
}

.system-app-footer__inner {
  width: min(1680px, 100%);
  min-width: 0;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  gap: 24px;
}

.system-app-footer__meta {
  min-width: 0;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  grid-template-areas:
    "brand version"
    "author author"
    "contact contact"
    "copyright copyright";
  align-content: center;
  gap: 1px 10px;
}

.system-app-footer__brand {
  grid-area: brand;
  color: var(--system-ui-white);
  font-weight: 750;
}

.system-app-footer__version {
  color: #dceef8;
  white-space: nowrap;
}

.system-app-footer [data-footer-field="version"] { grid-area: version; }
.system-app-footer [data-footer-field="author"] { grid-area: author; }
.system-app-footer [data-footer-field="contact"] { grid-area: contact; }
.system-app-footer [data-footer-field="copyright"] {
  grid-area: copyright;
  color: #bed8e7;
  font-size: 11px;
}

.system-app-footer__back {
  width: 152px;
  min-height: 46px;
  margin-left: auto;
  padding: 7px 14px;
  display: inline-flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  flex: 0 0 auto;
  align-self: center;
  border: 1px solid rgb(243 146 8 / 0.9);
  border-radius: var(--system-ui-control-radius);
  background: rgb(243 146 8 / 0.16);
  color: var(--system-ui-white) !important;
  font: 750 14px/1.15 var(--system-ui-font);
  text-align: center;
  text-decoration: none;
  transition: background-color var(--system-ui-transition), border-color var(--system-ui-transition);
  box-sizing: border-box;
}

.system-app-footer__back:hover {
  border-color: #ffb13b;
  background: rgb(243 146 8 / 0.3);
}

.system-app-footer__shortcut {
  margin-top: 3px;
  padding: 1px 5px;
  border: 1px solid rgb(243 146 8 / .65);
  border-radius: 4px;
  background: rgb(0 0 0 / .12);
  color: inherit;
  font: 650 10px/1.2 var(--system-ui-font);
}

.system-app-footer__back:focus-visible {
  outline: 3px solid var(--system-ui-focus);
  outline-offset: 2px;
}

.system-app-topbar__report {
  border: 1px solid #f39208;
  border-radius: var(--system-ui-control-radius);
  padding: 8px 12px;
  background: transparent;
  color: #fff;
  font: 600 13px var(--system-ui-font);
  white-space: nowrap;
  cursor: pointer;
}
.system-app-topbar__report:hover { background: rgb(243 146 8 / .2); }
.system-user-report form { display: grid; gap: 16px; }
.system-user-report form > label { display: grid; gap: 8px; }
.system-user-report textarea {
  box-sizing: border-box; width: 100%; min-height: 140px; resize: vertical;
  padding: 10px; border: 1px solid #8799a5; border-radius: var(--system-ui-control-radius);
  background: #fff; color: #172c3a; font: 14px/1.5 var(--system-ui-font);
}
.system-user-report .system-user-report__consent {
  display: flex; align-items: flex-start; gap: 10px;
  border: 1px solid #f39208; border-radius: var(--system-ui-control-radius); padding: 12px;
}
.system-user-report__consent input { width: auto; margin-top: 3px; accent-color: #f39208; }
body:is(.dark, .dark-mode, .system-theme-dark) .system-user-report textarea {
  background: #142532; color: #edf5fa; border-color: #647b8b;
}

/* Wspólna geometria przycisków; znaczenie kolorów pozostaje w aplikacji. */
:where(
  .primary-button,
  .secondary-button,
  .icon-text-button,
  .icon-button,
  .button,
  .btn-sm,
  .btn-video,
  .btn-main-upload,
  #submit-btn
) {
  border-radius: var(--system-ui-control-radius);
  font-family: var(--system-ui-font);
  transition-duration: 150ms;
  transition-timing-function: ease;
}

:where(
  .primary-button,
  .secondary-button,
  .icon-text-button,
  .button,
  .btn-sm,
  .btn-video,
  .btn-main-upload,
  #submit-btn
):focus-visible {
  outline: 3px solid var(--system-ui-focus);
  outline-offset: 2px;
}

:where(button, [role="button"]):disabled {
  cursor: not-allowed;
  opacity: 0.56;
}

body:is(.dark, .dark-mode, .system-theme-dark),
html[data-theme="dark"] {
  --system-ui-footer: var(--system-ui-footer-dark);
}

@media (max-width: 1100px) {
  .system-app-topbar {
    padding: 10px 16px;
    flex-wrap: wrap;
    gap: 10px;
  }

  .system-app-topbar__nav {
    width: 100%;
    min-height: 44px;
    order: 3;
    overflow-x: auto;
  }

  .system-app-topbar__session {
    margin-left: 0;
  }

  .system-app-topbar__tab {
    min-height: 44px;
  }
}

@media (max-width: 620px) {
  .system-app-topbar {
    min-height: auto;
    padding: 10px 12px;
    flex-wrap: wrap;
    gap: 10px;
  }

  .system-app-topbar__project-select,
  #sessionProjectSelect {
    width: 160px;
    max-width: 160px;
  }

  .system-app-topbar__brand {
    flex: 1 1 auto;
  }

  .system-app-topbar__brand img {
    width: 36px !important;
    height: 36px !important;
  }

  .system-app-topbar__title,
  .system-app-topbar__brand h1,
  .system-app-topbar__brand span {
    font-size: 16px !important;
  }

  .system-app-topbar__actions {
    margin-left: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .system-app-topbar__session {
    width: 100%;
    padding: 8px 0 0;
    justify-content: flex-end;
    border-top: 1px solid rgb(255 255 255 / 0.2);
    border-left: 0;
  }

  .system-app-footer {
    min-height: auto;
    padding: 9px 12px;
  }

  .system-app-footer__inner {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }

  .system-app-footer__meta {
    justify-content: center;
  }

  .system-app-footer__back {
    width: 100%;
    margin-left: 0;
  }
}

/* The portal and every embedded application use the same page canvas. */
body.panel-user, body:has(.system-app-topbar) {
  background-color: #f4f7fa !important;
  background-image:
    radial-gradient(ellipse 65% 50% at 8% 12%, rgba(6, 100, 160, 0.08) 0%, transparent 70%),
    radial-gradient(ellipse 55% 45% at 92% 18%, rgba(243, 146, 8, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 60% 45% at 85% 85%, rgba(149, 193, 34, 0.07) 0%, transparent 65%),
    radial-gradient(ellipse 50% 40% at 12% 88%, rgba(233, 79, 29, 0.06) 0%, transparent 60%) !important;
  background-attachment: fixed !important;
}
body:is(.dark,.dark-mode,.system-theme-dark):is(.panel-user,:has(.system-app-topbar)), html[data-theme="dark"] body:is(.panel-user,:has(.system-app-topbar)) {
  background-color: #0f172a !important;
  background-image:
    radial-gradient(ellipse 70% 55% at 10% 12%, rgba(6, 100, 160, 0.28) 0%, transparent 70%),
    radial-gradient(ellipse 60% 50% at 90% 18%, rgba(243, 146, 8, 0.2) 0%, transparent 65%),
    radial-gradient(ellipse 65% 50% at 85% 85%, rgba(149, 193, 34, 0.18) 0%, transparent 65%),
    radial-gradient(ellipse 55% 45% at 15% 88%, rgba(233, 79, 29, 0.16) 0%, transparent 60%) !important;
  background-attachment: fixed !important;
}
body:has(.system-app-footer[data-app-id="rekoder"]) :is(.import-view, .preview-pane) {background:transparent;}

.system-copy-open { flex:none; white-space:nowrap; }
.system-copy-dialog { box-sizing:border-box; width:min(1120px,calc(100vw - 32px)); max-height:85vh; padding:24px; border:1px solid #c9d6e5; border-radius:16px; background:#fff; color:#17263a; box-shadow:0 24px 90px #0005; }
.system-copy-dialog::backdrop { background:#0f172a99; }
.system-copy-header { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.system-copy-header h2 { margin:0; font-size:1.25rem; }
.system-copy-description { margin:16px 0 8px; line-height:1.5; }
.system-copy-usage { padding:12px 16px; border:1px solid #d7e2ec; border-radius:10px; background:#f4f8fb; line-height:1.5; }
.system-copy-toolbar { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.system-copy-dialog :is(button,a) { font:inherit; }
.system-copy-dialog button { padding:8px 12px; border:1px solid #bfcedd; border-radius:7px; color:inherit; background:transparent; cursor:pointer; }
.system-copy-dialog button:disabled { opacity:.5; cursor:wait; }
.system-copy-dialog .system-copy-primary { background:#0664a0; color:#fff; border-color:#0664a0; }
.system-copy-dialog :is(button,a):focus-visible { outline:2px solid #f39208; outline-offset:3px; }
.system-copy-status { min-height:1.5em; line-height:1.5; }
.system-copy-content { overflow:auto; }
.system-copy-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.system-copy-table :is(th,td) { padding:11px 10px; text-align:left; border-bottom:1px solid #d7e2ec; vertical-align:middle; }
.system-copy-table th { font-weight:600; white-space:nowrap; }
.system-copy-table td:first-child { overflow-wrap:anywhere; min-width:120px; }
.system-copy-row-actions { min-width:230px; }
.system-copy-row-actions :is(a,button) { display:inline-block; margin:3px 6px 3px 0; white-space:nowrap; }
.system-copy-row-actions a { color:#0664a0; padding:7px 3px; }
.system-copy-dialog .system-copy-delete { color:#b42318; }
html[data-theme="dark"] .system-copy-dialog, body:is(.dark,.dark-mode,.system-theme-dark) .system-copy-dialog { background:#142033; color:#e6edf5; border-color:#344359; }
html[data-theme="dark"] .system-copy-usage, body:is(.dark,.dark-mode,.system-theme-dark) .system-copy-usage { background:#1c2a3d; border-color:#344359; }
html[data-theme="dark"] .system-copy-dialog :is(button,td,th), body:is(.dark,.dark-mode,.system-theme-dark) .system-copy-dialog :is(button,td,th) { border-color:#42536b; }
html[data-theme="dark"] .system-copy-row-actions a, body:is(.dark,.dark-mode,.system-theme-dark) .system-copy-row-actions a { color:#8bc7ef; }
html[data-theme="dark"] .system-copy-dialog .system-copy-delete, body:is(.dark,.dark-mode,.system-theme-dark) .system-copy-dialog .system-copy-delete { color:#ffa49c; }
@media(max-width:640px) { .system-copy-dialog { padding:16px; } .system-copy-toolbar { flex-direction:column; } }
/* A compact announcement shared by the portal and application topbars. */
.system-update-notice { margin: .5rem 1rem; padding: .55rem .8rem; border: 1px solid #b97d19; border-left: 4px solid #e9a12b; border-radius: .5rem; background: #fff3d9; color: #533800; font-size: .875rem; line-height: 1.4; }
[data-theme="dark"] .system-update-notice { background: #302719; color: #ffe5af; }
.system-theme-dark .system-update-notice, .dark-mode .system-update-notice { background: #302719; color: #ffe5af; }

/* Shared project workspace: common controls above application-specific actions. */
.system-app-topbar.system-app-topbar--projects {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 6px 18px; padding: 10px 18px 8px;
}
.system-app-topbar--projects > .system-app-topbar__brand { grid-area: 1 / 1; }
.system-app-topbar--projects > .system-app-topbar__project-area {
  grid-area: 1 / 2; display: flex; flex-wrap: wrap; align-content: center;
  gap: 4px 8px; min-width: 0;
}
.system-app-topbar--projects #sessionProjectControl { flex: 1 1 300px; gap: 7px; }
.system-app-topbar--projects #sessionProjectControl[hidden] { display: none; }
.system-app-topbar--projects #sessionProjectSelect { flex: 1 1 150px; width: 150px; min-width: 100px; max-width: 280px; height: 34px; line-height: 32px; }
.system-app-topbar--projects .system-app-topbar__project-count { font-variant-numeric: tabular-nums; font-size: 12px; color: #fff; white-space: nowrap; }
.system-app-topbar--projects #sessionProjectStatus {
  flex: 1 0 100%; max-width: 100%; min-height: 14px; font-size: 11px;
}
.system-app-topbar--projects #sessionProjectStatus[hidden] { display: block; visibility: hidden; }
.system-app-topbar--projects > .system-app-topbar__session { grid-area: 1 / 3; margin-left: 0; padding-left: 12px; }
.system-app-topbar--projects > .system-app-topbar__nav {
  grid-area: 2 / 1 / 3 / 3; display: flex; flex-wrap: nowrap;
  justify-content: flex-start; align-items: center; overflow-x: auto; gap: 7px;
  padding: 0; margin: 0; min-height: 34px;
}
.system-app-topbar--projects > .system-app-topbar__actions {
  grid-area: 2 / 3; justify-content: flex-end; flex-wrap: wrap; gap: 7px; margin: 0;
}
.system-app-topbar--projects:not(:has(> .system-app-topbar__nav)) > .system-app-topbar__actions { grid-column: 1 / -1; justify-content: flex-start; }
.system-app-topbar--projects :is(.system-app-topbar__button, .system-app-topbar__tab, .analysis-help-family-trigger) {
  min-height: 34px !important; height: 34px !important; padding: 0 11px !important;
  font-size: 13px !important; white-space: nowrap; flex-shrink: 0;
}
.system-app-topbar--projects #sessionProjectDelete:disabled { opacity: .45; cursor: default; }
.system-app-topbar--projects > .analysis-help-nav { overflow: visible; }
@media (max-width: 1150px) {
  .system-app-topbar.system-app-topbar--projects { grid-template-columns: minmax(0, 1fr) auto; }
  .system-app-topbar--projects > .system-app-topbar__session { grid-area: 1 / 2; }
  .system-app-topbar--projects > .system-app-topbar__project-area { grid-area: 2 / 1 / 3 / -1; }
  .system-app-topbar--projects #sessionProjectControl { flex: 0 1 400px; }
  .system-app-topbar--projects > .system-app-topbar__nav { grid-area: 3 / 1; }
  .system-app-topbar--projects > .system-app-topbar__actions { grid-area: 3 / 2; }
  .system-app-topbar--projects:not(:has(> .system-app-topbar__nav)) > .system-app-topbar__actions { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .system-app-topbar.system-app-topbar--projects { gap: 6px; padding: 8px 10px; }
  .system-app-topbar--projects > .system-app-topbar__brand { grid-column: 1 / -1; }
  .system-app-topbar--projects > .system-app-topbar__session { grid-area: 2 / 1 / 3 / -1; justify-content: flex-end; border: 0; padding: 0; }
  .system-app-topbar--projects > .system-app-topbar__project-area { grid-area: 3 / 1 / 4 / -1; }
  .system-app-topbar--projects > .system-app-topbar__nav { grid-area: 4 / 1 / 5 / -1; }
  .system-app-topbar--projects > .system-app-topbar__actions { grid-area: 5 / 1 / 6 / -1; justify-content: flex-start; }
  .system-app-topbar--projects #sessionProjectControl { flex-basis: 100%; }
  .system-app-topbar--projects > .analysis-help-nav { flex-wrap: wrap; }
}