.workspace-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 0 16px;
  scrollbar-width: thin;
  position: sticky;
  top: 0;
  z-index: 30;
  background: linear-gradient(180deg, rgba(10,13,22,.98), rgba(10,13,22,.92));
  backdrop-filter: blur(10px);
}

.workspace-tab {
  flex: 0 0 auto;
  border: 1px solid #263a5e;
  border-radius: 999px;
  background: #10192c;
  color: #a8b7d0;
  padding: 9px 14px;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .03em;
}

.workspace-tab:hover { border-color: #54dff4; color: #eafcff; }
.workspace-tab.active {
  color: #06151b;
  border-color: #6df1dd;
  background: linear-gradient(90deg, #70def0, #73f0cb);
}

.workspace-panel { display: grid; gap: 20px; }
.workspace-panel[hidden] { display: none !important; }
.workspace-intro { padding: 18px 20px; }
.workspace-intro h2 { margin: 4px 0 6px; font-size: 1.45rem; }
.workspace-intro p { margin: 0; color: #93a3be; line-height: 1.55; }

.workspace-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.workspace-stat,
.resource-card,
.tracker-card,
.workspace-data-card {
  border: 1px solid #213451;
  background: #0d1628;
  border-radius: 15px;
  padding: 14px;
}

.workspace-stat span,
.tracker-card .tracker-label,
.workspace-data-card span {
  display: block;
  color: #778aa9;
  font-size: .67rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.workspace-stat strong,
.workspace-data-card strong { display: block; margin-top: 6px; font-size: 1.2rem; }

.tracker-builder { display: grid; gap: 14px; }
.tracker-form {
  display: grid;
  grid-template-columns: minmax(240px, 2fr) repeat(4, minmax(82px, .55fr)) auto;
  gap: 8px;
  align-items: end;
}
.tracker-form label { color: #8495b2; font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }
.tracker-form label > input,
.tracker-form label > select { margin-top: 5px; width: 100%; }
.tracker-form button { min-height: 42px; }

.tracker-list { display: grid; gap: 12px; }
.tracker-card { display: grid; gap: 12px; }
.tracker-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.tracker-heading h3 { margin: 0; font-size: 1rem; }
.tracker-heading .tracker-score { font-size: 1.15rem; color: #bdf9ff; }
.tracker-progress {
  height: 9px;
  overflow: hidden;
  border: 1px solid #243854;
  background: #07101e;
  border-radius: 999px;
}
.tracker-progress > div { height: 100%; background: linear-gradient(90deg, #70def0, #73f0cb); }
.tracker-requirements { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.tracker-requirement { border: 1px solid #20324e; border-radius: 10px; padding: 8px; background: #101b30; }
.tracker-requirement strong { display: block; margin-top: 4px; font-size: .82rem; }
.tracker-requirement.complete { border-color: rgba(78,222,165,.38); }
.tracker-actions { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.tracker-status { color: #96a8c4; font-size: .75rem; }
.tracker-remove { border-color: rgba(255,105,105,.3); color: #ffaaaa; background: transparent; padding: 7px 10px; }

.resource-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; }
.resource-card { display: flex; flex-direction: column; gap: 8px; }
.resource-card h3 { margin: 0; font-size: 1rem; }
.resource-card p { margin: 0; color: #8fa1bd; font-size: .8rem; line-height: 1.45; flex: 1; }
.resource-card a { color: #79e9f4; font-weight: 800; font-size: .78rem; }

.workspace-table { width: 100%; border-collapse: collapse; font-size: .78rem; }
.workspace-table th,
.workspace-table td { padding: 9px 8px; border-bottom: 1px solid #1c2d48; text-align: left; }
.workspace-table th { color: #7f91ae; text-transform: uppercase; letter-spacing: .06em; font-size: .64rem; }
.workspace-table td strong { color: #eef6ff; }

.workspace-note { color: #899bb8; font-size: .8rem; line-height: 1.5; }
.workspace-error { color: #ffaaa5; border: 1px solid rgba(255,100,100,.25); background: rgba(88,20,24,.18); padding: 12px; border-radius: 12px; }

@media (max-width: 900px) {
  .tracker-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tracker-form label:first-child { grid-column: 1 / -1; }
  .tracker-requirements { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 540px) {
  .workspace-tabs { margin-inline: -4px; }
  .tracker-form { grid-template-columns: 1fr; }
  .tracker-form label:first-child { grid-column: auto; }
  .tracker-requirements { grid-template-columns: 1fr; }
}