/* Shared visual system for the panel, anonymous view and login. */
body {
  padding: 20px;
  background: light-dark(#eef0f6, #0e1018);
  -webkit-font-smoothing: antialiased;
}
#maxiom-workspace {
  --w-bg: light-dark(#ffffff, #191c29);
  --w-canvas: light-dark(#f8f9fc, #131621);
  --w-ink: light-dark(#25273b, #eef0fc);
  --w-muted: light-dark(#70768b, #9da5bf);
  --w-line: light-dark(#e7eaf2, #2a3042);
  --w-soft: light-dark(#f1f3f9, #202538);
  --w-selected: light-dark(#eeeafe, #2a2445);
  --w-accent: light-dark(#6d4bd6, #bea7ff);
  --w-accent-bg: light-dark(#eee9ff, #302747);
  --w-fill: light-dark(#7654df, #a88aef);
  --w-on: light-dark(#fff, #1c1232);
  --w-green: light-dark(#21735a, #7cdbb1);
  --w-green-bg: light-dark(#e8f6ef, #193b32);
  --w-red: light-dark(#b43e56, #f29aac);
  --w-red-bg: light-dark(#ffedf0, #412633);
  --w-amber: light-dark(#8d641d, #e9c07d);
  --w-amber-bg: light-dark(#fff5df, #3a3024);
  --w-blue: light-dark(#326caa, #8bbff7);
  --w-blue-bg: light-dark(#e9f2ff, #21364d);
  --w-shade: light-dark(#24203d30, #050711a6);
  --w-shadow: 0 8px 30px light-dark(#29315707, #00000018);
  min-height: calc(100dvh - 40px);
  background: var(--w-canvas);
  border-radius: 24px;
  box-shadow: 0 18px 70px light-dark(#2931570a, #00000020);
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
#maxiom-workspace .w-header {
  padding: 22px 28px;
  background: var(--w-bg);
  border-radius: 24px 24px 0 0;
}
#maxiom-workspace .w-brand { font-size: 24px; gap: 10px; letter-spacing: -1px; }
#maxiom-workspace .w-brand svg {
  width: 36px; height: 36px; padding: 8px; border-radius: 12px;
  color: var(--w-accent); background: var(--w-accent-bg);
}
#maxiom-workspace #w-title { color: var(--w-muted); font-size: 14px; }
#maxiom-workspace main { padding: 24px 28px; }
#maxiom-workspace .w-tabs {
  display: inline-flex; max-width: 100%; gap: 4px; padding: 5px;
  margin-bottom: 24px; background: var(--w-soft); border-radius: 15px;
}
#maxiom-workspace .w-tab { padding: 9px 15px; min-height: 39px; border-radius: 11px; }
#maxiom-workspace .w-tab:hover { color: var(--w-ink); }
#maxiom-workspace .w-tab[aria-pressed=true] {
  background: var(--w-bg); color: var(--w-accent); font-weight: 600;
  box-shadow: 0 2px 7px light-dark(#22264012, #00000025);
}
#maxiom-workspace .w-tab small {
  display: inline-grid; place-items: center; min-width: 22px; height: 21px;
  padding: 0 5px; background: var(--w-soft); border-radius: 7px; opacity: 1;
  font-variant-numeric: tabular-nums;
}
#maxiom-workspace .w-button {
  min-height: 38px; padding: 9px 13px; border-radius: 11px; font-weight: 500;
  box-shadow: 0 1px 2px light-dark(#29315704, #00000012);
  text-decoration: none;
}
#maxiom-workspace :is(.w-button,.w-tab,.w-icon,.flow-chip,.flow-paste) {
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
#maxiom-workspace .w-button:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--w-accent) 35%, var(--w-line));
  box-shadow: 0 3px 10px light-dark(#29315709, #0000001c);
}
#maxiom-workspace .w-button:active:not(:disabled) { transform: translateY(1px); }
#maxiom-workspace .w-primary {
  background: var(--w-fill); color: var(--w-on); border-color: transparent;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--w-fill) 18%, transparent);
}
#maxiom-workspace .w-primary:hover:not(:disabled) { background: var(--w-fill); filter: brightness(1.07); border-color: transparent; }
#maxiom-workspace .w-quiet { box-shadow: none; }
#maxiom-workspace .w-icon { width: 32px; height: 32px; border-radius: 10px; }
#maxiom-workspace .w-search { background: var(--w-bg); min-height: 46px; border-radius: 13px; padding-inline: 15px; }
#maxiom-workspace .w-search:focus-within { border-color: var(--w-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--w-accent) 12%, transparent); }
#maxiom-workspace .w-search input:focus-visible { outline: none; }
#maxiom-workspace .w-input {
  border-radius: 11px; min-height: 42px; padding: 10px 12px; font-size: 13px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
#maxiom-workspace .w-field { gap: 8px; font-weight: 500; }
#maxiom-workspace .w-field :is(input,select,textarea) { font-weight: 400; }
#maxiom-workspace .w-tools > .w-button { border-radius: 13px; }
#maxiom-workspace .w-page-size { display: flex; align-items: center; gap: 9px; color: var(--w-muted); font-size: 12px; white-space: nowrap; }
#maxiom-workspace .w-page-size .w-input { width: 84px; min-height: 45px; border-radius: 13px; }
#maxiom-workspace #w-check-count { min-width: 23px; padding: 1px 6px; border-radius: 7px; background: color-mix(in srgb,var(--w-on) 12%,transparent); font-size: 11px; font-variant-numeric: tabular-nums; }
#maxiom-workspace #w-filter-toggle[aria-expanded=true] { background: var(--w-accent-bg); color: var(--w-accent); border-color: transparent; }
#maxiom-workspace #w-filter-count:not(:empty) { display: inline-grid; place-items: center; min-width: 20px; height: 20px; border-radius: 6px; background: var(--w-accent-bg); color: var(--w-accent); }
#maxiom-workspace .w-filters { background: var(--w-bg); padding: 22px; border-radius: 18px; box-shadow: var(--w-shadow); }
#maxiom-workspace .flow-chip { border-radius: 9px; padding: 6px 10px; }
#maxiom-workspace .flow-context { min-height: 65px; margin-top: 10px; }
#maxiom-workspace .flow-context.has-selection { border: 1px solid color-mix(in srgb, var(--w-accent) 25%, var(--w-line)); border-radius: 14px; padding: 10px 14px; background: var(--w-selected); }
#maxiom-workspace .w-selected strong { color: var(--w-accent); }
#maxiom-workspace .w-table-scroll { background: var(--w-bg); border: 1px solid var(--w-line); border-radius: 17px; box-shadow: var(--w-shadow); min-height: 200px; }
#maxiom-workspace th { height: 49px; padding: 10px 12px; background: color-mix(in srgb, var(--w-soft) 65%, var(--w-bg)); border-top: 0; font-weight: 500; }
#maxiom-workspace td { height: 73px; padding: 12px; border-color: color-mix(in srgb, var(--w-line) 70%, transparent); }
#maxiom-workspace tr:last-child td { border-bottom: 0; }
#maxiom-workspace tbody tr { transition: background-color 130ms ease; }
#maxiom-workspace tbody tr.selected:hover { background: color-mix(in srgb, var(--w-selected) 80%, var(--w-accent-bg)); }
#maxiom-workspace tr.selected td:first-child { box-shadow: inset 3px 0 var(--w-accent); }
#maxiom-workspace .w-check-cell { width: 44px; padding-inline: 12px; }
#maxiom-workspace input[type=checkbox] { width: 16px; height: 16px; cursor: pointer; }
#maxiom-workspace .w-avatar { width: 40px; height: 40px; border-radius: 14px; box-shadow: 0 0 0 1px color-mix(in srgb, var(--w-line) 60%, transparent); }
#maxiom-workspace .w-name { font-weight: 600; letter-spacing: -.15px; }
#maxiom-workspace .w-phone { font-weight: 500; gap: 8px; }
#maxiom-workspace .w-phone svg { transition: opacity 150ms ease; opacity: .45; }
#maxiom-workspace .w-phone:hover svg { opacity: 1; }
#maxiom-workspace .w-badge { padding: 6px 10px; border-radius: 8px; min-width: 62px; }
#maxiom-workspace .w-role { padding: 5px 9px; border-radius: 8px; background: rgba(var(--role-rgb,117,133,157),.16); border: 1px solid rgba(var(--role-rgb,117,133,157),.35); color: var(--w-ink); }
#maxiom-workspace .w-role:hover { background: rgba(var(--role-rgb,117,133,157),.25); border-color: rgba(var(--role-rgb,117,133,157),.5); }
#maxiom-workspace .w-neutral { color: var(--w-muted); background: var(--w-soft); }
#maxiom-workspace .w-two { font-size: 12px; }
#maxiom-workspace .w-sort { gap: 8px; min-height: 28px; }
#maxiom-workspace .flow-menu { border-radius: 15px; padding: 7px; box-shadow: 0 12px 40px var(--w-shade); }
#maxiom-workspace .flow-menu button { border-radius: 10px; min-height: 40px; }
#maxiom-workspace .w-overlay { backdrop-filter: blur(7px); background: light-dark(#1d203d47, #070a16a3); }
#maxiom-workspace:has(.w-overlay:not([hidden])) { min-height: calc(100dvh - 40px); }
body:has(.w-overlay:not([hidden])) { overflow: hidden; }
#maxiom-workspace .w-modal { border-radius: 23px; padding: 28px; box-shadow: 0 28px 100px var(--w-shade); }
#maxiom-workspace .w-modal-head { margin-bottom: 24px; }
#maxiom-workspace h3 { font-size: 19px; font-weight: 600; letter-spacing: -.45px; }
#maxiom-workspace .w-dialog-actions { padding-top: 7px; gap: 9px; }
#maxiom-workspace .w-upload { border-radius: 15px; padding: 28px 16px; border-color: color-mix(in srgb, var(--w-accent) 40%, var(--w-line)); background: var(--w-canvas); }
#maxiom-workspace input[type=file]::file-selector-button { border: 0; border-radius: 8px; background: var(--w-accent-bg); color: var(--w-accent); padding: 8px 10px; margin-right: 10px; cursor: pointer; }
#maxiom-workspace :is(.column-item,.w-share-info,.w-notice,.settings-status,.flow-undo,.task-live) { border-radius: 12px; }
#maxiom-workspace .column-item { padding: 10px 12px; }
#maxiom-workspace .settings-head { padding: 24px 28px 0; }
#maxiom-workspace .settings-grid { padding: 24px 28px 28px; gap: 20px; }
#maxiom-workspace .settings-card { padding: 25px; background: var(--w-bg); border-radius: 20px; box-shadow: var(--w-shadow); }
#maxiom-workspace .settings-card h3 { display: flex; align-items: center; gap: 10px; font-size: 17px; }
#maxiom-workspace .settings-card h3 svg { width: 30px; height: 30px; padding: 7px; background: var(--w-accent-bg); color: var(--w-accent); border-radius: 10px; }
#maxiom-workspace .session-item { border-radius: 15px; padding: 20px; background: var(--w-canvas); }
#maxiom-workspace .session-item:has(.w-valid) { border-color: color-mix(in srgb, var(--w-green) 35%, var(--w-line)); }
#maxiom-workspace .w-photo-preview { border-radius: 24px; padding: 5px; box-shadow: 0 14px 45px var(--w-shade); }
#maxiom-workspace .w-photo-preview img { border-radius: 19px; }
#maxiom-workspace .task-bar { border-radius: 17px; margin-inline: 28px; padding: 17px 20px; box-shadow: 0 8px 30px var(--w-shade); }
#maxiom-workspace progress { appearance: none; border: 0; border-radius: 20px; overflow: hidden; background: var(--w-soft); color: var(--w-fill); height: 7px; }
#maxiom-workspace progress::-webkit-progress-bar { background: var(--w-soft); border-radius: 20px; }
#maxiom-workspace progress::-webkit-progress-value { background: var(--w-fill); border-radius: 20px; transition: width 350ms ease; }
#maxiom-workspace progress::-moz-progress-bar { background: var(--w-fill); border-radius: 20px; }
#maxiom-workspace progress:not([value]) { background: linear-gradient(90deg,var(--w-soft) 20%,var(--w-fill) 50%,var(--w-soft) 80%); background-size: 200% 100%; animation: progress-wait 1.6s ease-in-out infinite; }
#maxiom-workspace progress:not([value])::-webkit-progress-bar { background: transparent; }
#maxiom-workspace .task-history-item { border-radius: 14px; padding: 15px; }
#maxiom-workspace .task-history-item:hover { background: var(--w-soft); }
#maxiom-workspace .upload-progress { padding: 14px; background: var(--w-soft); border-radius: 12px; }
#maxiom-workspace .upload-progress progress { display: block; width: 100%; margin-top: 12px; }
#maxiom-workspace .security-note { padding: 12px 14px; border-radius: 12px; background: var(--w-amber-bg); color: var(--w-amber); font-size: 12px; }
#maxiom-workspace #jobs-open[data-running] { position: relative; }
#maxiom-workspace #jobs-open[data-running]::after { content: attr(data-running); position: absolute; top: -6px; right: -6px; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--w-fill); color: var(--w-on); font-size: 10px; border: 2px solid var(--w-bg); }
#maxiom-workspace.login-shell { box-shadow: none; }
#maxiom-workspace .login-card { border-radius: 24px; padding: 36px; width: min(100%,420px); gap: 21px; box-shadow: 0 20px 80px light-dark(#29315714,#00000040); }
#maxiom-workspace .login-card .w-brand { font-size: 32px; letter-spacing: -1.4px; }
#maxiom-workspace .login-card h2 { font-size: 20px; font-weight: 600; }
#maxiom-workspace .login-card > .w-primary { min-height: 44px; font-size: 14px; }
@keyframes surface-enter { from { opacity: 0; transform: translateY(7px) scale(.99); } to { opacity: 1; transform: none; } }
@keyframes veil-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes progress-wait { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: no-preference) {
  #maxiom-workspace .w-overlay:not([hidden]) { animation: veil-enter 160ms ease-out; }
  #maxiom-workspace .w-overlay:not([hidden]) .w-modal { animation: surface-enter 210ms cubic-bezier(.2,.7,.2,1); }
  #maxiom-workspace :is(.w-filters,.flow-menu,.w-photo-preview):not([hidden]) { animation: surface-enter 160ms ease-out; }
}
@media (max-width: 850px) {
  body { padding: 10px; }
  #maxiom-workspace { min-height: calc(100dvh - 20px); border-radius: 19px; }
  #maxiom-workspace .w-header { padding: 17px; border-radius: 19px 19px 0 0; gap: 9px; }
  #maxiom-workspace main { padding: 18px 16px; }
  #maxiom-workspace .w-brand { font-size: 22px; }
  #maxiom-workspace .settings-grid { padding: 18px 16px; }
  #maxiom-workspace .settings-head { padding: 18px 16px 0; }
  #maxiom-workspace .settings-card { padding: 20px; }
  #maxiom-workspace .task-bar { margin-inline: 16px; padding: 15px; }
}
@media (max-width: 520px) {
  body { padding: 6px; }
  #maxiom-workspace .w-header { padding: 14px 12px; gap: 8px; }
  #maxiom-workspace .w-header .w-button { min-height: 38px; padding: 8px 10px; }
  #maxiom-workspace .w-header .w-brand { flex-basis: auto; padding: 0; margin: 0; }
  #maxiom-workspace main { padding: 16px 12px; }
  #maxiom-workspace .w-tabs { display: flex; flex-wrap: nowrap; gap: 2px; padding: 4px; }
  #maxiom-workspace .w-tab { flex: 1; padding: 8px 6px; gap: 5px; font-size: 12px; }
  #maxiom-workspace .w-tab small { min-width: 18px; padding: 0 3px; font-size: 10px; }
  #maxiom-workspace .w-filters { padding: 15px; }
  #maxiom-workspace .w-tools > #w-check { flex: 1 1 100%; }
  #maxiom-workspace .w-modal { padding: 21px; border-radius: 20px; }
  #maxiom-workspace .task-bar { margin-inline: 12px; }
  #maxiom-workspace .login-card { padding: 27px; }
  #maxiom-workspace:has(.w-overlay:not([hidden])) { min-height: calc(100dvh - 12px); }
}
@media (prefers-reduced-motion: reduce) {
  #maxiom-workspace *, #maxiom-workspace *::before, #maxiom-workspace *::after { animation: none !important; transition: none !important; }
}
#maxiom-workspace .w-filters { background: var(--w-bg); border-top: 3px solid color-mix(in srgb,var(--w-blue) 55%,var(--w-line)); }
#maxiom-workspace .filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
#maxiom-workspace .filter-heading strong { display: flex; align-items: center; gap: 9px; font-size: 14px; }
#maxiom-workspace .filter-heading svg { width: 18px; height: 18px; color: var(--w-blue); }
#maxiom-workspace .w-filter-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
#maxiom-workspace .flow-filter-footer { flex-wrap: wrap; gap: 16px; border-top: 1px solid var(--w-line); margin-top: 18px; padding-top: 16px; }
#maxiom-workspace #selection-form { display: grid; grid-template-columns: auto 120px auto; align-items: center; gap: 8px 12px; padding: 12px 16px; background: var(--w-blue-bg); border-radius: 12px; }
#maxiom-workspace #selection-form label { font-size: 13px; font-weight: 500; }
#maxiom-workspace #selection-hint { grid-column: 1 / -1; font-size: 11px; }
#maxiom-workspace .selection-submit { background: var(--w-blue); color: var(--w-bg); border-color: transparent; }
#maxiom-workspace #selection-count[aria-invalid=true] { border-color: var(--w-red); }
#maxiom-workspace .flow-context.has-selection { background: var(--w-bg); border-color: color-mix(in srgb,var(--w-accent) 40%,var(--w-line)); border-left: 4px solid var(--w-fill); gap: 16px; }
#maxiom-workspace #w-share { color: var(--w-blue); background: var(--w-blue-bg); border-color: transparent; }
#maxiom-workspace #w-bottom [data-open=two] { color: var(--w-amber); background: var(--w-amber-bg); border-color: transparent; }
#maxiom-workspace #w-bottom [data-move=trash] { color: var(--w-red); background: var(--w-red-bg); border-color: transparent; }
#maxiom-workspace #w-bottom .w-actions { gap: 8px; }
@media (max-width: 850px) {
  #maxiom-workspace .w-filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #maxiom-workspace .flow-filter-footer { align-items: stretch; }
}
@media (max-width: 520px) {
  #maxiom-workspace #selection-form { width: 100%; grid-template-columns: minmax(0,1fr) auto; padding: 12px; }
  #maxiom-workspace #selection-form label { grid-column: 1 / -1; }
  #maxiom-workspace #selection-count { width: 100%; min-width: 0; }
  #maxiom-workspace #w-bottom .w-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; }
  #maxiom-workspace #w-bottom .w-actions svg { display: block; }
  #maxiom-workspace #w-bottom .w-actions .w-button { justify-content: flex-start; }
}

#maxiom-workspace .w-role-edit { cursor: pointer; font: inherit; font-size: 12px; line-height: inherit; transition: background-color 150ms ease, border-color 150ms ease; }
#maxiom-workspace .w-role-edit:hover { background: rgba(var(--role-rgb),.25); border-color: rgba(var(--role-rgb),.5); }
#maxiom-workspace .w-role-empty { background: rgba(var(--role-rgb),.07); border-style: dashed; }

#maxiom-workspace .role-description { display: flex; align-items: center; gap: 6px; font-size: 13px; }
#maxiom-workspace .role-description .w-caption { margin-left: auto; }

#maxiom-workspace .role-filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#maxiom-workspace .role-empty-filter { display: inline-flex; align-items: center; gap: 6px; color: var(--w-muted); font-size: 11px; cursor: pointer; white-space: nowrap; }
#maxiom-workspace .role-empty-filter:has(:checked) { color: var(--w-accent); }
#maxiom-workspace #w-role:disabled { opacity: .55; cursor: default; }

#maxiom-workspace .w-main-actions { display: flex; align-items: stretch; gap: 9px; }
@media (max-width: 520px) {
  #maxiom-workspace .w-main-actions { width: 100%; }
  #maxiom-workspace .w-main-actions #w-check { flex: 1; min-width: 0; white-space: normal; padding-inline: 10px; }
  #maxiom-workspace .w-main-actions #w-share { padding-inline: 10px; }
}

#maxiom-workspace .w-table-scroll.virtual-table { max-height: min(70vh,720px); overflow: auto; overflow-anchor: none; scrollbar-gutter: stable; }
#maxiom-workspace .virtual-table table { table-layout: fixed; }
#maxiom-workspace .virtual-table thead { position: sticky; top: 0; z-index: 2; }
#maxiom-workspace .virtual-table tbody tr[data-row] { height: 73px; }
#maxiom-workspace .virtual-table tbody tr[data-row] td { height: 73px; overflow: hidden; }
#maxiom-workspace .virtual-table .virtual-spacer td { padding: 0; border: 0; line-height: 0; }
#maxiom-workspace .virtual-table .virtual-spacer:hover { background: transparent; }