:root {
  --bg: #07111f;
  --bg-deep: #040c17;
  --panel: #0c192a;
  --panel2: #102238;
  --panel3: #0a1728;
  --line: #203752;
  --line-bright: #31577e;
  --text: #eef6ff;
  --muted: #8fa9c4;
  --blue: #55a8ff;
  --blue-soft: #9dccff;
  --purple: #9c7cff;
  --green: #5ce1a5;
  --yellow: #f0c96b;
  --red: #ff8f9b;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  background:
    radial-gradient(
      circle at 72% -10%,
      #162a55 0,
      transparent 36%
    ),
    var(--bg);
  color: var(--text);
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

/* =========================================================
   APP SHELL
   ========================================================= */

.app {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  min-height: 100vh;
}

aside {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 26px 18px;
  border-right: 1px solid var(--line);
  background: rgba(4, 12, 23, 0.9);
  backdrop-filter: blur(16px);
}

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 0 8px 28px;
}

.mark {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border: 1px solid #548ee0;
  border-radius: 12px;
  background:
    linear-gradient(
      145deg,
      #142e4e,
      #11182e
    );
  font-weight: 800;
}

.brand b {
  font-size: 12px;
  letter-spacing: 0.12em;
}

.brand small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.16em;
}

nav {
  display: grid;
  gap: 6px;
}

.nav {
  width: 100%;
  padding: 11px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  text-align: left;
  font-size: 14px;
  transition:
    background 0.18s ease,
    color 0.18s ease;
}

.nav:hover,
.nav.active {
  background: #11243a;
  color: #fff;
}

.nav.active {
  box-shadow:
    inset 3px 0 0 var(--blue);
}

.asideFoot {
  margin-top: auto;
  padding: 20px 8px 0;
  border-top: 1px solid var(--line);
}

.asideFoot span {
  color: var(--blue);
  font-size: 9px;
  letter-spacing: 0.14em;
}

.asideFoot b {
  display: block;
  margin-top: 5px;
  font-size: 12px;
}

main {
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
  padding: 28px 34px 70px;
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  margin-bottom: 28px;
}

header h1 {
  margin: 6px 0 0;
}

.profile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0b1727;
}

.profile small {
  display: block;
  color: var(--muted);
  font-size: 10px;
}

.mentor-presence-display { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:13px; }
.presence-title { color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.13em; }
.presence-person { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border:1px solid var(--line); border-radius:999px; background:#091727; color:#dbeafa; font-size:12px; }
.presence-person small { color:var(--muted); font-size:11px; }
.presence-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
.presence-dot.available { background:#54e1aa; box-shadow:0 0 9px rgba(84,225,170,.75); }
.presence-dot.away { background:#58a9ff; box-shadow:0 0 9px rgba(88,169,255,.7); }
.presence-dot.offline { background:#ef6c75; box-shadow:0 0 9px rgba(239,108,117,.55); }

.dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--green);
  box-shadow:
    0 0 12px var(--green);
}

/* =========================================================
   TYPOGRAPHY
   ========================================================= */

.eyebrow,
.small-label,
.label {
  display: block;
  color: var(--blue);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

.small-label {
  color: #7fb9f4;
}

h1,
h2,
h3,
h4 {
  color: var(--text);
}

h1 {
  margin: 7px 0 0;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.12;
}

h2 {
  margin: 8px 0 12px;
  font-size: 21px;
  line-height: 1.25;
}

h3 {
  margin: 8px 0;
  font-size: 16px;
  line-height: 1.35;
}

p {
  line-height: 1.6;
}

.lead {
  max-width: 900px;
  margin: 15px 0 0;
  color: #b0c9e2;
  font-size: 16px;
  line-height: 1.7;
}

.helper,
.section-intro,
.muted {
  color: var(--muted);
  line-height: 1.6;
}

.section-intro {
  max-width: 900px;
  margin-bottom: 22px;
}

.page-intro {
  margin-bottom: 24px;
}

/* =========================================================
   GENERAL PANELS
   ========================================================= */

.panel,
.card,
.hero-card,
.stat-card,
.week-card {
  border: 1px solid var(--line);
  background:
    linear-gradient(
      145deg,
      rgba(17, 36, 58, 0.96),
      rgba(8, 22, 38, 0.96)
    );
  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.16);
}

.panel {
  margin-bottom: 18px;
  padding: 22px;
  border-radius: 18px;
}

.compact-panel {
  padding: 18px 22px;
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}

.panel-heading p {
  margin-bottom: 0;
  color: var(--muted);
}

.muted-panel {
  background:
    linear-gradient(
      145deg,
      rgba(11, 25, 42, 0.76),
      rgba(7, 17, 31, 0.82)
    );
}

.approved-panel {
  border-color: #2d7359;
  background:
    linear-gradient(
      145deg,
      rgba(16, 59, 49, 0.34),
      rgba(8, 28, 28, 0.48)
    );
}

.revision-panel {
  border-color: #73505a;
  background:
    linear-gradient(
      145deg,
      rgba(82, 34, 44, 0.3),
      rgba(31, 18, 29, 0.5)
    );
}

.build-callout {
  border-color: #315b86;
}

/* =========================================================
   DASHBOARD HERO
   ========================================================= */

.hero {
  display: grid;
  grid-template-columns:
    minmax(0, 1.6fr)
    minmax(280px, 0.65fr);
  gap: 18px;
  margin-bottom: 18px;
}

.hero > div:first-child {
  padding: 22px 0 14px;
}

.hero h1 {
  max-width: 760px;
}

.hero-card {
  padding: 22px;
  border-radius: 18px;
}

.hero-card strong {
  display: block;
  margin-top: 10px;
  font-size: 18px;
  line-height: 1.5;
}

.hero-card p {
  margin-bottom: 0;
  color: var(--muted);
}

/* =========================================================
   GRIDS
   ========================================================= */

.two-column {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.stats-grid {
  display: grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.stat-card {
  min-height: 132px;
  padding: 19px;
  border-radius: 16px;
}

.stat-card span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.stat-card strong {
  display: block;
  margin: 9px 0 5px;
  font-size: 28px;
}

.stat-card small {
  color: var(--muted);
}

.week-grid {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.week-card {
  padding: 17px;
  border-radius: 14px;
}

.week-card span {
  color: var(--blue);
  font-size: 9px;
  letter-spacing: 0.13em;
}

.week-card strong {
  display: block;
  margin-top: 8px;
  font-size: 14px;
}

.week-card p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 13px;
}

.build-grid,
.asset-grid {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.audit-grid {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.scenario-grid {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 20px;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.primary,
.secondary,
.text-button,
.btn {
  border-radius: 10px;
  transition:
    background 0.18s ease,
    border-color 0.18s ease,
    transform 0.18s ease;
}

.primary,
.btn {
  padding: 10px 14px;
  border: 1px solid #4778b0;
  background: #173558;
  color: #fff;
}

.primary:hover,
.btn:hover {
  background: #204873;
  border-color: #5793d6;
}

.secondary {
  padding: 10px 14px;
  border: 1px solid #35597e;
  background: transparent;
  color: #c3dcf4;
}

.secondary:hover {
  background: #10243a;
  border-color: #4d7eae;
}

.text-button {
  margin-bottom: 18px;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: #8fc6ff;
  font-weight: 650;
}

.text-button:hover {
  color: #fff;
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

/* =========================================================
   STATUS PILLS
   ========================================================= */

.pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 9px;
  border-radius: 999px;
  background: #153352;
  color: #9dccff;
  font-size: 9px;
  line-height: 1.2;
  white-space: nowrap;
}

.pill.done {
  background: #103b31;
  color: #85e8bd;
}

.pill.progressing {
  background: #243451;
  color: #b9d8ff;
}

.pill.review {
  background: #30295a;
  color: #c8bbff;
}

.pill.revision {
  background: #522b36;
  color: #ffb6bf;
}

/* =========================================================
   WORKFLOW
   ========================================================= */

.workflow-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.workflow-strip span {
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #091727;
  color: #d4e7fa;
  font-size: 10px;
  font-weight: 650;
}

.workflow-strip b {
  color: var(--blue);
}

/* =========================================================
   SESSION LISTS
   ========================================================= */

.session-list {
  margin-top: 12px;
}

.session-row {
  width: 100%;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  padding: 18px 4px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  color: inherit;
  text-align: left;
}

.session-row:first-child {
  border-top: 0;
}

.session-row:hover {
  background: rgba(29, 65, 101, 0.15);
}

.session-number {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #173558;
  color: #bfe0ff;
  font-size: 12px;
  font-weight: 700;
}

.session-copy p {
  margin: 6px 0;
  color: var(--muted);
}

.session-copy small {
  color: #72b6f9;
}

.session-topline {
  display: flex;
  justify-content: space-between;
  gap: 18px;
}

.session-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}

/* =========================================================
   BUILDS
   ========================================================= */

.build-card {
  display: flex;
  flex-direction: column;
  min-height: 260px;
}

.build-card > p {
  color: var(--muted);
}

.card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  margin-top: auto;
  padding-top: 18px;
}

.card-footer small {
  color: var(--muted);
}

.review-alert {
  margin-top: 14px;
  padding: 13px;
  border: 1px solid #744957;
  border-radius: 11px;
  background: rgba(83, 39, 49, 0.3);
}

.review-alert p {
  margin-bottom: 0;
  color: #e8b9c0;
}

/* =========================================================
   FORMS
   ========================================================= */

.field-label {
  display: block;
  margin: 18px 0 7px;
  color: #b8d1ea;
  font-size: 12px;
  font-weight: 650;
}

.input,
.large-textarea {
  width: 100%;
  border: 1px solid #294766;
  outline: none;
  background: #071422;
  color: var(--text);
}

.input {
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 9px;
}

.large-textarea {
  min-height: 150px;
  resize: vertical;
  padding: 13px;
  border-radius: 11px;
  line-height: 1.55;
}

.input:focus,
.large-textarea:focus {
  border-color: #4f8ac5;
  box-shadow:
    0 0 0 3px rgba(85, 168, 255, 0.08);
}

.submission-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 15px;
  color: var(--muted);
}

/* =========================================================
   LISTS
   ========================================================= */

.step-list,
.check-list {
  margin: 18px 0 0;
  padding-left: 22px;
}

.step-list li,
.check-list li {
  margin: 0 0 13px;
  padding-left: 5px;
  color: #c5d8eb;
  line-height: 1.55;
}

.check-list li::marker {
  color: var(--green);
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.tag {
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #091727;
  color: #b9d7f4;
  font-size: 10px;
}

/* =========================================================
   AGENCY TOOLKIT
   ========================================================= */

.asset-mini-grid {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.asset-mini {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #091727;
  color: var(--text);
  text-align: left;
}

.asset-mini:hover {
  border-color: #37628c;
  background: #0e2034;
}

.asset-mini strong {
  display: block;
  font-size: 12px;
}

.asset-mini small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.asset-card {
  width: 100%;
  min-height: 190px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    linear-gradient(
      145deg,
      #0e2034,
      #091624
    );
  color: var(--text);
  text-align: left;
}

.asset-card:hover {
  border-color: #3c678f;
}

.asset-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
}

.asset-card p {
  color: var(--muted);
  font-size: 13px;
}

.progress-track {
  height: 7px;
  overflow: hidden;
  margin: 14px 0 8px;
  border-radius: 999px;
  background: #17283b;
}

.progress-track.large {
  height: 10px;
}

.progress-fill {
  height: 100%;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      var(--blue),
      var(--purple)
    );
}

/* =========================================================
   RESEARCH / AUDIT / AGENCY LAB
   ========================================================= */

.audit-step {
  min-height: 110px;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 13px;
}

.step-number {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #173558;
  color: #bfe0ff;
  font-size: 10px;
}

.scenario-grid article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #091727;
}

.scenario-grid ul {
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.7;
}

/* =========================================================
   PROGRESS
   ========================================================= */

.progress-list {
  margin-top: 12px;
}

.progress-row {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 15px 3px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  text-align: left;
}

.progress-row:first-child {
  border-top: 0;
}

.progress-row:hover {
  background: rgba(30, 65, 100, 0.12);
}

.progress-row strong {
  display: block;
  font-size: 13px;
}

.progress-row small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

/* =========================================================
   MENTOR ASSISTANT
   ========================================================= */

.mentor-layout {
  display: grid;
  grid-template-columns:
    minmax(0, 1.6fr)
    minmax(280px, 0.6fr);
  gap: 18px;
}

.mentor-main,
.mentor-side {
  margin-bottom: 0;
}

.mentor-messages {
  height: 480px;
  overflow-y: auto;
  margin: 20px 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #06111e;
}

.mentor-message {
  max-width: 84%;
  margin-bottom: 16px;
  padding: 13px 15px;
  border-radius: 13px;
}

.mentor-message > span {
  display: block;
  margin-bottom: 7px;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.assistant-message {
  margin-right: auto;
  border: 1px solid #274664;
  background: #0e2135;
}

.assistant-message > span {
  color: var(--blue);
}

.user-message {
  margin-left: auto;
  border: 1px solid #4d477b;
  background: #201f3d;
}

.user-message > span {
  color: #b7a9ff;
}

.mentor-message div {
  color: #d5e5f5;
  font-size: 13px;
  line-height: 1.6;
}

.mentor-message h2,
.mentor-message h3,
.mentor-message h4 {
  margin: 10px 0 6px;
}

.mentor-bullet {
  margin: 5px 0;
}

.thinking {
  color: var(--muted) !important;
  font-style: italic;
}

.mentor-compose {
  border-top: 1px solid var(--line);
  padding-top: 18px;
}

.quick-question-list {
  display: grid;
  gap: 9px;
  margin-top: 16px;
}

.quick-question {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #091727;
  color: #bfd6ed;
  text-align: left;
  font-size: 12px;
  line-height: 1.45;
}

.quick-question:hover {
  border-color: #3d6992;
  background: #10243a;
}

.mentor-rule {
  margin-top: 20px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #091727;
}

.mentor-rule p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 12px;
}

/* =========================================================
   LEGACY COMPATIBILITY
   ========================================================= */

.grid {
  display: grid;
  grid-template-columns:
    repeat(12, 1fr);
  gap: 16px;
}

.card {
  padding: 20px;
  border-radius: 18px;
}

.span8 {
  grid-column: span 8;
}

.span4 {
  grid-column: span 4;
}

.span6 {
  grid-column: span 6;
}

.span12 {
  grid-column: span 12;
}

/* Training Library resource cards */
.training-resource-card {
  display: flex;
  min-width: 0;
  min-height: 275px;
  flex-direction: column;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.training-resource-card:hover,
.training-resource-card:focus-visible {
  border-color: #3f77a9;
  box-shadow: 0 16px 32px rgba(0, 0, 0, .2);
  outline: none;
  transform: translateY(-2px);
}

.training-resource-card h3,
.training-resource-card p,
.training-resource-file {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.training-resource-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 18px;
}

.training-resource-open {
  color: #d9ecff;
  font-weight: 700;
  font-size: 14px;
}

/* Login and invitation screen */
.auth-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: clamp(20px, 5vw, 56px);
}

.auth-card {
  width: min(100%, 480px);
  padding: clamp(24px, 5vw, 42px);
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(12, 29, 49, .96);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}

.auth-card form {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}

.auth-card form[hidden] {
  display: none;
}

.auth-card label {
  display: grid;
  gap: 7px;
  color: #eef7ff;
  font-weight: 700;
}

.auth-card input {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid #31516f;
  border-radius: 9px;
  background: #07182a;
  color: #fff;
  font: inherit;
}

.auth-card input:focus {
  border-color: #55b7ff;
  outline: 2px solid rgba(85, 183, 255, .2);
}

.auth-card input[readonly] {
  color: #b9cce0;
  cursor: not-allowed;
  opacity: .9;
}

.auth-card .btn {
  width: 100%;
  min-height: 46px;
  justify-content: center;
}

.progress {
  height: 8px;
  overflow: hidden;
  margin: 14px 0;
  border-radius: 99px;
  background: #17283b;
}

.progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      var(--blue),
      var(--purple)
    );
}

.list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}

.row:first-child {
  border-top: 0;
}

.flow {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 15px;
}

.flow span {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #0a1728;
  font-size: 11px;
}

.flow b {
  align-self: center;
  color: var(--blue);
}

.notice {
  padding: 12px 14px;
  border-left: 3px solid var(--purple);
  border-radius: 0 10px 10px 0;
  background: #171a35;
  color: #c8c9e8;
}

/* =========================================================
   SESSION ROOM
   ========================================================= */

.session-room-head,
.session-room-actions,
.slide-controls {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.session-room-head { margin-bottom: 24px; }

.session-clock {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  margin-bottom: 18px;
  padding: 18px 20px;
  border: 1px solid #31577e;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(13, 38, 66, .98), rgba(7, 22, 39, .98));
}
.session-clock h3 { margin: 7px 0 4px; }
.session-clock p { margin: 0; color: var(--muted); }
.session-clock-values, .mentor-clock-pair { display: flex; gap: 10px; }
.session-clock-values > div, .mentor-clock-pair > div {
  min-width: 118px;
  padding: 12px 14px;
  border: 1px solid #2b5276;
  border-radius: 12px;
  background: #07182a;
  text-align: center;
}
.session-clock-values span, .mentor-clock-pair span { display: block; color: var(--blue-soft); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.session-clock-values strong, .mentor-clock-pair strong { display: block; margin-top: 4px; color: #fff; font-size: 25px; font-variant-numeric: tabular-nums; }
.session-clock.waiting { grid-template-columns: 1fr; }
.timer-next-topic { grid-column: 1 / -1; display: grid; gap: 4px; padding: 13px 15px; border: 1px solid #f3b64c; border-radius: 11px; background: rgba(243, 182, 76, .09); }
.timer-next-topic small { color: #f6d79d; }
.timer-due, .timer-next-notes {
  border-color: #f3b64c !important;
  box-shadow: 0 0 0 2px rgba(243, 182, 76, .2), 0 0 30px rgba(243, 182, 76, .24) !important;
  animation: timerGlow 1.35s ease-in-out infinite alternate;
}
.clock-expired strong { color: #ffd98b; }
@keyframes timerGlow { from { box-shadow: 0 0 0 1px rgba(243, 182, 76, .15), 0 0 16px rgba(243, 182, 76, .15); } to { box-shadow: 0 0 0 3px rgba(243, 182, 76, .28), 0 0 34px rgba(243, 182, 76, .32); } }

.mentor-timer-panel { margin-top: 24px; }
.mentor-timer-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.timer-session-select { display: grid; gap: 7px; margin: 20px 0 14px; max-width: 720px; font-weight: 700; }
.timer-session-select select { min-height: 43px; padding: 9px 11px; border: 1px solid #2a557c; border-radius: 8px; background: #071b2f; color: #eef6ff; font: inherit; }
.timer-current-topic { margin: 14px 0; padding: 16px; border: 1px solid #31577e; border-radius: 12px; background: #081b2f; }
.timer-current-topic h3 { margin: 7px 0; }
.timer-current-topic p { margin: 0; color: var(--muted); }
.enhanced-topic-list { display: grid; gap: 8px; }
.timer-topic-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 10px; align-items: center; width: 100%; padding: 11px 13px; border: 1px solid #244966; border-radius: 9px; background: #07182a; color: #dcecff; text-align: left; font: inherit; cursor: pointer; }
.timer-topic-row > span { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: #143758; color: #fff; font-size: 11px; }
.timer-topic-row small { color: var(--blue-soft); }
.timer-topic-row.active { border-color: #55adf1; background: #102a45; }
.timer-topic-row.complete { opacity: .7; }
.timer-topic-row.complete > span { background: #197259; }
.timer-topic-row.next-due { border-color: #f3b64c; box-shadow: 0 0 20px rgba(243, 182, 76, .18); }
.timer-control-row { margin-top: 16px; }
.presentation-student-clock { position: fixed; z-index: 5; top: 20px; right: 20px; display: grid; min-width: 150px; padding: 12px 15px; border: 1px solid #3a6b98; border-radius: 12px; background: rgba(4, 15, 28, .94); box-shadow: 0 12px 30px rgba(0,0,0,.28); text-align: center; }
.presentation-student-clock span { color: var(--blue-soft); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.presentation-student-clock strong { margin: 3px 0; font-size: 28px; font-variant-numeric: tabular-nums; }
.presentation-student-clock small { color: var(--muted); }

.btn.ghost {
  background: transparent;
  border-color: var(--line-bright);
}

.session-room-layout {
  display: grid;
  grid-template-columns: 165px minmax(280px, .75fr) minmax(0, 1.55fr);
  gap: 16px;
  align-items: start;
}

.session-agenda,
.mentor-notes,
.session-room-library {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(12, 25, 42, .88);
  padding: 18px;
}

.session-agenda { position: sticky; top: 20px; max-height: calc(100vh - 42px); overflow-y: auto; }

.agenda-item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 9px;
  margin-top: 9px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  text-align: left;
  font-size: 12px;
}

.agenda-item span {
  display: grid;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  place-items: center;
  border-radius: 50%;
  background: #0a1728;
  color: var(--blue-soft);
  font-size: 10px;
}

.agenda-item.active { border-color: #386996; background: #10233a; color: #fff; }
.agenda-item.active span { background: #1b5285; color: #fff; }
.agenda-section { margin: 18px 0 4px; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.agenda-section:first-of-type { margin-top: 12px; }

.presentation-frame,
.grace-slide {
  min-height: 535px;
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 5vw, 68px);
  border: 1px solid #31577e;
  border-radius: 18px;
  background: radial-gradient(circle at 82% 0%, #1a4f83 0, transparent 36%), linear-gradient(145deg, #10274a 0%, #08162b 58%, #07111f 100%);
  box-shadow: 0 20px 50px rgba(0,0,0,.26);
}

.presentation-frame h1,
.grace-slide h1 { max-width: 760px; margin: 18px 0; font-size: clamp(32px, 4.2vw, 61px); letter-spacing: -.045em; line-height: 1.03; }
.presentation-statement { max-width: 790px; color: #d7e9ff; font-size: clamp(18px, 2vw, 26px); line-height: 1.45; }
.presentation-points { display: grid; gap: 11px; max-width: 850px; margin-top: 24px; }
.presentation-points div { padding: 14px 16px; border-left: 3px solid var(--blue); background: rgba(7,17,31,.42); color: #eaf5ff; font-size: 16px; }
.presentation-footer { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 44px; color: var(--blue-soft); font-size: 12px; }
.slide-controls { margin-top: 14px; }
.mentor-notes { position: sticky; top: 20px; max-height: calc(100vh - 42px); overflow-y: auto; }
.mentor-notes h3 { margin: 9px 0; }
.mentor-notes p { color: #d6e3f2; line-height: 1.62; font-size: 14px; }
.note-group { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.note-group b { color: var(--blue-soft); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.note-group p { margin: 7px 0 0; }
.note-group ul { margin: 8px 0 0; padding-left: 18px; color: #d6e3f2; font-size: 14px; line-height: 1.55; }
.note-group li + li { margin-top: 7px; }
.note-group.transition { border-left: 2px solid var(--purple); padding: 11px 0 0 12px; border-top: 0; }
.point-explanation { margin-top: 14px; padding: 13px; border: 1px solid #294866; border-radius: 10px; background: #09182a; }
.point-explanation h4 { margin: 0; color: #fff; font-size: 14px; }
.point-explanation p { margin: 8px 0 0; }
.mentor-notes .btn { width: 100%; margin-top: 14px; }
.session-room-library { margin-top: 16px; color: var(--muted); }
.session-room-library div { margin-top: 8px; }
.mentor-help-request { margin-top: 24px; padding: 18px; border: 1px solid #315474; border-radius: 14px; background: #0a192b; }
.mentor-help-request h3 { margin-bottom: 4px; }
.mentor-help-request textarea, .mentor-request textarea { display: block; width: 100%; min-height: 105px; box-sizing: border-box; margin-top: 14px; padding: 12px; border: 1px solid #315474; border-radius: 10px; background: #071625; color: var(--text); font: inherit; resize: vertical; }
.mentor-help-request input { display: block; margin: 12px 0; color: var(--muted); }
.presence-controls { display: grid; gap: 12px; margin-top: 14px; }
.presence-control { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: var(--text); }
.presence-control select { padding: 8px; border: 1px solid #315474; border-radius: 8px; background: #071625; color: var(--text); font: inherit; }
.mentor-request { padding: 22px; }
.request-head, .request-actions { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.request-replies { display: grid; gap: 10px; margin-top: 18px; }
.request-replies > div { padding: 12px; border-left: 3px solid var(--blue); border-radius: 0 8px 8px 0; background: #0a192b; }
.request-replies p { margin: 6px 0 0; }
.request-actions { justify-content: flex-start; margin-top: 12px; }
.agency-lab-intro { max-width:920px; margin-bottom:22px; }
.agency-lab-intro h2 { margin-bottom:8px; font-size:30px; }
.agency-lab-intro p { margin:0; color:var(--muted); }
.northbridge-site { overflow:hidden; border:1px solid #315474; border-radius:18px; background:#f7f6f2; color:#152539; box-shadow:0 20px 45px rgba(0,0,0,.24); }
.northbridge-site * { box-sizing:border-box; }
.northbridge-nav { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px clamp(22px,4vw,54px); background:#fff; color:#182b3a; font-size:13px; }
.northbridge-nav b { letter-spacing:.08em; font-size:15px; }
.northbridge-nav b span { display:block; color:#6d8ca0; font-size:10px; letter-spacing:.22em; }
.northbridge-nav > button:last-child,.northbridge-primary,.northbridge-secondary { padding:11px 16px; border:1px solid #1d5a72; border-radius:4px; background:#1d5a72; color:white; font:inherit; }
.northbridge-brand { padding:0; border:0; background:transparent; color:#182b3a; text-align:left; font:inherit; cursor:pointer; }
.northbridge-menu { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.northbridge-menu button,.northbridge-link { padding:7px 8px; border:0; background:transparent; color:#365e70; font:inherit; cursor:pointer; }
.northbridge-menu button.active { color:#173f52; font-weight:800; box-shadow:inset 0 -2px 0 #d6a54b; }
.northbridge-link { padding-left:0; color:#1d5a72; font-weight:700; }
.northbridge-hero { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(220px,.55fr); gap:32px; padding:clamp(34px,6vw,78px) clamp(22px,6vw,84px); background:linear-gradient(120deg,#123c51,#225f70 58%,#4d8790); color:#fff; }
.northbridge-hero span,.northbridge-content > div > span,.northbridge-jobs > span { color:#a6d7d3; font-size:10px; font-weight:800; letter-spacing:.15em; }
.northbridge-hero h1 { max-width:720px; margin:17px 0; color:#fff; font-size:clamp(38px,5vw,70px); line-height:1; }
.northbridge-hero p { max-width:640px; font-size:18px; line-height:1.65; color:#e2f1f1; }
.northbridge-hero aside { padding:24px; align-self:end; border:1px solid rgba(255,255,255,.28); background:rgba(5,33,45,.35); }
.northbridge-hero aside b { display:block; margin-top:17px; font-size:34px; }
.northbridge-hero aside small { color:#d2ebec; }
.northbridge-hero hr { border:0; border-top:1px solid rgba(255,255,255,.25); margin:20px 0; }
.northbridge-primary { margin-top:18px; background:#d6a54b; border-color:#d6a54b; color:#172b3a; font-weight:700; }
.northbridge-secondary { margin:18px 0 0 8px; background:transparent; border-color:rgba(255,255,255,.55); }
.northbridge-stats,.northbridge-content { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; }
.northbridge-stats > div { min-height:125px; padding:30px clamp(20px,3vw,48px); border-right:1px solid #d5dedf; background:#eaf0ee; }
.northbridge-stats b,.northbridge-stats span { display:block; }
.northbridge-stats b { color:#1d5a72; font-size:18px; }
.northbridge-stats span { margin-top:8px; color:#60717c; font-size:13px; line-height:1.45; }
.northbridge-content { grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:54px; padding:clamp(34px,5vw,70px) clamp(22px,6vw,84px); }
.northbridge-content h2 { margin:14px 0; font-size:31px; line-height:1.15; color:#1c3947; }
.northbridge-content p { color:#536771; line-height:1.65; }
.northbridge-content a { color:#1d5a72; font-weight:700; }
.northbridge-jobs { padding:25px; background:#fff; border-top:4px solid #d6a54b; box-shadow:0 8px 20px rgba(28,57,71,.1); }
.northbridge-jobs div { padding:16px 0; border-bottom:1px solid #e1e7e5; }
.northbridge-jobs b,.northbridge-jobs small { display:block; }
.northbridge-jobs small { margin-top:5px; color:#60717c; }
.northbridge-footer { display:flex; justify-content:space-between; gap:24px; padding:27px clamp(22px,6vw,84px); background:#142c3a; color:#fff; }
.northbridge-footer b,.northbridge-footer span { display:block; }
.northbridge-footer span { margin-top:7px; color:#b9d1d4; font-size:13px; }
.northbridge-page-hero { padding:clamp(42px,6vw,78px) clamp(22px,6vw,84px); background:#e7f0ef; color:#193847; }
.northbridge-page-hero span,.northbridge-panel > span,.northbridge-team > span,.northbridge-form > span,.northbridge-insight-grid span { color:#2b7681; font-size:10px; font-weight:800; letter-spacing:.14em; }
.northbridge-page-hero h1 { max-width:880px; margin:16px 0; color:#193847; font-size:clamp(36px,5vw,64px); line-height:1.05; }
.northbridge-page-hero p { max-width:760px; margin:0; color:#526a74; font-size:18px; line-height:1.65; }
.northbridge-page-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:54px; padding:clamp(34px,5vw,70px) clamp(22px,6vw,84px); }
.northbridge-page-grid h2 { margin-top:0; color:#1c3947; font-size:29px; }
.northbridge-page-grid p { color:#536771; line-height:1.7; }
.northbridge-panel,.northbridge-form { display:grid; gap:11px; align-content:start; padding:28px; background:#fff; border-top:4px solid #d6a54b; box-shadow:0 8px 20px rgba(28,57,71,.1); }
.northbridge-panel b { margin-top:10px; color:#1c3947; }
.northbridge-panel small { color:#60717c; line-height:1.55; }
.northbridge-team { padding:0 clamp(22px,6vw,84px) clamp(34px,5vw,70px); }
.northbridge-team > div,.northbridge-sector-grid,.northbridge-insight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:16px; }
.northbridge-team article,.northbridge-sector-grid article,.northbridge-insight-grid article { min-height:160px; padding:24px; background:#fff; border:1px solid #dbe4e2; }
.northbridge-team b,.northbridge-team small { display:block; }
.northbridge-team small { margin-top:5px; color:#60717c; }
.northbridge-sector-grid,.northbridge-insight-grid { padding:clamp(34px,5vw,70px) clamp(22px,6vw,84px); margin:0; }
.northbridge-sector-grid article span { color:#d6a54b; font-weight:800; }
.northbridge-sector-grid h2,.northbridge-insight-grid h2 { color:#1c3947; }
.northbridge-sector-grid p,.northbridge-insight-grid p { min-height:72px; color:#60717c; line-height:1.6; }
.northbridge-steps { display:grid; gap:18px; margin:0; padding:0; list-style:none; }
.northbridge-steps li { padding:0 0 18px; border-bottom:1px solid #d9e1df; }
.northbridge-steps b,.northbridge-steps span { display:block; }
.northbridge-steps span { margin-top:5px; color:#60717c; }
.northbridge-form input,.northbridge-form select,.northbridge-form textarea { width:100%; padding:12px; border:1px solid #cbd9d6; border-radius:3px; background:#fcfdfc; color:#274452; font:inherit; }
.northbridge-form textarea { min-height:105px; resize:vertical; }
.agency-lab-map { margin-top:18px; }
.lab-route { display:flex; gap:15px; padding:14px 0; border-top:1px solid var(--line); }
.lab-route span { display:grid; width:27px; height:27px; flex:0 0 27px; place-items:center; border-radius:50%; background:#174875; color:#fff; font-size:12px; }
.lab-route p { margin:4px 0 0; color:var(--muted); }
.practice-crm-intro { max-width:900px; margin-bottom:20px; }
.practice-crm-intro h2 { margin:8px 0; font-size:30px; }
.practice-crm-intro p { margin:0; color:var(--muted); line-height:1.6; }
.crm-shell { display:grid; min-height:760px; grid-template-columns:216px minmax(0,1fr); overflow:hidden; border:1px solid #25364b; border-radius:16px; background:#f7f8fa; color:#263342; box-shadow:0 18px 45px rgba(0,0,0,.26); }
.crm-main-nav { display:flex; flex-direction:column; padding:17px 11px; background:#172231; color:#c8d3df; }
.crm-logo { display:flex; align-items:center; gap:9px; padding:7px 8px 18px; color:#fff; font-size:16px; }
.crm-logo span { display:grid; width:29px; height:29px; place-items:center; border-radius:8px; background:#2ca7a0; color:#fff; font-weight:800; font-size:20px; }
.crm-location { margin:0 5px 18px; padding:10px; border:1px solid #32465d; border-radius:6px; background:#202f41; color:#eef6ff; font-size:12px; }
.crm-nav-label { margin:15px 9px 7px; color:#7990a7; font-size:9px; font-weight:800; letter-spacing:.12em; }
.crm-main-nav button { display:flex; align-items:center; gap:10px; width:100%; margin:2px 0; padding:10px; border:0; border-radius:6px; background:transparent; color:#ccd8e5; text-align:left; font:inherit; font-size:13px; cursor:pointer; }
.crm-main-nav button i { width:15px; color:#a8bdd0; font-style:normal; text-align:center; }
.crm-main-nav button.active { background:#2b9b95; color:#fff; }
.crm-main-nav button.active i { color:#fff; }
.crm-main-nav button.disabled { opacity:.46; cursor:not-allowed; }
.crm-workspace { min-width:0; background:#f7f8fa; }
.crm-conversations { display:grid; height:758px; grid-template-columns:255px minmax(330px,1fr) 265px; }
.crm-thread-list { border-right:1px solid #dbe1e8; background:#fff; }
.crm-list-head,.crm-message-head,.crm-view-head { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.crm-list-head { padding:18px 15px 12px; font-size:17px; }
.crm-list-head button { width:28px; height:28px; border:0; border-radius:5px; background:#ecf0f3; color:#4b5e71; font-size:19px; }
.crm-thread-list input,.crm-table-tools input { width:calc(100% - 28px); margin:0 14px 12px; padding:9px; border:1px solid #dce3e9; border-radius:5px; background:#fafbfc; font:inherit; font-size:12px; }
.crm-thread { display:flex; width:100%; gap:9px; padding:12px 14px; border:0; border-top:1px solid #edf0f3; background:#fff; color:#273749; text-align:left; cursor:pointer; }
.crm-thread.active { background:#e7f6f4; box-shadow:inset 3px 0 #2ca7a0; }
.crm-thread span:nth-child(2) { min-width:0; flex:1; }
.crm-thread b,.crm-thread small,.crm-thread em { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.crm-thread small { margin-top:3px; color:#687b8d; font-size:11px; }
.crm-thread em { margin-top:4px; color:#8a98a7; font-size:10px; font-style:normal; }
.crm-avatar { display:grid; width:34px; height:34px; flex:0 0 34px; place-items:center; border-radius:50%; background:#d8eee9; color:#26766f; font-size:11px; font-weight:800; }
.crm-message-area { display:flex; min-width:0; flex-direction:column; background:#f7f8fa; }
.crm-message-head { padding:16px 20px; border-bottom:1px solid #dce3e9; background:#fff; }
.crm-message-head > div { margin-right:auto; }
.crm-message-head b,.crm-message-head small { display:block; }
.crm-message-head small { margin-top:3px; color:#738294; font-size:11px; }
.crm-message-head > span { padding:5px 8px; border-radius:20px; background:#e0f4ee; color:#277b70; font-size:11px; }
.crm-messages { flex:1; overflow:auto; padding:22px; }
.crm-empty { max-width:330px; margin:110px auto; text-align:center; color:#768593; }
.crm-empty b { color:#45596b; }
.crm-message { max-width:72%; margin-bottom:14px; padding:12px 14px; border:1px solid #dfe6eb; border-radius:8px; background:#fff; }
.crm-message.outbound { margin-left:auto; border-color:#b9e0dc; background:#e9f8f5; }
.crm-message span,.crm-message small { color:#7c8c9b; font-size:10px; font-weight:700; }
.crm-message p { margin:7px 0; line-height:1.55; }
.crm-message-evidence { margin:9px 0 5px; padding:7px 8px; border-left:3px solid #2ca7a0; background:#edf8f6; color:#37716b; font-size:10px; font-weight:700; }
.crm-composer { padding:13px 16px; border-top:1px solid #dce3e9; background:#fff; }
.crm-composer > div { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.crm-composer div:first-child button { padding:4px; border:0; background:transparent; color:#536a7b; font-size:11px; }
.crm-composer textarea { width:100%; min-height:68px; margin:8px 0; border:1px solid #dbe3e8; border-radius:6px; padding:9px; font:inherit; font-size:12px; resize:vertical; }
.crm-composer small { color:#8391a0; font-size:10px; }
.crm-send { padding:9px 15px; border:0; border-radius:5px; background:#2ca7a0; color:#fff; font:inherit; font-size:12px; font-weight:700; }
.crm-contact-panel { padding:18px; border-left:1px solid #dce3e9; background:#fff; }
.crm-contact-top { display:flex; gap:10px; align-items:center; }
.crm-contact-top h3 { margin:0; font-size:16px; }
.crm-contact-top p { margin:3px 0 0; color:#6f8090; font-size:12px; }
.crm-tags { display:flex; gap:5px; flex-wrap:wrap; margin:16px 0; }
.crm-tags span,.crm-table-tag,.crm-pipeline article div span { padding:4px 7px; border-radius:3px; background:#e8f2fb; color:#417096; font-size:10px; }
.crm-info { display:grid; gap:5px; padding-top:15px; border-top:1px solid #e3e8ed; }
.crm-info span,.crm-timeline > span { margin-top:8px; color:#82909d; font-size:9px; font-weight:800; letter-spacing:.1em; }
.crm-info b { color:#415669; font-size:12px; overflow-wrap:anywhere; }
.crm-scenario { display:grid; gap:6px; margin:17px 0; padding-top:15px; border-top:1px solid #e3e8ed; }
.crm-scenario span { color:#82909d; font-size:9px; font-weight:800; letter-spacing:.1em; }
.crm-scenario select { width:100%; padding:8px; border:1px solid #cfdce4; border-radius:5px; background:#fbfcfd; color:#466173; font:inherit; font-size:11px; }
.crm-actions { display:flex; gap:6px; margin:18px 0; }
.crm-actions button { flex:1; padding:8px 4px; border:1px solid #d6e0e6; border-radius:4px; background:#fff; color:#466173; font-size:11px; }
.crm-timeline { border-top:1px solid #e3e8ed; }
.crm-timeline p { padding:10px 0; margin:0; border-bottom:1px solid #eef1f3; color:#65798a; font-size:11px; }
.crm-table-view,.crm-opportunity-view,.crm-calendar { padding:27px; }
.crm-view-head h2 { margin:0; color:#263342; }
.crm-view-head p { margin:5px 0 0; color:#778795; font-size:13px; }
.crm-table-tools { display:flex; gap:8px; margin:23px 0 14px; }
.crm-table-tools input { width:250px; margin:0; }
.crm-table-tools button { padding:8px 11px; border:1px solid #d5dfe5; border-radius:5px; background:#fff; color:#587084; font-size:12px; }
.crm-table-view table { width:100%; border-collapse:collapse; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.crm-table-view th { padding:12px; border-bottom:1px solid #dfe6eb; background:#f4f6f8; color:#7b8b9a; text-align:left; font-size:10px; letter-spacing:.05em; }
.crm-table-view td { padding:12px; border-bottom:1px solid #edf0f3; color:#586c7d; font-size:12px; cursor:pointer; }
.crm-table-view td b,.crm-table-view td small { display:block; }
.crm-table-view td b { color:#31485a; }
.crm-table-view td small { margin-top:3px; color:#82909d; font-size:10px; }
.crm-pipeline { display:flex; gap:12px; overflow-x:auto; margin-top:24px; padding-bottom:12px; }
.crm-pipeline section { width:220px; min-width:220px; min-height:520px; padding:10px; border-radius:6px; background:#e9edf1; }
.crm-stage-head { display:flex; justify-content:space-between; padding:4px 3px 12px; color:#536779; font-size:12px; }
.crm-stage-head span { display:grid; width:20px; height:20px; place-items:center; border-radius:50%; background:#d5dde4; font-size:10px; }
.crm-pipeline article { padding:12px; margin-bottom:8px; border-radius:5px; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.09); cursor:pointer; }
.crm-pipeline article .crm-avatar { float:left; width:27px; height:27px; margin-right:8px; font-size:9px; }
.crm-pipeline article b,.crm-pipeline article small,.crm-pipeline article em { display:block; }
.crm-pipeline article b { color:#344a5b; font-size:12px; }
.crm-pipeline article small,.crm-pipeline article em { margin-top:4px; color:#738494; font-size:10px; font-style:normal; }
.crm-pipeline article div { clear:both; padding-top:10px; }
.crm-empty-stage { padding:20px 6px; color:#93a0ab; text-align:center; font-size:11px; }
.crm-task-list { display:grid; gap:8px; margin-top:22px; }
.crm-task { display:flex; gap:12px; align-items:center; padding:15px; border:1px solid #e1e7eb; border-radius:6px; background:#fff; color:#314757; text-align:left; cursor:pointer; }
.crm-task i { display:grid; width:19px; height:19px; place-items:center; border:1px solid #aebdc9; border-radius:50%; color:#fff; font-size:11px; font-style:normal; }
.crm-task.done i { border-color:#2ca7a0; background:#2ca7a0; }
.crm-task.done b { text-decoration:line-through; color:#8a98a4; }
.crm-task b,.crm-task small { display:block; }
.crm-task small { margin-top:4px; color:#7a8b99; }
.crm-calendar-head { display:flex; justify-content:center; gap:20px; align-items:center; margin:28px 0 12px; }
.crm-calendar-head button { border:0; background:transparent; color:#536a7b; font-size:20px; }
.crm-calendar-grid { display:grid; grid-template-columns:repeat(5,minmax(130px,1fr)); border:1px solid #dce4e9; background:#fff; }
.crm-calendar-grid section { min-height:350px; padding:12px; border-right:1px solid #e4e9ed; }
.crm-calendar-grid section > b,.crm-calendar-grid section > span { display:block; }
.crm-calendar-grid section > b { color:#65798a; font-size:11px; }
.crm-calendar-grid section > span { margin-top:4px; color:#273f50; font-size:19px; }
.crm-calendar-grid article { margin-top:86px; padding:9px; border-left:3px solid #2ca7a0; border-radius:3px; background:#e9f8f5; color:#326d69; font-size:11px; }
.crm-calendar-grid article b,.crm-calendar-grid article small { display:block; margin-top:4px; }
.crm-calendar-note { margin-top:18px; padding:13px; border-radius:5px; background:#eaf3fb; color:#52728b; font-size:12px; }
.crm-review-view { padding:27px; }
.crm-review-layout { display:grid; grid-template-columns:255px minmax(0,1fr); gap:18px; margin-top:24px; }
.crm-review-layout > aside { padding:12px; border:1px solid #dce4e9; border-radius:7px; background:#fff; }
.crm-review-label { display:block; padding:4px 4px 10px; color:#8392a0; font-size:10px; font-weight:800; letter-spacing:.1em; }
.crm-review-thread { display:flex; align-items:center; gap:9px; width:100%; margin:4px 0; padding:10px; border:1px solid transparent; border-radius:6px; background:#fff; color:#34495a; text-align:left; cursor:pointer; }
.crm-review-thread.active { border-color:#b9ddd9; background:#eaf7f5; }
.crm-review-thread > div { min-width:0; flex:1; }
.crm-review-thread b,.crm-review-thread small { display:block; }
.crm-review-thread small { margin-top:3px; color:#7d8c9a; font-size:10px; }
.crm-review-thread > span { color:#708496; font-size:10px; font-weight:700; text-align:right; }
.crm-review-report { min-width:0; }
.crm-review-score { padding:22px; border-radius:7px; background:#1e3246; color:#eaf5fb; }
.crm-review-score span,.crm-review-grid article > span,.crm-review-coaching > span { display:block; color:#84c7be; font-size:10px; font-weight:800; letter-spacing:.1em; }
.crm-review-score b { display:block; margin:8px 0 5px; color:#fff; font-size:42px; line-height:1; }
.crm-review-score b small { color:#a9c4d6; font-size:16px; }
.crm-review-score p { margin:0; color:#d0e1ed; line-height:1.5; }
.crm-review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
.crm-review-grid article,.crm-review-coaching { padding:16px; border:1px solid #dce4e9; border-radius:7px; background:#fff; }
.crm-review-grid article > span,.crm-review-coaching > span { color:#547e9d; }
.crm-review-grid p,.crm-review-grid ul,.crm-review-coaching p { margin:10px 0 0; color:#536a7b; font-size:12px; line-height:1.6; }
.crm-review-grid ul { padding-left:18px; }
.crm-review-coaching { margin-top:12px; border-left:4px solid #2ca7a0; }
.crm-review-coaching small { display:block; margin-top:12px; color:#8a99a7; font-size:10px; }
.crm-review-empty { padding:80px 30px; border:1px dashed #cbd8e0; border-radius:7px; background:#fff; color:#6e8190; text-align:center; }
.crm-review-empty b { color:#40596b; }
.make-intro { max-width:930px; margin-bottom:20px; }
.make-intro h2 { margin:8px 0; font-size:31px; }
.make-intro p { margin:0; color:var(--muted); line-height:1.6; }
.make-studio { display:grid; min-height:770px; grid-template-columns:230px minmax(0,1fr); overflow:hidden; border:1px solid #1c3148; border-radius:16px; background:#eef1f5; color:#263442; box-shadow:0 18px 45px rgba(0,0,0,.27); }
.make-leftbar { display:flex; flex-direction:column; padding:16px 12px; background:#233246; color:#d9e4ee; }
.make-brand { display:flex; flex-direction:column; padding:7px 9px 24px; }
.make-brand b { color:#fff; font-size:23px; letter-spacing:-.06em; }
.make-brand span { margin-top:2px; color:#9cafc1; font-size:11px; }
.make-scenario { padding:13px; border:1px solid #456074; border-radius:8px; background:#30455d; color:#f2f7fb; text-align:left; font:inherit; }
.make-scenario b,.make-scenario small { display:block; }
.make-scenario small { margin-top:5px; color:#b8c7d4; font-size:10px; }
.make-coming { margin:27px 9px; }
.make-coming span { color:#8398ad; font-size:9px; font-weight:800; letter-spacing:.13em; }
.make-coming p { margin:14px 0; color:#bdcad5; font-size:12px; }
.make-reset { margin-top:auto; padding:9px; border:1px solid #566b7e; border-radius:5px; background:transparent; color:#d4e0e9; font:inherit; font-size:11px; }
.make-workspace { min-width:0; background:#eef1f5; }
.make-toolbar { display:flex; justify-content:space-between; align-items:center; gap:15px; min-height:74px; padding:14px 20px; border-bottom:1px solid #d6dde5; background:#fff; }
.make-toolbar > div:first-child span,.make-panel-label { display:block; color:#718495; font-size:9px; font-weight:800; letter-spacing:.12em; }
.make-toolbar > div:first-child b { display:block; margin-top:4px; color:#31485a; font-size:15px; }
.make-toolbar > div:last-child { display:flex; gap:8px; }
.make-toolbar button { padding:10px 13px; border-radius:5px; font:inherit; font-size:12px; font-weight:700; }
.make-outline { border:1px solid #ccd8e1; background:#fff; color:#4b6577; }
.make-run { border:1px solid #8656e4; background:#8656e4; color:#fff; }
.make-canvas { min-height:410px; padding:25px; background-color:#f7f8fa; background-image:radial-gradient(#cbd4de 1px, transparent 1px); background-size:18px 18px; }
.make-canvas-note { max-width:720px; margin:0 auto 38px; padding:11px 13px; border:1px solid #ead9a5; border-radius:6px; background:#fff9e8; color:#6c5b2d; font-size:12px; line-height:1.5; }
.make-flow { display:flex; align-items:center; justify-content:center; min-width:max-content; padding:18px 0 28px; }
.make-flow-step { display:flex; align-items:center; }
.make-module { display:flex; align-items:center; gap:9px; width:150px; min-height:105px; padding:11px; border:2px solid #d0dbe4; border-radius:9px; background:#fff; color:#344c5d; text-align:left; box-shadow:0 3px 8px rgba(30,48,70,.08); cursor:pointer; }
.make-module.selected { border-color:#8a55dd; box-shadow:0 0 0 3px rgba(138,85,221,.17); }
.make-module > span:nth-child(2) { min-width:0; flex:1; }
.make-module em,.make-module b,.make-module small { display:block; }
.make-module em { overflow:hidden; color:#8293a1; font-size:9px; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.make-module b { margin:5px 0; color:#31495b; font-size:11px; line-height:1.25; }
.make-module small { color:#7890a0; font-size:9px; }
.make-module i { color:#91a3b1; font-size:16px; font-style:normal; }
.make-module-icon { display:grid; width:31px; height:31px; flex:0 0 31px; place-items:center; border-radius:8px; background:#7252cc; color:#fff; font-size:15px; font-weight:800; }
.make-module-icon.ghlContact { background:#2e9a91; }.make-module-icon.aiBrief { background:#1f7db3; }.make-module-icon.router { background:#df8b36; }.make-module-icon.notify { background:#c95e78; }.make-module-icon.drive { background:#4981c8; }.make-module-icon.humanReview { background:#477a55; }
.make-connector { width:33px; height:3px; background:#97a7b5; position:relative; }.make-connector:after { content:""; position:absolute; right:-2px; top:-4px; border-left:8px solid #97a7b5; border-top:5px solid transparent; border-bottom:5px solid transparent; }
.make-bottom-panel { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); border-top:1px solid #d6dde5; background:#fff; }
.make-config,.make-inspector { padding:20px; }.make-inspector { border-left:1px solid #d6dde5; background:#f9fafb; }
.make-config-title { display:flex; align-items:center; gap:10px; margin:15px 0 10px; }.make-config-title b,.make-config-title small { display:block; }.make-config-title b { color:#334e61; }.make-config-title small { margin-top:3px; color:#7c8e9c; font-size:11px; }
.make-config p { color:#637786; font-size:12px; line-height:1.55; }
.make-config label { display:block; margin-top:13px; color:#587084; font-size:11px; font-weight:700; }.make-config input,.make-config textarea { display:block; box-sizing:border-box; width:100%; margin-top:6px; padding:9px; border:1px solid #cfd9e1; border-radius:5px; background:#fff; color:#385163; font:inherit; font-size:12px; }.make-config textarea { min-height:54px; resize:vertical; }
.make-mapping { margin-top:14px; padding:10px; border-left:3px solid #8a55dd; background:#f3effb; }.make-mapping span { color:#7050a7; font-size:9px; font-weight:800; letter-spacing:.1em; }.make-mapping p { margin:5px 0 0; color:#62567a; font-size:11px; }
.make-run-summary { margin:14px 0; padding:12px; border-radius:6px; background:#eaf7f2; color:#397b68; }.make-run-summary b,.make-run-summary small { display:block; }.make-run-summary small { margin-top:4px; font-size:10px; }.make-run-summary p { margin:8px 0 0; color:#587487; font-size:11px; line-height:1.45; }
.make-run-steps { display:grid; gap:8px; }.make-run-steps > div { display:flex; gap:8px; padding:9px 0; border-bottom:1px solid #e5eaee; }.make-run-steps i { display:grid; width:18px; height:18px; place-items:center; border-radius:50%; background:#54b895; color:#fff; font-size:10px; font-style:normal; }.make-run-steps b,.make-run-steps small { display:block; }.make-run-steps b { color:#4a6070; font-size:11px; }.make-run-steps small { margin-top:3px; color:#81909c; font-size:10px; line-height:1.35; }
.make-no-run { padding:75px 20px; color:#758795; text-align:center; }.make-no-run b { color:#4b6273; }.make-no-run p { margin:7px 0 0; font-size:12px; line-height:1.5; }
.make-learning-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:18px; }.make-learning-grid article { padding:18px; border:1px solid var(--line); border-radius:12px; background:rgba(12,25,42,.88); }.make-learning-grid span { display:block; color:#49a0ff; font-size:10px; font-weight:800; letter-spacing:.1em; }.make-learning-grid b { display:block; margin-top:9px; font-size:15px; }.make-learning-grid p { margin:8px 0 0; color:var(--muted); font-size:13px; line-height:1.55; }
@media (max-width:1200px) { .make-flow { justify-content:flex-start; overflow-x:auto; } .make-bottom-panel { grid-template-columns:1fr; } .make-inspector { border-top:1px solid #d6dde5; border-left:0; } }
@media (max-width:800px) { .make-studio { grid-template-columns:1fr; }.make-leftbar { flex-direction:row; align-items:center; gap:10px; overflow:auto; }.make-brand,.make-coming { display:none; }.make-scenario { min-width:190px; }.make-reset { margin:0 0 0 auto; white-space:nowrap; }.make-toolbar { align-items:flex-start; flex-direction:column; }.make-learning-grid { grid-template-columns:1fr; }.make-canvas { overflow:auto; } }
@media (max-width:1100px) { .crm-shell { grid-template-columns:180px minmax(0,1fr); } .crm-conversations { grid-template-columns:220px minmax(300px,1fr); } .crm-contact-panel { grid-column:1 / -1; border-top:1px solid #dce3e9; border-left:0; } .crm-review-layout { grid-template-columns:1fr; } }
@media (max-width:760px) { .crm-shell { grid-template-columns:1fr; } .crm-main-nav { flex-direction:row; overflow:auto; } .crm-main-nav .crm-logo,.crm-main-nav .crm-location,.crm-main-nav .crm-nav-label,.crm-main-nav .disabled { display:none; } .crm-main-nav button { width:auto; white-space:nowrap; } .crm-conversations { height:auto; grid-template-columns:1fr; } .crm-thread-list { max-height:290px; overflow:auto; } .crm-contact-panel { display:none; } .crm-table-view,.crm-opportunity-view,.crm-calendar { overflow-x:auto; padding:18px; } .crm-table-view table { min-width:750px; } .crm-calendar-grid { min-width:700px; } }
@media (max-width:800px) { .northbridge-menu { display:none; } .northbridge-hero,.northbridge-content,.northbridge-stats,.northbridge-page-grid,.northbridge-team > div,.northbridge-sector-grid,.northbridge-insight-grid { grid-template-columns:1fr; } .northbridge-stats > div { border-right:0; border-bottom:1px solid #d5dedf; } .northbridge-footer { display:grid; } }
.session-catalog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.session-card { display: flex; min-height: 238px; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: rgba(12, 25, 42, .88); }
.session-card h3 { margin: 9px 0 6px; font-size: 19px; }
.session-card p { margin: 0; color: var(--muted); }
.session-card-build { margin: 16px 0; color: #d8e8fb; font-size: 13px; }
.session-card .btn { margin-top: auto; align-self: flex-start; }
.session-plan { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.session-plan .card { min-height: 190px; }
.session-plan ol { margin: 14px 0 0; padding-left: 22px; color: #d7e6f7; line-height: 1.8; }
.presentation-only { display: grid; min-height: 100vh; place-items: center; background: #040c17; }
.grace-presentation { width: min(1500px, 100vw); max-width: none; margin: 0; padding: clamp(16px, 3vw, 40px); }
.grace-slide { min-height: calc(100vh - clamp(32px, 6vw, 80px)); }

@media (max-width: 1080px) {
  .session-room-layout { grid-template-columns: 190px minmax(0, 1fr); }
  .mentor-notes { grid-column: 1 / -1; position: static; }
  .session-agenda { max-height: none; }
}

@media (max-width: 900px) {
  .session-room-layout { grid-template-columns: 1fr; }
  .session-agenda { position: static; }
  .presentation-frame { min-height: 470px; }
  .session-room-head { align-items: flex-start; }
  .session-catalog,
  .session-plan { grid-template-columns: 1fr; }
  .session-clock { grid-template-columns: 1fr; }
  .session-clock-values { width: 100%; }
  .session-clock-values > div { flex: 1; min-width: 0; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
  .stats-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .week-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .audit-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1200px) and (min-width: 901px) {
  .training-resource-card.span4 {
    grid-column: span 6;
  }
}

@media (max-width: 900px) {
  .app {
    grid-template-columns: 1fr;
  }

  aside {
    position: relative;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  nav {
    grid-template-columns:
      repeat(3, 1fr);
  }

  .asideFoot {
    display: none;
  }

  main {
    padding: 22px 16px 50px;
  }

  header {
    align-items: flex-start;
  }

  .profile {
    display: none;
  }

  .hero,
  .two-column,
  .mentor-layout {
    grid-template-columns: 1fr;
  }

  .build-grid,
  .asset-grid {
    grid-template-columns: 1fr;
  }

  .span8,
  .span4,
  .span6 {
    grid-column: span 12;
  }
}

@media (max-width: 650px) {
  .stats-grid,
  .week-grid,
  .audit-grid,
  .scenario-grid,
  .asset-mini-grid {
    grid-template-columns: 1fr;
  }

  .panel-heading,
  .session-title-row,
  .session-topline,
  .card-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .mentor-message {
    max-width: 95%;
  }
}

@media (max-width: 520px) {
  nav {
    grid-template-columns:
      repeat(2, 1fr);
  }

  h1 {
    font-size: 27px;
  }

  .panel {
    padding: 17px;
  }

  .session-row {
    grid-template-columns: 34px 1fr;
  }

  .mentor-clock-pair { width: 100%; }
  .mentor-clock-pair > div { flex: 1; min-width: 0; }
  .timer-control-row button { width: 100%; }
  .presentation-student-clock { position: static; margin-bottom: 12px; }
}