/* Fenyr working surface: solid content, optical glass for navigation only. */
:root {
  --page: #eef3f7;
  --surface: #ffffff;
  --surface-soft: #f4f7fa;
  --ink: #172e42;
  --muted: #526778;
  --border: #d8e2e9;
  --shadow: 0 2px 6px #17384e04, 0 12px 30px #17384e06;
  --rail-width: 94px;
}
:root[data-theme="dark"] {
  --page: #0d1722;
  --surface: #162431;
  --surface-soft: #1b2b3b;
  --ink: #e8f1f8;
  --muted: #a8bac9;
  --border: #304251;
  --shadow: 0 8px 30px #0002;
}
:root:not([data-theme="dark"]) body,
:root[data-theme="dark"] body {
  background:
    radial-gradient(ellipse at 0 0, #0072bc0b, transparent 55%), var(--page);
  background-attachment: fixed;
}
:root:not([data-glass="off"]) {
  --dock-glass: rgb(255 255 255 / 52%);
}
:root[data-theme="dark"]:not([data-glass="off"]) {
  --dock-glass: rgb(35 53 69 / 62%);
}
.glass-workspace
  :is(
    .panel,
    .path-card,
    .exam-card,
    .session-spotlight,
    .credential-card,
    .action-tile,
    .filter-bar,
    .learning-toolbar,
    .learning-filter-options
  ) {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: var(--shadow);
}
:root[data-theme="dark"]
  .glass-workspace
  :is(
    .panel,
    .path-card,
    .exam-card,
    .session-spotlight,
    .credential-card,
    .action-tile,
    .filter-bar,
    .learning-toolbar,
    .learning-filter-options
  ) {
  box-shadow: var(--shadow);
}
.glass-workspace .panel .panel,
.glass-workspace .path-card {
  box-shadow: none;
}
.glass-workspace :is(.filter-bar, .learning-toolbar) {
  padding: 12px;
  box-shadow: none;
  border-radius: 12px;
}
.glass-workspace .page-heading {
  margin-bottom: 24px;
  align-items: center;
}
.glass-workspace .page-heading h1 {
  font-size: clamp(28px, 2.3vw, 36px);
  font-weight: 650;
  letter-spacing: -0.035em;
}
.glass-workspace .page-heading .eyebrow {
  margin-bottom: 10px;
}
.glass-workspace
  :is(
    .muted,
    .workspace-caption,
    .section-heading > span,
    .session-spotlight p,
    .card-meta,
    .exam-window,
    .focus-foot
  ) {
  font-size: 0.875rem;
  line-height: 1.6;
}
.glass-workspace :is(.button, input, select, textarea) {
  border-radius: 10px;
}
.glass-workspace .button.primary {
  box-shadow: 0 2px 3px #17384e12;
}
.glass-workspace .workspace-bar {
  margin-top: 0;
  min-height: 92px;
  padding: 20px 0;
  border-bottom: 1px solid var(--border);
}
.glass-workspace .brand-capsule {
  gap: 16px;
}
.glass-workspace .brand-capsule img {
  width: 172px;
}
.glass-workspace .brand-product {
  font-size: 12px;
  letter-spacing: 0.12em;
  min-height: 32px;
}
.glass-workspace .profile-menu {
  border-radius: 12px;
  padding: 8px 10px;
}
.glass-workspace .profile-menu:hover {
  background: var(--surface);
}
.glass-workspace .avatar {
  width: 36px;
  height: 36px;
  font-size: 13px;
}
.glass-workspace .focus-card {
  background: linear-gradient(115deg, #073d5b, #122e44);
  border-color: #224b63;
  border-radius: 18px;
  box-shadow: 0 8px 24px #102e4512;
}
.glass-workspace .focus-card h2 {
  font-weight: 600;
}
.glass-workspace .focus-card p:not(.eyebrow) {
  font-size: 1rem;
}
.glass-workspace .action-grid {
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface);
}
.glass-workspace .action-grid .action-tile {
  border: 0;
  border-right: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  transform: none;
}
.glass-workspace .action-grid .action-tile:last-child {
  border-right: 0;
}
.glass-workspace .action-grid .action-tile:hover {
  background: var(--surface-soft);
}
.glass-workspace .action-tile p {
  font-size: 0.875rem;
}
.glass-workspace .journey-band {
  padding: 24px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--border);
  border-radius: 0;
}
.glass-workspace .exam-card[data-state="In progress"] {
  border-color: var(--blue);
}
.glass-workspace .academy-header {
  border-radius: 16px;
  background: var(--surface);
  border: 1px solid var(--border);
}
.glass-workspace :is(.academy-symbol, .badge-icon, .path-icon) {
  border-radius: 10px;
}
.glass-workspace
  :is(
    .academy-tools,
    .skill-blueprint,
    .evidence-ledger,
    .practice-brief,
    .insight-metrics article,
    .hrms-metrics article
  ) {
  border-radius: 16px;
  box-shadow: none;
}
.glass-workspace .view-tabs {
  gap: 6px;
}
.glass-workspace :is(.account-dropdown, .launcher, .personalise-panel) {
  border-radius: 18px;
}
.glass-workspace .floating-dock {
  background: var(--dock-glass);
  border: 1px solid color-mix(in srgb, var(--surface) 85%, transparent);
  border-bottom-color: color-mix(in srgb, var(--border) 75%, transparent);
  border-radius: 22px;
  backdrop-filter: blur(24px) saturate(1.12);
  -webkit-backdrop-filter: blur(24px) saturate(1.12);
  box-shadow:
    inset 0 1px 0 #ffffff6b,
    0 8px 24px #17384e0c,
    0 1px 3px #17384e08;
}
.glass-workspace .floating-dock .dock-item {
  gap: 3px;
  border-radius: 13px;
  font-size: 12px;
  color: var(--muted);
  transition:
    background 160ms,
    color 160ms;
}
.glass-workspace .floating-dock .dock-item:hover {
  transform: none;
  background: color-mix(in srgb, var(--surface) 65%, transparent);
  color: var(--ink);
}
.glass-workspace .floating-dock .dock-item.selected {
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  color: var(--blue);
  box-shadow: 0 1px 4px #17384e0b;
}
.glass-workspace .floating-dock .dock-icon {
  width: 30px;
  height: 30px;
  background: none;
  border: 0;
  box-shadow: none;
  color: inherit;
  filter: none;
}
.glass-workspace .floating-dock .dock-icon .icon {
  width: 23px;
  height: 23px;
  stroke-width: 1.7;
}
.glass-workspace .floating-dock .dock-item.selected::after {
  display: none;
}
.glass-workspace .floating-dock .dock-label,
.glass-workspace .floating-dock .dock-item.selected .dock-label {
  position: static;
  inset: auto;
  transform: none;
  visibility: visible;
  opacity: 1;
  padding: 0;
  font-size: 12px;
  line-height: 1.35;
  background: none;
  color: inherit;
  border: 0;
  box-shadow: none;
}
:root[data-theme="dark"]
  .glass-workspace
  .floating-dock
  .dock-item.selected
  .dock-label {
  color: var(--blue);
}
@media (min-width: 1025px) and (min-height: 601px) and (pointer: fine) {
  .glass-workspace.app-shell {
    --desktop-dock-icon: 30px;
    grid-template-columns: minmax(24px, 1fr) minmax(
        0,
        var(--workspace-content-max)
      ) 30px var(--rail-width) minmax(24px, 1fr);
  }
  .glass-workspace .workspace-bar {
    grid-column: 2/5;
    width: 100%;
  }
  .glass-workspace main#main-content {
    padding-top: 28px;
  }
  .glass-workspace .floating-dock {
    width: var(--rail-width);
    right: max(
      24px,
      calc(
        (100vw - var(--workspace-content-max) - var(--rail-width) - 30px) / 2
      )
    );
    padding: 7px;
    gap: 4px;
  }
  .glass-workspace .floating-dock .dock-item {
    width: 100%;
    min-height: 64px;
    padding: 7px 2px;
  }
}
@media (max-width: 1024px), (max-height: 600px), (pointer: coarse) {
  .glass-workspace .workspace-bar {
    min-height: 78px;
    width: calc(100% - 40px);
    padding: 14px 0;
  }
  .glass-workspace .floating-dock {
    width: min(390px, calc(100% - 24px));
    padding: 6px;
    gap: 4px;
    margin: 6px auto max(10px, env(safe-area-inset-bottom));
    border-radius: 20px;
  }
  .glass-workspace .floating-dock .dock-item {
    flex: 1;
    min-width: 0;
    min-height: 58px;
    padding: 5px;
  }
}
@media (max-width: 600px) {
  .glass-workspace .brand-capsule img {
    width: 128px;
  }
  .glass-workspace .brand-product {
    font-size: 10px;
    padding-left: 12px;
  }
  .glass-workspace .action-grid {
    grid-template-columns: 1fr;
  }
  .glass-workspace .action-grid .action-tile {
    border-right: 0;
    border-bottom: 1px solid var(--border);
    padding: 18px;
  }
  .glass-workspace .action-grid .action-tile:last-child {
    border-bottom: 0;
  }
}
:root[data-glass="off"] .glass-workspace .floating-dock {
  background: var(--surface);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
@media (prefers-reduced-transparency: reduce) {
  .glass-workspace .floating-dock {
    background: var(--surface);
    backdrop-filter: none;
  }
}
@supports not (backdrop-filter: blur(1px)) {
  .glass-workspace .floating-dock {
    background: var(--surface);
  }
}
