/* Candidate 33: approved Soft Corporate visual direction.
   Screen only. Do not change role visibility, layout routing or printed documents. */
@media screen {
  :root {
    --sc-ink: #20334a;
    --sc-muted: #657488;
    --sc-red: #ad4336;
    --sc-red-dark: #90372d;
    --sc-line: #dce3e9;
    --sc-paper: #f4f6f8;
    --sc-green: #34715c;
    --sc-amber: #926125;
    --sc-shadow: 0 12px 28px -19px #283c5266, 0 2px 5px #283c5206;
    --sc-raised: inset 0 1px 0 #ffffffef, 0 10px 18px -14px #22374d66;
    --v3-text: var(--sc-ink);
    --v3-navy-900: var(--sc-ink);
    --v3-navy-800: #263b53;
    --v3-navy-700: #365b7d;
    --v3-muted: var(--sc-muted);
    --v3-red: var(--sc-red);
    --v3-red-dark: var(--sc-red-dark);
    --v3-red-soft: #faf0ed;
    --v3-green: var(--sc-green);
    --v3-green-soft: #edf6f0;
    --v3-amber: var(--sc-amber);
    --v3-amber-soft: #faf3e7;
    --v3-danger: #a3312b;
    --v3-canvas: var(--sc-paper);
    --v3-surface: #fff;
    --v3-surface-2: #f7f9fb;
    --v3-line: var(--sc-line);
    --v3-line-strong: #cbd6e1;
    --v3-radius: 12px;
    --v3-shadow: var(--sc-shadow);
    --ink: var(--sc-ink);
    --navy: var(--sc-ink);
    --muted: var(--sc-muted);
    --red: var(--sc-red);
    --red-dark: var(--sc-red-dark);
    --line: var(--sc-line);
    --green: var(--sc-green);
    --amber: var(--sc-amber);
    --paper: var(--sc-paper);
    --soft: #f5f7fa;
    --shadow: var(--sc-shadow);
  }

  body {
    color: var(--sc-ink);
    font-family: "Aptos", "Segoe UI", Tahoma, sans-serif;
    line-height: 1.45;
    background: radial-gradient(ellipse at 90% 4%, #e7edf4 0, transparent 42%),
      radial-gradient(ellipse at 10% 90%, #f3ebe7 0, transparent 40%), var(--sc-paper);
  }
  button, input, select, textarea { font-family: inherit; }

  /* Keep the current sidebar dimensions and responsive toggle behaviour. */
  #appSidebar {
    color: var(--sc-ink);
    background: linear-gradient(160deg, #fff, #f5f7f9);
    border-right: 1px solid var(--sc-line);
    box-shadow: 4px 0 18px -15px #263b5338;
  }
  #appSidebar .sidebar-brand {
    background: transparent;
    border-bottom: 1px solid var(--sc-line);
    min-height: 112px;
  }
  #appSidebar :is(.sidebar-brand-copy strong, .sidebar-brand-compact > strong) {
    color: var(--sc-ink);
    font-family: inherit;
  }
  #appSidebar :is(.sidebar-brand-copy small, .sidebar-brand-compact > span) { color: var(--sc-muted); }
  #appSidebar .sidebar-logo-crop { box-shadow: 0 3px 8px #20334a0d; border-radius: 10px; }
  #appSidebar .nav-button {
    color: #52677d;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 9px;
    box-shadow: none;
    transition: background-color .15s, border-color .15s;
  }
  #appSidebar .nav-button:hover { background: #eef2f6; color: var(--sc-ink); }
  #appSidebar .nav-button.active {
    color: var(--sc-ink);
    border-color: var(--sc-line);
    background: linear-gradient(135deg, #fff, #eef1f5);
    box-shadow: var(--sc-raised);
  }
  #appSidebar .nav-button .nav-icon { color: inherit; background: transparent; }
  #appSidebar .nav-button.active .nav-icon { color: var(--sc-red); }
  #appSidebar :is(.nav-group, .nav-section-label, .nav-group-label, .nav-section-title) { color: #5f6f82; }
  #appSidebar .sidebar-footer { color: #61758b; border-color: var(--sc-line); }
  #appSidebar .sidebar-footer strong { color: var(--sc-ink); }
  .app-topbar, .app-header {
    background: #fffffff2;
    border-bottom: 1px solid var(--sc-line);
    box-shadow: 0 2px 8px #213b5203;
  }
  .app-topbar .topbar-title :is(h1, p) { color: var(--sc-ink); font-family: inherit; }
  .app-topbar .topbar-title h1 { color: var(--sc-red); }
  .app-topbar .topbar-icon {
    border: 1px solid var(--sc-line);
    border-radius: 9px;
    background: linear-gradient(#fff, #f6f8fa);
    color: #536b83;
    box-shadow: var(--sc-raised);
  }

  #mainContent { background: transparent; }
  #tab-dashboard {
    --qc-navy: var(--sc-ink);
    --qc-red: var(--sc-red);
    --qc-surface: var(--sc-paper);
    --qc-line: var(--sc-line);
    --qc-muted: var(--sc-muted);
    background: transparent;
  }
  .tab .page-head, .page-heading { background: transparent; box-shadow: none; }
  .tab .page-head h2, #tab-dashboard .page-head h2, .page-heading h1 {
    color: var(--sc-ink);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(26px, 2.5vw, 35px);
    font-weight: 400;
    letter-spacing: -.035em;
    line-height: 1.2;
  }
  .tab .page-head p, .page-heading p { color: var(--sc-muted); }
  .tab .page-head .page-label, .page-heading .eyebrow { color: var(--sc-red); }
  .tab .page-context span { border-color: var(--sc-line); border-radius: 8px; background: #ffffffb8; }
  .tab :is(.panel, .kpi), .panel, #tab-dashboard .panel, #tab-dashboard .executive-kpi,
  #reviewerCards > article, #clientDashboardCards > article {
    color: var(--sc-ink);
    border: 1px solid var(--sc-line);
    border-top-color: #fff;
    border-radius: 16px;
    background: linear-gradient(145deg, #fff, #fdfefe);
    box-shadow: var(--sc-shadow), inset 0 1px 0 #fff;
  }
  .panel .panel { box-shadow: 0 2px 8px #20334a05; }
  .tab .panel :is(h2, h3), #tab-dashboard .panel-title h2, #tab-dashboard .section-heading h2,
  .panel .section-heading :is(h2, h3), #reviewerCards h3 {
    font-family: inherit;
    font-weight: 650;
    color: var(--sc-ink);
    letter-spacing: -.02em;
  }
  .tab .kpi::before { opacity: .5; }
  #tab-dashboard .executive-kpi::before { content: none; }
  .tab .kpi strong, #tab-dashboard .kpi strong {
    font-family: inherit;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    color: var(--sc-ink);
  }
  .tab .kpi.green strong, #tab-dashboard .executive-kpi.green strong { color: var(--sc-green); }
  .tab .kpi.amber strong, #tab-dashboard .executive-kpi.amber strong { color: var(--sc-amber); }
  #tab-dashboard .kpi-icon, .tab .kpi-icon {
    color: #627d98;
    background: linear-gradient(145deg, #fff, #e9eef4);
    border: 1px solid #dde5ed;
    border-radius: 10px;
    box-shadow: inset 0 1px 0 #fff, 3px 5px 8px -5px #41597160;
  }
  #tab-dashboard .operations-command-strip {
    border-color: #d9e3ed;
    border-left-color: #6f89a2;
    border-radius: 12px;
    background: linear-gradient(110deg, #f8fafc, #edf2f7);
    box-shadow: inset 0 1px 0 #fff;
  }
  #tab-dashboard :is(.operations-command-icon, .command-strip-icon) {
    border-radius: 9px;
    background: linear-gradient(#fff, #eaf0f6);
    box-shadow: var(--sc-raised);
  }
  .tab .bar-track { background: #edf2f6; box-shadow: inset 0 1px 3px #213b5212; border-radius: 6px; }
  .tab .bar-track > i { box-shadow: inset 0 1px 1px #ffffff70; border-radius: 6px; }
  #reviewerWorkloadChart progress { border-radius: 6px; accent-color: #587996; }
  #reviewerWorkloadChart progress::-webkit-progress-bar { background: #edf2f6; border-radius: 6px; box-shadow: inset 0 1px 3px #213b5212; }
  #reviewerWorkloadChart progress::-webkit-progress-value { background: linear-gradient(#8099b1, #537594); border-radius: 6px; }

  /* Buttons retain their native disabled, hidden, loading and role guards. */
  .button, .tab table button, body > main button, dialog button:not(.icon-button):not(.text-button) {
    border-radius: 9px;
    box-shadow: var(--sc-raised);
    transition: background-color .15s, box-shadow .15s, transform .15s;
  }
  .button.neutral, #tab-dashboard .button.neutral, #taskDialog .button.neutral,
  body > main button:not(.primary):not(.danger):not([aria-current="page"]):not([aria-selected="true"]),
  dialog button.neutral {
    color: var(--sc-ink);
    border: 1px solid #d6dee7;
    background: linear-gradient(#fff, #f7f9fb);
    box-shadow: var(--sc-raised);
  }
  .button.primary, #tab-dashboard .button.primary, #taskDialog .button.primary,
  .login-card .button.primary, body > main button.primary, dialog button.primary {
    color: #fff;
    border: 1px solid #a44135;
    background: linear-gradient(160deg, #b65143, #a33c31);
    box-shadow: inset 0 1px 0 #ffffff35, 0 7px 14px -9px #87382db0;
  }
  .button.primary:hover:not(:disabled), #tab-dashboard .button.primary:hover:not(:disabled),
  #taskDialog .button.primary:hover:not(:disabled), body > main button.primary:hover:not(:disabled) {
    background: linear-gradient(160deg, #ad483b, #91362c);
    border-color: var(--sc-red-dark);
  }
  .button.neutral:hover:not(:disabled), #tab-dashboard .button.neutral:hover:not(:disabled),
  #taskDialog .button.neutral:hover:not(:disabled) { background: #eef3f7; }
  .button:active:not(:disabled), body > main button:active:not(:disabled) { transform: translateY(1px); }
  .button:disabled, body > main button:disabled { box-shadow: none; }
  :is(button, a, summary):focus-visible { outline: 3px solid #557797; outline-offset: 3px; }
  .tab :is(.text-button, .link-button:not(.button)) { color: var(--sc-red-dark); }
  body > main .tabs button[aria-current="page"], body > main .tabs button[aria-selected="true"] {
    background: linear-gradient(150deg, #37516d, #263b53);
    border-color: #263b53;
    color: #fff;
    box-shadow: inset 0 1px 0 #ffffff25, 0 5px 12px -9px #263b5380;
  }

  /* Keep register scrolling, sticky headers and pagination owned by each module. */
  .tab .table-wrap, .panel .table-scroll { border-color: var(--sc-line); border-radius: 10px; }
  .tab table thead th, #tab-dashboard thead th, .panel table thead th {
    background: #f0f4f8;
    color: #52677d;
    border-bottom-color: #dde5ed;
    text-transform: none;
    letter-spacing: .01em;
  }
  .tab table tbody td, .panel table tbody td { border-color: #e8edf2; font-variant-numeric: tabular-nums; }
  .tab table tbody tr:nth-child(even), #tab-dashboard tbody tr:nth-child(even),
  .panel table tbody tr:nth-child(even) { background: #fafbfd; }
  .tab table tbody tr:hover, #tab-dashboard tbody tr:hover, .panel table tbody tr:hover { background: #eef3f8; }
  .tab table .amount-due, .panel table .amount-due { color: #a3312b; }
  .tab :is(.badge, .pill), .panel .badge { border-radius: 7px; }

  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea {
    border-color: #d6dee7;
    border-radius: 8px;
    background-color: #fff;
    color: var(--sc-ink);
    box-shadow: inset 0 1px 2px #213b5205;
  }
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus,
  select:focus, textarea:focus {
    outline: 3px solid #7591ac33;
    outline-offset: 1px;
    border-color: #6886a2;
  }
  input[readonly], input:disabled, select:disabled, textarea:disabled { background: #eff3f7; color: #617185; }
  input::placeholder, textarea::placeholder { color: #758599; }
  dialog {
    color: var(--sc-ink);
    border: 1px solid var(--sc-line);
    border-radius: 16px;
    box-shadow: 0 35px 90px #20334a30, 0 4px 18px #20334a15;
  }
  dialog::backdrop { background: #22354a55; backdrop-filter: blur(3px); }
  dialog .dialog-head { border-color: var(--sc-line); }
  dialog .dialog-head h2 { color: var(--sc-ink); font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.03em; }
  dialog .icon-button { border-radius: 9px; background: linear-gradient(#fff, #eff3f7); border: 1px solid #dde5ec; color: #536b83; }
  #taskDialog, #projectDialog {
    --qc-navy: var(--sc-ink);
    --qc-red: var(--sc-red);
    --qc-line: var(--sc-line);
    --qc-muted: var(--sc-muted);
    --task-ink: var(--sc-ink);
    --task-muted: var(--sc-muted);
    --task-line: var(--sc-line);
    --task-accent: var(--sc-red);
    --project-ink: var(--sc-ink);
    --project-muted: var(--sc-muted);
    --project-accent: var(--sc-red);
    border-radius: 18px;
    box-shadow: 0 35px 90px #20334a30, 0 4px 18px #20334a15;
  }
  #taskForm .dialog-head, #projectForm .dialog-head { background: linear-gradient(140deg, #fff, #f4f7fa); }
  #taskDialog h2, #projectDialog h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
  #taskForm .task-form-body, #projectForm .project-form-body { background: #f3f6f9; }
  #taskForm .task-form-section, #projectForm .project-form-section {
    background: #fff;
    border: 1px solid var(--sc-line);
    border-radius: 12px;
    box-shadow: 0 4px 12px -9px #21394d4d;
  }
  #taskForm .task-section-number, #projectForm .project-section-number {
    border: 1px solid #e1e8ef;
    color: #60788f;
    background: linear-gradient(#f2f6fa, #e8eef4);
    border-radius: 8px;
  }
  #taskForm :is(input:not([type="hidden"]), select, textarea),
  #projectForm :is(input:not([type="hidden"]), select, textarea) {
    border-color: #d6dee7;
    border-radius: 8px;
    box-shadow: inset 0 1px 2px #213b5205;
  }
  #taskForm .task-form-footer, #projectForm .project-form-footer {
    background: #fff;
    border-color: var(--sc-line);
    box-shadow: 0 -4px 14px #20334a05;
  }

  .login-screen {
    background: radial-gradient(ellipse at 20% 16%, #e5ebf2 0, transparent 48%),
      radial-gradient(ellipse at 85% 86%, #f3e6e3 0, transparent 46%), #f4f6f8;
  }
  .login-card {
    background: linear-gradient(145deg, #fff, #fdfefe);
    border: 1px solid #fff;
    border-top: 4px solid var(--sc-red);
    border-radius: 18px;
    box-shadow: 0 25px 65px #20334a18, 0 3px 9px #20334a07;
  }
  .login-card h1 { color: var(--sc-ink); font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
  .login-card .text-button { color: #365b7d; }
  .login-eyebrow::after { background: var(--sc-red); }
  .workspace-loading { --loading-ink: var(--sc-ink); --loading-red: var(--sc-red); --loading-muted: var(--sc-muted); }
  .workspace-loading__card { border-radius: 20px; box-shadow: 0 25px 65px #20334a18, inset 0 1px 0 #fff; }
  .workspace-loading__orbit--outer {
    border-color: #ad4336;
    border-top-color: #d69387;
    border-right-color: #a3473a;
    border-bottom-color: #90372d;
    box-shadow: inset 0 2px 2px #ffffffa6, inset 0 -4px 2px #6c161620, 0 4px 0 #973c31, 0 8px 17px #99231b12;
  }
  .page-loading__ring { border-color: #e3eaf0; border-top-color: var(--sc-red); border-right-color: #c98074; }

  @media (max-width: 520px) {
    .tab .page-head h2, #tab-dashboard .page-head h2, .page-heading h1 { font-size: 27px; }
    .tab :is(.panel, .kpi), .panel, #tab-dashboard .panel, #tab-dashboard .executive-kpi { border-radius: 12px; }
    #taskDialog, #projectDialog, dialog { border-radius: 12px; }
    #taskForm :is(input:not([type="hidden"]), select, textarea),
    #projectForm :is(input:not([type="hidden"]), select, textarea) { font-size: 16px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .button, .tab table button, body > main button, dialog button, #appSidebar .nav-button { transition: none; }
    .workspace-loading__orbit, .workspace-loading__dots i, .page-loading__ring { animation: none; }
  }
}
