/* OSC AI Workspace · Mint Paper Admin UI · 2026-11-06
 * Derived from the existing login page v14 paper + mint palette.
 * VISUAL ONLY.  All authenticated view overrides live below .app;
 * do not touch .ws8 login UI, application routing or JavaScript handlers.
 */
body[data-app="workspace"] .app {
  --mint-ink: #173f3f;
  --mint-deep: #28635b;
  --mint-primary: #5ba89c;
  --mint-primary-hover: #408a7e;
  --mint-soft: #aadccd;
  --mint-paper: #e2f3ee;
  --mint-white: #ffffff;
  --mint-cloud: #f7faf8;
  --mint-muted: #577973;
  --mint-muted-2: #77938c;
  --mint-border: #d9e9e3;
  --mint-highlight: #eef8f2;
  --mint-shadow: 0 14px 45px rgba(23,63,63,.055),0 2px 5px rgba(23,63,63,.025);
  /* Map the legacy GEO tokens used throughout the authenticated app. */
  --geo-brand: var(--mint-primary);
  --geo-brand-hover: var(--mint-deep);
  --geo-brand-tint: var(--mint-paper);
  --geo-title: var(--mint-ink);
  --geo-secondary: var(--mint-muted);
  --geo-muted: var(--mint-muted-2);
  --geo-border: var(--mint-border);
  --geo-page: var(--mint-cloud);
  --geo-surface: var(--mint-white);
  color: var(--mint-ink);
  background:
    radial-gradient(ellipse 55% 43% at 8% 6%, rgba(170,220,205,.38),transparent 75%),
    radial-gradient(ellipse 50% 34% at 89% 43%,rgba(226,243,238,.58),transparent 80%),
    linear-gradient(116deg,#f0f8f4 0%,#f8faf7 57%,#ffffff 100%);
  min-height: 100dvh;
  accent-color: var(--mint-primary);
}

/* Navigation: quiet paper sidebar, mint selection, original logo. */
body[data-app="workspace"] .app .side {
  background: linear-gradient(175deg,rgba(255,255,255,.985),rgba(244,250,246,.985));
  border-right: 1px solid var(--mint-border);
  box-shadow: 5px 0 28px rgba(23,63,63,.035);
}
body[data-app="workspace"] .app .brand {
  color: var(--mint-ink);
  font-weight: 790;
  letter-spacing: -.32px;
  gap: 10px;
}
body[data-app="workspace"] .app .side .brand .mark {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border: 0;
  border-radius: 0;
  background: transparent url('/assets/osc-workspace-mark.svg') center / contain no-repeat !important;
  box-shadow: none;
  font-size: 0;
  color: transparent;
}
body[data-app="workspace"] .app .navlabel {
  color: #75948c;
  font-size: 10px;
  font-weight: 760;
  letter-spacing: .14em;
}
body[data-app="workspace"] .app .nav {
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--mint-muted);
  font-weight: 560;
  transition: background .16s,border-color .16s,color .16s,box-shadow .16s;
}
body[data-app="workspace"] .app .nav:hover {
  color: var(--mint-deep);
  background: rgba(226,243,238,.77);
  border-color: rgba(91,168,156,.14);
}
body[data-app="workspace"] .app .nav.active,
body[data-app="workspace"] .app .nav.active:hover {
  color: var(--mint-ink);
  background: linear-gradient(110deg,rgba(170,220,205,.68),rgba(226,243,238,.73));
  border-color: rgba(91,168,156,.22);
  box-shadow: none; /* selected nav without a vertical stripe */
  font-weight: 760;
}
body[data-app="workspace"] .app .navicon {color:var(--mint-primary-hover)}
body[data-app="workspace"] .app .sidefooter {border-top-color: var(--mint-border)}
body[data-app="workspace"] .app .sidebar-toggle {
  color: var(--mint-muted);
  background: rgba(255,255,255,.7);
  border-color: var(--mint-border);
  border-radius: 9px;
}
body[data-app="workspace"] .app .sidebar-toggle:hover,
body[data-app="workspace"] .app .sidebar-toggle:focus-visible {
  color: var(--mint-ink);
  background: var(--mint-paper);
  border-color: var(--mint-soft);
}

/* Title bar, identity and dropdown.  No positional changes to existing controls. */
body[data-app="workspace"] .app .top {
  background: rgba(255,255,255,.86);
  border-bottom: 1px solid var(--mint-border);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
body[data-app="workspace"] .app .top-title {
  color: var(--mint-ink);
  font-weight: 740;
  letter-spacing: -.2px;
}
body[data-app="workspace"] .app .chip {
  background: var(--mint-highlight);
  border: 1px solid rgba(91,168,156,.14);
  color: var(--mint-muted);
  border-radius: 7px;
}
body[data-app="workspace"] .app .toplinks {color:var(--mint-muted)}
body[data-app="workspace"] .app .toplinks a:hover {color:var(--mint-deep)}
body[data-app="workspace"] .app .avatar {
  color: var(--mint-deep);
  background: linear-gradient(145deg,#d8efe6,#b6dfd0);
  border: 1px solid rgba(91,168,156,.18);
}
body[data-app="workspace"] .app .userdetails .username,
body[data-app="workspace"] .app .user-dropdown-identity strong {color:var(--mint-ink)}
body[data-app="workspace"] .app .accountname,
body[data-app="workspace"] .app .user-chevron {color:var(--mint-muted-2)}
body[data-app="workspace"] .app .user-trigger {border-radius:10px;color:var(--mint-ink)}
body[data-app="workspace"] .app .user-trigger:hover,
body[data-app="workspace"] .app .user-trigger[aria-expanded="true"] {
  background: var(--mint-highlight);
  border-color: var(--mint-border);
}
body[data-app="workspace"] .app .user-dropdown {
  border-radius: 13px;
  border-color: var(--mint-border);
  box-shadow: 0 20px 50px rgba(23,63,63,.13);
}
body[data-app="workspace"] .app .user-dropdown button {border-radius:8px;color:var(--mint-ink)}
body[data-app="workspace"] .app .user-dropdown button:hover,
body[data-app="workspace"] .app .user-dropdown button:focus-visible {
  background:var(--mint-highlight);
  color:var(--mint-deep);
}
body[data-app="workspace"] .app .user-dropdown .logout-action {color:#a84742}
body[data-app="workspace"] .app .user-dropdown-divider {border-color:var(--mint-border)}

/* Page heading and overall rhythm. */
body[data-app="workspace"] .app .content {max-width: 1340px; padding-top: 39px}
body[data-app="workspace"] .app .pagehead {margin-bottom: 28px}
body[data-app="workspace"] .app .eyebrow {
  color: #397f72;
  font-weight: 790;
  letter-spacing: .14em;
}
body[data-app="workspace"] .app .pagehead h1 {
  color: var(--mint-ink);
  font-weight: 790;
  letter-spacing: -.95px;
  font-size: clamp(24px,2.5vw,31px);
}
body[data-app="workspace"] .app .sub,
body[data-app="workspace"] .app .muted,
body[data-app="workspace"] .app .smallnote {color:var(--mint-muted);line-height:1.75}
body[data-app="workspace"] .app .smallnote {font-size:12px}

/* Paper surfaces, cards, catalog and project lists. */
body[data-app="workspace"] .app .card,
body[data-app="workspace"] .app .tablewrap,
body[data-app="workspace"] .app .project,
body[data-app="workspace"] .app .security-section {
  border: 1px solid var(--mint-border);
  background: rgba(255,255,255,.94);
  border-radius: 14px;
  box-shadow: var(--mint-shadow);
}
body[data-app="workspace"] .app .card,
body[data-app="workspace"] .app .security-section {padding: 25px}
body[data-app="workspace"] .app .cards {gap:18px}
body[data-app="workspace"] .app .cards>.card {
  background: linear-gradient(150deg,rgba(255,255,255,.98) 22%,rgba(235,247,240,.68));
  transition: border-color .17s,box-shadow .17s,transform .17s;
}
body[data-app="workspace"] .app .cards>.card:hover {
  border-color: #b6dcd0;
  box-shadow: 0 19px 44px rgba(23,63,63,.09);
  transform: translateY(-2px);
}
body[data-app="workspace"] .app .card h3,
body[data-app="workspace"] .app .security-section h3,
body[data-app="workspace"] .app .project b {color:var(--mint-ink)}
body[data-app="workspace"] .app .stat {color:var(--mint-deep);font-variant-numeric:tabular-nums}
body[data-app="workspace"] .app .mark {
  background:var(--mint-primary);
  border-radius:10px;
  box-shadow:0 6px 14px rgba(91,168,156,.13);
}
/* Catalog sets the active mark to legacy orange in inline JS: visually correct it here. */
body[data-app="workspace"] .app .card .mark[style*="#ff6e40"],
body[data-app="workspace"] .app .card .mark[style*="#FF6E40"] {
  background:var(--mint-primary)!important;
}
body[data-app="workspace"] .app .project {
  border-radius: 12px;
  transition: border-color .16s,background .16s;
}
body[data-app="workspace"] .app .project:hover {border-color:#a6d5c6;background:#fbfefc}
body[data-app="workspace"] .app .itemrow {border-color:var(--mint-border);border-radius:9px}
body[data-app="workspace"] .app .itemrow:hover {border-color:#a6d5c6;background:#fbfefc}
body[data-app="workspace"] .app .empty {color:var(--mint-muted)}
body[data-app="workspace"] .app .empty h3 {color:var(--mint-ink)}

/* Forms: clean underline-inspired focus cue from the sign-in page. */
body[data-app="workspace"] .app .field label {color:var(--mint-ink);font-weight:700}
body[data-app="workspace"] .app .field input:not([type="checkbox"]):not([type="radio"]),
body[data-app="workspace"] .app .field textarea,
body[data-app="workspace"] .app .field select,
body[data-app="workspace"] .app input.search,
body[data-app="workspace"] .app select.search {
  border: 1px solid #d6e6df;
  border-radius: 9px;
  background: #fbfdfb;
  color: var(--mint-ink);
  transition: border-color .16s,box-shadow .16s,background .16s;
}
body[data-app="workspace"] .app .field input:not([type="checkbox"]):not([type="radio"]):focus,
body[data-app="workspace"] .app .field textarea:focus,
body[data-app="workspace"] .app .field select:focus,
body[data-app="workspace"] .app input.search:focus,
body[data-app="workspace"] .app select.search:focus {
  outline: 0;
  border-color: var(--mint-primary);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(91,168,156,.14);
}
body[data-app="workspace"] .app input[type="checkbox"],
body[data-app="workspace"] .app input[type="radio"] {accent-color:var(--mint-primary)}
body[data-app="workspace"] .app input::placeholder,
body[data-app="workspace"] .app textarea::placeholder {color:#91a79d}
body[data-app="workspace"] .app #permissionForm label input[type=checkbox] {accent-color:var(--mint-primary)}

/* Buttons, links, progress and badges.  Use dark teal for accessible white CTA text. */
body[data-app="workspace"] .app .btn {
  color:var(--mint-ink);
  background:#fff;
  border-color:#cfe2d9;
  border-radius:9px;
  transition: background .16s,border-color .16s,box-shadow .16s;
}
body[data-app="workspace"] .app .btn:hover {background:var(--mint-highlight);border-color:#9bcfbf}
body[data-app="workspace"] .app .btn.primary {
  color:#fff;
  background:linear-gradient(110deg,#286c62,#397f73);
  border-color:#286c62;
  box-shadow:0 6px 17px rgba(40,108,98,.14);
}
body[data-app="workspace"] .app .btn.primary:hover {
  color:#fff;
  background:linear-gradient(110deg,#205c54,#286c62);
  border-color:#205c54;
  box-shadow:0 9px 23px rgba(32,92,84,.19);
}
body[data-app="workspace"] .app .btn.flat {border-color:transparent;background:transparent;box-shadow:none}
body[data-app="workspace"] .app .btn.danger {color:#a84742;background:#fff}
body[data-app="workspace"] .app .link {color:var(--mint-deep)}
body[data-app="workspace"] .app .link:hover {color:#164f47}
body[data-app="workspace"] .app .pill {color:#6d674e;background:#f7f3e5;border-radius:999px}
body[data-app="workspace"] .app .pill.ok {color:#226c54;background:#e1f4e9}
body[data-app="workspace"] .app .pill.off {color:#657a72;background:#edf2ee}
body[data-app="workspace"] .app .stage .dot {background:#dcece5}
body[data-app="workspace"] .app .stage .dot.passed {background:#95cdb9}
body[data-app="workspace"] .app .stage .dot.current {background:var(--mint-primary)}
body[data-app="workspace"] .app .approval {
  color:#31594e;
  background:linear-gradient(110deg,#e9f6ee,#f6fbf7);
  border-left:3px solid var(--mint-primary);
  border-radius:8px;
}

/* Tabular administration and account security. */
body[data-app="workspace"] .app .tablewrap {overflow:auto}
body[data-app="workspace"] .app th {
  color:#426d63;
  background:#f0f8f3;
  font-weight:720;
  border-bottom:1px solid var(--mint-border);
}
body[data-app="workspace"] .app td {border-color:#edf3ee;color:var(--mint-ink)}
body[data-app="workspace"] .app tbody tr:hover td {background:#f7fbf8}
body[data-app="workspace"] .app .security-status {
  color:var(--mint-deep);
  background:#e2f3ee;
  border:1px solid #cde7dd;
  border-radius:999px;
}
body[data-app="workspace"] .app .session-entry {border-bottom-color:var(--mint-border)}
body[data-app="workspace"] .app .session-entry strong {color:var(--mint-ink)}
body[data-app="workspace"] .app .security-section {margin-top:20px}

/* Dialogs/toasts are dynamically appended to <body>, outside .app. */
body[data-app="workspace"]:has(.app) .overlay {background:rgba(23,63,63,.36);backdrop-filter:blur(3px)}
body[data-app="workspace"]:has(.app) .modal {
  color:#173f3f;
  background:linear-gradient(148deg,#fff,#f1f9f4);
  border:1px solid #d9e9e3;
  border-radius:15px;
  box-shadow:0 28px 80px rgba(23,63,63,.21);
}
body[data-app="workspace"]:has(.app) .modal h2 {color:#173f3f}
body[data-app="workspace"]:has(.app) .toast {
  background:#245e54;
  border-radius:10px;
  box-shadow:0 15px 45px rgba(23,63,63,.2);
}
body[data-app="workspace"]:has(.app) .toast.err {background:#a84742}

/* Keyboard navigation and mobile safeguards. */
body[data-app="workspace"] .app :is(a,button,input,select,textarea):focus-visible {
  outline: 2px solid #5ba89c;
  outline-offset: 2px;
}
@media(max-width:1000px){
  body[data-app="workspace"] .app .content {padding-top:27px}
  body[data-app="workspace"] .app .cards {gap:13px}
}
@media(max-width:700px){
  body[data-app="workspace"] .app .content {padding:23px 14px 50px}
  body[data-app="workspace"] .app .card,
  body[data-app="workspace"] .app .security-section {padding:20px 17px}
  body[data-app="workspace"] .app .pagehead {gap:12px}
  body[data-app="workspace"] .app .pagehead h1 {font-size:25px}
  body[data-app="workspace"] .app .side .brand .mark {width:31px;height:31px;flex-basis:31px}
}
@media(max-width:480px){
  body[data-app="workspace"] .app .top {gap:6px}
  body[data-app="workspace"] .app .top-title {font-size:11px}
  body[data-app="workspace"] .app .user-dropdown {max-width:min(225px,calc(100vw - 77px))}
}
@media(prefers-reduced-motion:reduce){
  body[data-app="workspace"] .app .cards>.card,
  body[data-app="workspace"] .app .nav,
  body[data-app="workspace"] .app .btn {transition:none;transform:none}
}

/* Modal content lives outside the .app DOM subtree; match its interactive palette. */
body[data-app="workspace"]:has(.app) .modal .field label {color:#173f3f;font-weight:700}
body[data-app="workspace"]:has(.app) .modal .field input:not([type="checkbox"]):not([type="radio"]),
body[data-app="workspace"]:has(.app) .modal .field textarea,
body[data-app="workspace"]:has(.app) .modal .field select {
  color:#173f3f;
  background:#fbfdfb;
  border-color:#d6e6df;
  border-radius:9px;
}
body[data-app="workspace"]:has(.app) .modal .field :is(input,select,textarea):focus {
  border-color:#5ba89c;
  outline:0;
  box-shadow:0 0 0 3px rgba(91,168,156,.14);
}
body[data-app="workspace"]:has(.app) .modal input:is([type="checkbox"],[type="radio"]) {accent-color:#5ba89c}
body[data-app="workspace"]:has(.app) .modal .btn {
  color:#173f3f;
  background:#fff;
  border-color:#cfe2d9;
  border-radius:9px;
}
body[data-app="workspace"]:has(.app) .modal .btn:hover {background:#eef8f2;border-color:#9bcfbf}
body[data-app="workspace"]:has(.app) .modal .btn.primary {
  color:#fff;
  background:#286c62;
  border-color:#286c62;
}
body[data-app="workspace"]:has(.app) .modal .btn.primary:hover {background:#205c54;border-color:#205c54;color:#fff}
body[data-app="workspace"]:has(.app) .modal .sub,
body[data-app="workspace"]:has(.app) .modal .smallnote {color:#577973}
body[data-app="workspace"]:has(.app) .modal :is(a,button,input,select,textarea):focus-visible {
  outline:2px solid #5ba89c;
  outline-offset:2px;
}

/* Application center v2 · four equal-width launch cards */
body[data-app="workspace"] .app .app-catalog-grid {
 display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;align-items:stretch
}
body[data-app="workspace"] .app .app-catalog-card {
 min-width:0;min-height:280px;display:flex;flex-direction:column;gap:18px;
 padding:24px 21px 21px;border-radius:17px;
 background:linear-gradient(145deg,#fff 8%,#f2faf5 100%);
 box-shadow:0 12px 28px rgba(23,63,63,.045);border:1px solid #d9e9e3;
}
body[data-app="workspace"] .app .app-catalog-top {display:flex;align-items:flex-start;justify-content:space-between}
body[data-app="workspace"] .app .app-catalog-icon {
 width:49px;height:49px;display:grid;place-items:center;border-radius:15px;
 font-size:25px;font-weight:500;color:#327c6e;background:#e2f3ee;border:1px solid #c9e7da;
}
body[data-app="workspace"] .app .app-catalog-index {font-size:11px;letter-spacing:.08em;color:#7b9d92;font-weight:700}
body[data-app="workspace"] .app .app-catalog-info {flex:1}
body[data-app="workspace"] .app .app-catalog-tag {
 display:inline-block;border-radius:100px;background:#e8f6ee;color:#317b65;
 padding:4px 10px;font-size:11px;font-weight:700;margin-bottom:10px;
}
body[data-app="workspace"] .app .app-catalog-card--restricted .app-catalog-tag {color:#8e6935;background:#fff3db}
body[data-app="workspace"] .app .app-catalog-card--coming_soon .app-catalog-tag {color:#687f7a;background:#edf1f0}
body[data-app="workspace"] .app .app-catalog-info h3 {margin:0 0 10px;font-size:18px;letter-spacing:-.025em}
body[data-app="workspace"] .app .app-catalog-info p {font-size:12px;color:#638179;line-height:1.8;margin:0;min-height:42px}
body[data-app="workspace"] .app .app-catalog-footer {margin-top:auto}
body[data-app="workspace"] .app .app-catalog-open {width:100%;justify-content:space-between;border-radius:10px;background:#e4f3eb;color:#246b5b;border:1px solid #c8e6da}
body[data-app="workspace"] .app .app-catalog-open:hover {color:#173f3f;background:#d4ecdf}
body[data-app="workspace"] .app .app-catalog-unavailable {font-size:12px;color:#84978e}

/* Real user activity feed, scoped to the logged-in user by default */
body[data-app="workspace"] .app .activity-panel {padding:27px;margin-top:25px}
body[data-app="workspace"] .app .activity-header {display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
body[data-app="workspace"] .app .activity-overline {font-size:11px;letter-spacing:.12em;font-weight:750;color:#569c8d}
body[data-app="workspace"] .app .activity-header h2 {font-size:20px;letter-spacing:-.4px;margin:6px 0 5px;color:#173f3f}
body[data-app="workspace"] .app .activity-header p {margin:0;font-size:12px}
body[data-app="workspace"] .app .activity-toolbar {display:flex;align-items:center;gap:12px;justify-content:space-between;margin:21px 0 16px;flex-wrap:wrap}
body[data-app="workspace"] .app .activity-filters {display:flex;gap:7px;align-items:center;flex-wrap:wrap}
body[data-app="workspace"] .app .activity-filter {border:1px solid #d8e8e0;background:#fff;color:#628079;border-radius:9px;padding:8px 11px;font-size:12px;font-weight:650}
body[data-app="workspace"] .app .activity-filter:hover {background:#f1faf5;color:#276956}
body[data-app="workspace"] .app .activity-filter.selected {background:#dff2e8;color:#226653;border-color:#afd8c9;box-shadow:none}
body[data-app="workspace"] .app .activity-scope {padding:8px 11px;border:1px solid #d8e8e0;border-radius:8px;background:white;color:#28635b}
body[data-app="workspace"] .app .activity-results {min-height:110px}
body[data-app="workspace"] .app .activity-table-scroll {overflow-x:auto;border-radius:11px;border:1px solid #dcebe4}
body[data-app="workspace"] .app .activity-table {width:100%;min-width:640px;border-collapse:collapse}
body[data-app="workspace"] .app .activity-table th {background:#f2f9f5;color:#638079;font-size:11px;padding:13px 14px}
body[data-app="workspace"] .app .activity-table td {background:#fff;padding:14px;font-size:12px;color:#395e55;border-top:1px solid #eff4f1}
body[data-app="workspace"] .app .activity-table tr:hover td {background:#f9fcfa}
body[data-app="workspace"] .app .activity-time {white-space:nowrap;font-variant-numeric:tabular-nums;color:#79918a !important}
body[data-app="workspace"] .app .activity-detail {max-width:360px;overflow-wrap:anywhere;color:#71847d !important}
body[data-app="workspace"] .app .activity-app {display:inline-block;padding:4px 8px;border-radius:7px;background:#eaf5ef;color:#276c5a;white-space:nowrap;font-weight:680}
body[data-app="workspace"] .app .activity-app--geo {background:#e8f4f3;color:#317a75}
body[data-app="workspace"] .app .activity-app--plan {background:#f0f3ec;color:#607e53}
body[data-app="workspace"] .app .activity-empty {padding:39px 12px;display:flex;flex-direction:column;align-items:center;gap:7px;color:#728982;font-size:12px}
body[data-app="workspace"] .app .activity-empty strong {font-size:15px;color:#385f53}
body[data-app="workspace"] .app .activity-loading {padding:45px;text-align:center;color:#738d83}
body[data-app="workspace"] .app .activity-count {padding:12px 1px 0;font-size:11px;color:#82948d}
body[data-app="workspace"] .app .activity-disclaimer {font-size:11px;line-height:1.8;color:#82978f;margin:15px 0 0}
@media(max-width:1160px){body[data-app="workspace"] .app .app-catalog-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){body[data-app="workspace"] .app .app-catalog-grid {grid-template-columns:1fr}body[data-app="workspace"] .app .app-catalog-card {min-height:228px}body[data-app="workspace"] .app .activity-panel {padding:17px}body[data-app="workspace"] .app .activity-header {flex-wrap:wrap}}