/* CALM THE MOMENT V2 — current working source for Claude Code refactor */
.ctm-page{position:relative;overflow:hidden;padding:clamp(56px,7vw,104px) 24px clamp(88px,10vw,140px);background:#fff;color:var(--lrl-ink,#080b12);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.ctm-page *,.ctm-page *:before,.ctm-page *:after{box-sizing:border-box}.ctm-page:before{content:"";position:absolute;top:60px;right:-220px;width:620px;height:620px;border-radius:999px;background:radial-gradient(circle,rgba(37,99,235,.14),transparent 62%);pointer-events:none}.ctm-page:after{content:"";position:absolute;top:760px;left:-260px;width:580px;height:580px;border-radius:999px;background:radial-gradient(circle,rgba(20,184,166,.12),transparent 64%);pointer-events:none}.ctm-shell{position:relative;z-index:1;max-width:1180px;margin:0 auto}.ctm-hero{max-width:980px;margin:0 auto 70px;text-align:center}.ctm-eyebrow,.ctm-small-eyebrow{display:inline-flex;width:fit-content;margin:0 0 22px;padding:10px 14px;border-radius:999px;background:linear-gradient(135deg,rgba(37,99,235,.11),rgba(124,58,237,.11),rgba(20,184,166,.11));color:#5b21b6;font-size:12px;font-weight:900;letter-spacing:.16em;line-height:1;text-transform:uppercase;box-shadow:inset 0 0 0 1px rgba(124,58,237,.1)}.ctm-hero h1{margin:0 0 28px;color:#080b12;font-size:clamp(54px,7vw,98px);line-height:.92;letter-spacing:-.07em}.ctm-hero h1 span{background:linear-gradient(135deg,#2563eb 0%,#7c3aed 48%,#14b8a6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.ctm-intro{max-width:880px;margin:0 auto;color:#596173;font-size:clamp(19px,2vw,23px);line-height:1.72}.ctm-hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:36px}.ctm-btn{display:inline-flex;justify-content:center;align-items:center;min-height:52px;padding:15px 23px;border-radius:999px;border:0;font-size:15px;font-weight:850;line-height:1;text-decoration:none!important;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease,opacity .22s ease}.ctm-btn:hover{transform:translateY(-2px)}.ctm-btn.primary,.ctm-btn.primary:visited,.ctm-btn.primary:active{background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%)!important;color:#fff!important;box-shadow:0 18px 44px rgba(37,99,235,.22)}.ctm-btn.secondary,.ctm-btn.secondary:visited,.ctm-btn.secondary:active{border:1px solid rgba(15,23,42,.08)!important;background:rgba(255,255,255,.92)!important;color:#0f172a!important;box-shadow:0 12px 30px rgba(15,23,42,.055)}.ctm-opening-section,.ctm-build-section{max-width:900px;margin:0 auto 64px;padding:46px;border:1px solid rgba(15,23,42,.06);border-radius:38px;background:#fff;box-shadow:0 18px 52px rgba(15,23,42,.055)}.ctm-opening-section p,.ctm-build-section p,.ctm-section-header p,.ctm-summary-section p,.ctm-pro-card p,.ctm-closing p{margin:0 0 24px;color:#596173;font-size:clamp(18px,2vw,21px);line-height:1.78}.ctm-opening-section p:first-child{color:#080b12;font-size:clamp(25px,3vw,36px);line-height:1.16;letter-spacing:-.045em;font-weight:850}.ctm-summary-section,.ctm-pro-section,.ctm-best-section,.ctm-design-section,.ctm-code-section,.ctm-related-section,.ctm-preview-section{position:relative;margin:0 0 72px}.ctm-summary-section{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:24px;align-items:stretch;padding:38px;border:1px solid rgba(124,58,237,.1);border-radius:34px;background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(124,58,237,.06),rgba(20,184,166,.06))}.ctm-summary-copy h2,.ctm-section-header h2,.ctm-pro-card h2,.ctm-build-section h2,.ctm-closing h2{margin:0 0 24px;color:#080b12;font-size:clamp(36px,4.8vw,60px);line-height:.98;letter-spacing:-.055em}.ctm-summary-stats{display:grid;gap:14px}.ctm-summary-stats div{padding:22px;border:1px solid rgba(15,23,42,.07);border-radius:24px;background:#fff;box-shadow:0 14px 38px rgba(15,23,42,.045)}.ctm-summary-stats strong{display:block;color:#080b12;font-size:42px;line-height:1;letter-spacing:-.06em}.ctm-summary-stats span{display:block;margin-top:8px;color:#5b21b6;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.ctm-section-header{max-width:840px;margin-bottom:34px}.ctm-module{position:relative;overflow:hidden;isolation:isolate;border:1px solid rgba(15,23,42,.08);border-radius:36px;background:#fff;box-shadow:0 32px 90px rgba(15,23,42,.12)}.ctm-module:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 86% 14%,rgba(37,99,235,.12),transparent 34%),radial-gradient(circle at 16% 86%,rgba(20,184,166,.12),transparent 34%);z-index:-1}.ctm-module-topbar{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);gap:20px;align-items:center;padding:18px 22px;border-bottom:1px solid rgba(15,23,42,.075);background:rgba(255,255,255,.94)}.ctm-module-brand{display:flex;gap:12px;align-items:center}.ctm-module-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%);color:#fff;font-size:14px;font-weight:950}.ctm-module-brand span,.ctm-module-progress span{display:block;color:#080b12;font-size:14px;font-weight:900}.ctm-module-brand strong{display:block;margin-top:2px;color:#667085;font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.ctm-module-progress{display:grid;gap:10px}.ctm-progress-track,.ctm-meter-track{height:10px;overflow:hidden;border-radius:999px;background:rgba(15,23,42,.08)}.ctm-progress-fill,.ctm-meter-track div{width:0%;height:100%;border-radius:inherit;background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%);transition:width .45s ease}.ctm-module-body{display:grid;grid-template-columns:292px minmax(0,1fr);align-items:stretch}.ctm-module-sidebar{display:flex;flex-direction:column;gap:18px;min-height:660px;padding:20px;border-right:1px solid rgba(15,23,42,.075);background:rgba(248,250,252,.92)}.ctm-sidebar-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.ctm-sidebar-heading p,.ctm-meter-panel>p{margin:0;color:#080b12;font-size:12px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.ctm-sidebar-heading span{color:#6d28d9;font-size:12px;font-weight:900}.ctm-preview-menu{display:grid;gap:8px}.ctm-menu-btn{display:grid;grid-template-columns:28px 1fr;gap:10px;width:100%;padding:12px;border:1px solid transparent;border-radius:16px;background:transparent;text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.ctm-menu-btn:hover,.ctm-menu-btn.is-active{transform:translateY(-1px);background:#fff;border-color:rgba(124,58,237,.16);box-shadow:0 12px 28px rgba(15,23,42,.055)}.ctm-menu-number{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;background:rgba(124,58,237,.1);color:#6d28d9;font-size:11px;font-weight:950}.ctm-menu-text strong{display:block;color:#080b12;font-size:13px;line-height:1.2}.ctm-menu-text span{display:block;margin-top:4px;color:#667085;font-size:11px;font-weight:750}.ctm-meter-panel{display:grid;gap:13px;margin-top:auto;padding:16px;border:1px solid rgba(15,23,42,.075);border-radius:22px;background:#fff}.ctm-meter{display:grid;gap:7px}.ctm-meter div:first-child{display:flex;justify-content:space-between;gap:12px}.ctm-meter span{color:#667085;font-size:12px;font-weight:850}.ctm-meter strong{color:#080b12;font-size:14px;font-weight:950}.ctm-stage-wrap{display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0;background:radial-gradient(circle at 88% 10%,rgba(37,99,235,.11),transparent 34%),radial-gradient(circle at 18% 92%,rgba(20,184,166,.11),transparent 36%),#f8fafc}.ctm-slide{position:relative;min-height:600px;margin:28px;padding:clamp(24px,3.5vw,44px);overflow:hidden;border:1px solid rgba(15,23,42,.08);border-radius:32px;background:radial-gradient(circle at 92% 8%,rgba(124,58,237,.08),transparent 34%),#fff;box-shadow:0 22px 60px rgba(15,23,42,.1);display:grid;align-content:center}.ctm-slide-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(400px,1.1fr);gap:clamp(16px,3vw,36px);align-items:center}.ctm-slide-kicker,.ctm-label-pill{display:inline-flex;width:fit-content;margin:0 0 18px;padding:9px 12px;border-radius:999px;background:rgba(124,58,237,.08);color:#6d28d9;font-size:11px;font-weight:950;letter-spacing:.14em;text-transform:uppercase}.ctm-slide h2{margin:0 0 20px;color:#080b12;font-size:clamp(34px,4.8vw,64px);line-height:.98;letter-spacing:-.06em}.ctm-slide h3{margin:0 0 12px;color:#080b12;font-size:clamp(27px,3.5vw,44px);line-height:1;letter-spacing:-.055em}.ctm-slide p{margin:0 0 18px;color:#596173;font-size:18px;line-height:1.7}.ctm-message-panel,.ctm-quote-card,.ctm-visual-card,.ctm-slide-card,.ctm-scan-card{position:relative;z-index:1;padding:24px;border:1px solid rgba(15,23,42,.075);border-radius:26px;background:#fff;box-shadow:0 16px 44px rgba(15,23,42,.075)}.ctm-message-panel{display:grid;gap:14px}.ctm-message-bubble{padding:18px;border-radius:22px;border:1px solid rgba(15,23,42,.075);background:#f8fafc}.ctm-message-bubble.customer{background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(124,58,237,.06))}.ctm-message-bubble small{display:block;margin-bottom:8px;color:#6d28d9;font-size:10px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.ctm-message-bubble p{margin:0;color:#080b12;font-size:18px;line-height:1.38;letter-spacing:-.03em;font-weight:800}.ctm-signal-row{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.ctm-signal-mini{padding:14px;border-radius:18px;background:#f8fafc;border:1px solid rgba(15,23,42,.075)}.ctm-signal-mini strong{display:block;color:#080b12;font-size:14px;margin-bottom:4px}.ctm-signal-mini span{color:#667085;font-size:12px;font-weight:800}.ctm-choice-grid,.ctm-confidence-grid,.ctm-system-grid{position:relative;z-index:1;display:grid;gap:14px}.ctm-choice-grid,.ctm-confidence-grid,.ctm-system-grid{grid-template-columns:repeat(3,1fr)}.ctm-choice-card,.ctm-confidence-card,.ctm-system-card{display:flex;flex-direction:column;min-height:100%;padding:22px;border:1px solid rgba(15,23,42,.075);border-radius:24px;background:#fff;text-align:left;cursor:pointer;box-shadow:0 14px 36px rgba(15,23,42,.05);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,opacity .22s ease,background .22s ease}.ctm-choice-card:hover,.ctm-confidence-card:hover,.ctm-system-card:hover{transform:translateY(-4px);border-color:rgba(124,58,237,.24);box-shadow:0 22px 56px rgba(15,23,42,.09)}.ctm-choice-card.is-muted,.ctm-confidence-card.is-muted{opacity:.42}.ctm-choice-card.is-selected,.ctm-confidence-card.is-selected{opacity:1;border-color:rgba(124,58,237,.36);background:radial-gradient(circle at 92% 12%,rgba(124,58,237,.1),transparent 30%),#fff;box-shadow:0 22px 58px rgba(124,58,237,.14)}.ctm-choice-card span,.ctm-system-card span{display:inline-flex;width:fit-content;margin-bottom:14px;padding:7px 10px;border-radius:999px;background:rgba(37,99,235,.08);color:#2563eb;font-size:10px;font-weight:950;letter-spacing:.12em;text-transform:uppercase}.ctm-choice-card strong,.ctm-confidence-card strong,.ctm-system-card strong{display:block;margin-bottom:10px;color:#080b12;font-size:21px;line-height:1.08;letter-spacing:-.04em}.ctm-choice-card p,.ctm-confidence-card p,.ctm-system-card p{margin:0;color:#596173;font-size:15px;line-height:1.6}.ctm-locked-card{position:relative;z-index:1;max-width:620px;margin:0 auto;padding:clamp(30px,5vw,54px);border:1px solid rgba(124,58,237,.16);border-radius:34px;background:radial-gradient(circle at 92% 8%,rgba(37,99,235,.13),transparent 34%),radial-gradient(circle at 12% 92%,rgba(20,184,166,.12),transparent 34%),#fff;box-shadow:0 26px 76px rgba(15,23,42,.13);text-align:center}.ctm-lock-icon{display:grid;place-items:center;width:68px;height:68px;margin:0 auto 20px;border-radius:24px;background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%);color:#fff;font-size:28px;font-weight:950;box-shadow:0 20px 48px rgba(37,99,235,.24)}.ctm-module-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:18px 22px;border-top:1px solid rgba(15,23,42,.075);background:rgba(255,255,255,.94)}.ctm-control{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:13px 20px;border-radius:999px;border:0;font-size:14px;font-weight:950;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,opacity .22s ease}.ctm-control.primary{background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%);color:#fff;box-shadow:0 16px 34px rgba(37,99,235,.22)}.ctm-control.secondary{border:1px solid rgba(15,23,42,.08);background:#fff;color:#080b12}.ctm-control:disabled{opacity:.42;cursor:not-allowed;transform:none}.ctm-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:7px}.ctm-dot{width:8px;height:8px;border-radius:999px;background:rgba(15,23,42,.16)}.ctm-dot.is-active{width:24px;background:linear-gradient(135deg,#2563eb 0%,#7c3aed 52%,#14b8a6 100%)}.ctm-pro-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:30px;padding:38px;border:1px solid rgba(124,58,237,.12);border-radius:34px;background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(124,58,237,.06),rgba(20,184,166,.06))}.ctm-pro-list{padding:28px;border:1px solid rgba(15,23,42,.075);border-radius:28px;background:#fff;box-shadow:0 16px 44px rgba(15,23,42,.055)}.ctm-pro-list h3{margin:0 0 18px;color:#080b12;font-size:15px;font-weight:950;letter-spacing:.02em}.ctm-pro-list ul{margin:0 0 24px;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}.ctm-pro-list li{display:flex;align-items:center;gap:10px;color:#596173;font-size:14px;line-height:1.5}.ctm-pro-list li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:999px;background:linear-gradient(135deg,#2563eb,#7c3aed);flex-shrink:0}.ctm-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.ctm-info-card,.ctm-related-card{padding:26px;border:1px solid rgba(15,23,42,.065);border-radius:28px;background:#fff;box-shadow:0 14px 38px rgba(15,23,42,.045)}.ctm-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.ctm-code-card{overflow:hidden;border-radius:28px;background:#0f172a;box-shadow:0 22px 60px rgba(15,23,42,.16)}.ctm-code-card pre{margin:0;overflow-x:auto;padding:26px}.ctm-code-card code{color:#e5eefc;font-size:14px;line-height:1.72;font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace}.ctm-closing{padding:38px;border:1px solid rgba(124,58,237,.12);border-radius:34px;background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(124,58,237,.06),rgba(20,184,166,.06))}.ctm-feedback-layer{position:fixed;inset:0;z-index:999;display:grid;place-items:center;padding:24px;background:rgba(8,11,18,.42);backdrop-filter:blur(12px)}.ctm-feedback-layer[hidden]{display:none}.ctm-feedback-card{width:min(680px,100%);padding:clamp(28px,5vw,48px);border-radius:34px;background:radial-gradient(circle at 92% 8%,rgba(37,99,235,.12),transparent 32%),#fff;box-shadow:0 34px 90px rgba(0,0,0,.24)}.ctm-feedback-card h2{margin:0 0 16px;color:#080b12;font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.06em}.ctm-feedback-card p{margin:0 0 22px;color:#596173;font-size:18px;line-height:1.68}@media(max-width:1100px){.ctm-summary-section,.ctm-pro-card,.ctm-module-body,.ctm-slide-grid{grid-template-columns:1fr}.ctm-module-sidebar{min-height:auto;border-right:0;border-bottom:1px solid rgba(15,23,42,.075)}.ctm-card-grid{grid-template-columns:repeat(2,1fr)}.ctm-related-grid{grid-template-columns:1fr}}@media(max-width:760px){.ctm-page{padding:64px 18px 90px}.ctm-hero{text-align:left}.ctm-opening-section,.ctm-build-section,.ctm-summary-section,.ctm-pro-card,.ctm-closing{padding:26px;border-radius:28px}.ctm-module-topbar{grid-template-columns:1fr}.ctm-slide{margin:18px;min-height:540px;padding:26px}.ctm-choice-grid,.ctm-confidence-grid,.ctm-system-grid,.ctm-card-grid,.ctm-signal-row{grid-template-columns:1fr}.ctm-module-controls{grid-template-columns:1fr 1fr}.ctm-dots{display:none}.ctm-control,.ctm-btn{width:100%}.ctm-hero-actions{flex-direction:column;align-items:stretch}}
/* ============================================================
   CALM THE MOMENT — v3 interaction layer
   Supplemental file: load AFTER calm-the-moment.css
   Brand: white bg, Inter, blue #2563eb / violet #7c3aed / teal #14b8a6
   Adds: slide transitions, choice card states, outcome colors,
         animated meters, feedback modal polish, stagger entrances
   ============================================================ */

/* Remove focus outline on slide (focused programmatically, not by user) */
.ctm-slide:focus { outline: none; }

/* ── SLIDE TRANSITIONS ──────────────────────────────────────── */
.ctm-slide {
  transition: opacity .18s ease, transform .18s ease;
}
.ctm-slide.is-exiting {
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
}
.ctm-slide.is-entering {
  animation: ctmSlideIn .32s cubic-bezier(.22,.68,0,1.2) forwards;
}
@keyframes ctmSlideIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Stagger children on enter */
.ctm-stagger-in {
  animation: ctmCardIn .36s cubic-bezier(.22,.68,0,1.2) both;
}
@keyframes ctmCardIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── CHOICE SLIDE LAYOUT ────────────────────────────────────── */
.ctm-choice-slide {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ctm-choice-header { max-width: 640px; }
.ctm-choice-instruction {
  margin: 0;
  color: #596173;
  font-size: 18px;
  line-height: 1.7;
}

/* Full-width vertical stack */
.ctm-choice-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  grid-template-columns: unset !important;
}

/* ── CHOICE CARDS ───────────────────────────────────────────── */
.ctm-choice-card {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "num label arrow"
    "num desc  arrow" !important;
  column-gap: 16px !important;
  row-gap: 3px !important;
  align-items: start;
  padding: 20px 22px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  background: #fff !important;
  box-shadow: 0 4px 16px rgba(15,23,42,.05) !important;
  transition:
    border-color .2s ease,
    background   .2s ease,
    transform    .2s cubic-bezier(.22,.68,0,1.2),
    box-shadow   .2s ease,
    opacity      .2s ease !important;
  position: relative;
  overflow: hidden;
  flex-direction: unset !important;
  min-height: unset !important;
}

/* Shimmer sweep on hover */
.ctm-choice-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(37,99,235,.04) 50%, transparent 60%);
  transform: translateX(-100%);
  transition: transform .5s ease;
  pointer-events: none;
}
.ctm-choice-card:not(.is-muted):not(.is-selected):hover::before {
  transform: translateX(100%);
}

/* Hover */
.ctm-choice-card:not(:disabled):hover {
  transform: translateX(5px) !important;
  border-color: rgba(124,58,237,.2) !important;
  background: rgba(124,58,237,.03) !important;
  box-shadow: 0 8px 28px rgba(15,23,42,.09) !important;
}

/* Selected — default violet */
.ctm-choice-card.is-selected {
  transform: translateX(0) !important;
  border-color: rgba(124,58,237,.35) !important;
  background: radial-gradient(circle at 96% 10%, rgba(124,58,237,.08), transparent 40%), #fff !important;
  box-shadow: 0 0 0 1px rgba(124,58,237,.12), 0 12px 36px rgba(124,58,237,.12) !important;
  cursor: default;
}

/* Outcome: correct → teal/green */
.ctm-choice-card.is-selected.outcome-positive {
  border-color: rgba(20,184,166,.5) !important;
  background: radial-gradient(circle at 96% 10%, rgba(20,184,166,.09), transparent 40%), #fff !important;
  box-shadow: 0 0 0 1px rgba(20,184,166,.18), 0 12px 36px rgba(20,184,166,.12) !important;
}

/* Outcome: incorrect → red */
.ctm-choice-card.is-selected.outcome-negative {
  border-color: rgba(239,68,68,.45) !important;
  background: radial-gradient(circle at 96% 10%, rgba(239,68,68,.07), transparent 40%), #fff !important;
  box-shadow: 0 0 0 1px rgba(239,68,68,.15), 0 12px 36px rgba(239,68,68,.1) !important;
}

/* Outcome: partial → amber */
.ctm-choice-card.is-selected.outcome-neutral {
  border-color: rgba(245,158,11,.45) !important;
  background: radial-gradient(circle at 96% 10%, rgba(245,158,11,.07), transparent 40%), #fff !important;
  box-shadow: 0 0 0 1px rgba(245,158,11,.15), 0 12px 36px rgba(245,158,11,.1) !important;
}

/* Muted (unchosen after pick) */
.ctm-choice-card.is-muted {
  opacity: .35 !important;
  transform: none !important;
  filter: grayscale(.3);
  cursor: default;
  pointer-events: none;
}

/* Card internals */
.ctm-choice-num {
  grid-area: num;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 26px !important;
  height: 26px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(15,23,42,.1) !important;
  background: rgba(37,99,235,.06) !important;
  color: #2563eb !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  transition: background .2s, border-color .2s, color .2s;
  flex-shrink: 0;
}
.ctm-choice-card:not(.is-muted):hover .ctm-choice-num {
  background: rgba(124,58,237,.1) !important;
  border-color: rgba(124,58,237,.2) !important;
  color: #6d28d9 !important;
}

.ctm-choice-label {
  grid-area: label;
  display: block;
  color: #080b12;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.025em;
  margin-bottom: 0 !important;
}

.ctm-choice-desc {
  grid-area: desc;
  margin: 0 !important;
  color: #667085;
  font-size: 13px;
  line-height: 1.55;
}

.ctm-choice-arrow {
  grid-area: arrow;
  align-self: center;
  color: rgba(15,23,42,.2);
  font-size: 18px;
  line-height: 1;
  transform: translateX(-3px);
  transition: color .2s, transform .2s cubic-bezier(.22,.68,0,1.2);
}
.ctm-choice-card:not(.is-muted):hover .ctm-choice-arrow {
  color: #6d28d9;
  transform: translateX(0);
}
.ctm-choice-card.is-selected .ctm-choice-arrow {
  color: rgba(15,23,42,.3);
  transform: translateX(0);
}

/* ── CONFIDENCE GRID ────────────────────────────────────────── */
.ctm-confidence-slide {
  display: flex;
  flex-direction: column;
  gap: 28px;
  position: relative;
  z-index: 1;
}

.ctm-confidence-grid {
  display: grid !important;
  grid-template-columns: repeat(3,1fr) !important;
  gap: 14px !important;
}

.ctm-confidence-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 24px 20px !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 6px 20px rgba(15,23,42,.05) !important;
  cursor: pointer;
  transition:
    border-color .2s ease,
    background   .2s ease,
    transform    .2s cubic-bezier(.22,.68,0,1.2),
    box-shadow   .2s ease !important;
}
.ctm-confidence-card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(124,58,237,.22) !important;
  box-shadow: 0 16px 40px rgba(124,58,237,.1) !important;
}
.ctm-confidence-card.is-selected {
  border-color: rgba(124,58,237,.35) !important;
  background: radial-gradient(circle at 92% 10%, rgba(124,58,237,.09), transparent 40%), #fff !important;
  box-shadow: 0 0 0 1px rgba(124,58,237,.12), 0 14px 36px rgba(124,58,237,.12) !important;
  transform: translateY(-4px) !important;
}

.ctm-conf-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(37,99,235,.06);
  color: #2563eb;
  font-size: 15px;
  font-weight: 700;
  transition: background .2s, border-color .2s;
}
.ctm-confidence-card:hover .ctm-conf-icon,
.ctm-confidence-card.is-selected .ctm-conf-icon {
  background: rgba(124,58,237,.1);
  border-color: rgba(124,58,237,.18);
  color: #6d28d9;
}

.ctm-confidence-card strong {
  color: #080b12 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -.025em !important;
  margin-bottom: 0 !important;
}
.ctm-confidence-card p {
  margin: 0 !important;
  color: #667085 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

/* ── SYSTEM CARDS ───────────────────────────────────────────── */
.ctm-sys-label {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(37,99,235,.07);
  border: 1px solid rgba(37,99,235,.12);
  color: #2563eb;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 10px;
}

/* ── METER BARS — COLOR-CODED ───────────────────────────────── */
.ctm-meter-track div {
  transition: width .55s cubic-bezier(.4,0,.2,1) !important;
}
.ctm-meter-fill.is-high {
  background: linear-gradient(90deg, #14b8a6, #2563eb) !important;
}
.ctm-meter-fill.is-low {
  background: linear-gradient(90deg, #ef4444, #f97316) !important;
}

/* Meter value: animate via JS — no CSS change needed */

/* ── FEEDBACK MODAL ─────────────────────────────────────────── */
.ctm-feedback-layer {
  transition: opacity .22s ease;
}
.ctm-feedback-layer.is-visible {
  animation: ctmOverlayIn .22s ease forwards;
}
.ctm-feedback-layer.is-hiding {
  animation: ctmOverlayOut .22s ease forwards;
}
@keyframes ctmOverlayIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes ctmOverlayOut {
  from { opacity: 1; }
  to   { opacity: 0; }
}

.ctm-feedback-card {
  animation: ctmCardPop .3s cubic-bezier(.22,.68,0,1.2) forwards;
}
@keyframes ctmCardPop {
  from { opacity: 0; transform: scale(.95) translateY(10px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Outcome tints on feedback card */
.ctm-feedback-layer.outcome-positive .ctm-feedback-card {
  background: radial-gradient(circle at 92% 8%, rgba(20,184,166,.12), transparent 32%), #fff !important;
  box-shadow: 0 34px 90px rgba(20,184,166,.15), 0 0 0 1px rgba(20,184,166,.14) !important;
}
.ctm-feedback-layer.outcome-negative .ctm-feedback-card {
  background: radial-gradient(circle at 92% 8%, rgba(239,68,68,.1), transparent 32%), #fff !important;
  box-shadow: 0 34px 90px rgba(239,68,68,.12), 0 0 0 1px rgba(239,68,68,.12) !important;
}

/* Feedback kicker color */
.ctm-feedback-kicker {
  display: block;
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ctm-feedback-layer.outcome-positive .ctm-feedback-kicker { color: #14b8a6; }
.ctm-feedback-layer.outcome-negative .ctm-feedback-kicker { color: #ef4444; }
.ctm-feedback-layer.outcome-neutral  .ctm-feedback-kicker { color: #6d28d9; }
.ctm-feedback-layer:not([class*="outcome"]) .ctm-feedback-kicker { color: #6d28d9; }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width: 760px) {
  .ctm-confidence-grid {
    grid-template-columns: 1fr !important;
  }
  .ctm-choice-card {
    grid-template-areas:
      "num label"
      ".   desc" !important;
    grid-template-columns: auto 1fr !important;
  }
  .ctm-choice-arrow { display: none; }
}
/* =========================================================
   Calm the Moment — Design Lab Visual System Override
   Add to bottom of /assets/css/calm-the-moment.css
   ========================================================= */

:root {
  --ctm-ink: #f8fbff;
  --ctm-muted: rgba(226, 232, 240, 0.76);
  --ctm-soft: rgba(255, 255, 255, 0.08);
  --ctm-line: rgba(148, 163, 184, 0.22);
  --ctm-deep: #050816;
  --ctm-navy: #07111f;
  --ctm-panel: rgba(10, 24, 42, 0.82);
  --ctm-panel-strong: rgba(12, 28, 50, 0.96);
  --ctm-cyan: #66e3ff;
  --ctm-lime: #b9ff7a;
  --ctm-gold: #ffd36e;
  --ctm-pink: #ff87c8;
  --ctm-danger: #ff6f8e;
  --ctm-shadow: 0 26px 80px rgba(0, 0, 0, 0.34);
}

/* Page shell */

body {
  color: var(--ctm-ink);
  background:
    radial-gradient(circle at top left, rgba(102, 227, 255, 0.16), transparent 32rem),
    radial-gradient(circle at 76% 10%, rgba(185, 255, 122, 0.12), transparent 28rem),
    radial-gradient(circle at 30% 90%, rgba(255, 135, 200, 0.1), transparent 28rem),
    linear-gradient(135deg, #040813 0%, #071321 45%, #0b1f2d 100%);
  min-height: 100vh;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.92), transparent 84%);
}

.site-shell,
.ctm-page {
  position: relative;
  z-index: 1;
}

.ctm-page {
  background: transparent !important;
  color: var(--ctm-ink) !important;
  padding: clamp(1.25rem, 4vw, 2rem) 24px clamp(5rem, 10vw, 8rem) !important;
}

.ctm-page::before,
.ctm-page::after {
  display: none !important;
}

/* Breadcrumb */

.resource-detail-breadcrumb {
  color: var(--ctm-muted) !important;
  margin-bottom: clamp(1.25rem, 4vw, 2rem) !important;
}

.resource-detail-breadcrumb a {
  color: rgba(248, 251, 255, 0.78) !important;
}

.resource-detail-breadcrumb a:hover {
  color: var(--ctm-cyan) !important;
}

.resource-detail-breadcrumb span {
  color: rgba(226, 232, 240, 0.5) !important;
}

/* Hero */

.resource-detail-hero {
  position: relative;
  overflow: hidden;
  max-width: none !important;
  margin: 0 auto clamp(2rem, 6vw, 4rem) !important;
  padding: clamp(2rem, 5vw, 4rem);
  border: 1px solid var(--ctm-line);
  border-radius: 34px;
  text-align: left !important;
  background:
    radial-gradient(circle at top left, rgba(102, 227, 255, 0.18), transparent 36%),
    radial-gradient(circle at bottom right, rgba(185, 255, 122, 0.12), transparent 32%),
    linear-gradient(145deg, rgba(12, 28, 50, 0.94), rgba(6, 17, 31, 0.88));
  box-shadow: var(--ctm-shadow);
}

.resource-detail-hero::after {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: -140px;
  top: -140px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(102, 227, 255, 0.22), transparent 68%);
  pointer-events: none;
}

.resource-detail-eyebrow,
.ctm-eyebrow,
.ctm-small-eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  gap: 0.5rem;
  min-height: auto !important;
  margin: 0 0 1rem !important;
  padding: 0.48rem 0.72rem !important;
  border: 1px solid rgba(102, 227, 255, 0.28) !important;
  border-radius: 999px;
  background: rgba(102, 227, 255, 0.11) !important;
  color: #dffaff !important;
  box-shadow: none !important;
  font-size: 0.74rem !important;
  font-weight: 900;
  letter-spacing: 0.1em !important;
  line-height: 1;
  text-transform: uppercase;
}

.resource-detail-eyebrow::before {
  display: none !important;
}

.resource-detail-hero h1 {
  position: relative;
  z-index: 1;
  max-width: 920px !important;
  margin: 0 !important;
  color: var(--ctm-ink) !important;
  font-size: clamp(3rem, 8vw, 6.4rem) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.075em !important;
  font-weight: 800 !important;
  text-align: left !important;
}

.resource-detail-gradient,
.resource-detail-hero h1 span {
  background: linear-gradient(135deg, var(--ctm-cyan), var(--ctm-lime)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.resource-detail-intro {
  position: relative;
  z-index: 1;
  max-width: 850px !important;
  margin: 1.25rem 0 0 !important;
  color: var(--ctm-muted) !important;
  font-size: clamp(1.02rem, 1.8vw, 1.22rem) !important;
  line-height: 1.7 !important;
  text-align: left !important;
}

.resource-detail-actions {
  position: relative;
  z-index: 1;
  justify-content: flex-start !important;
}

/* Buttons */

.resource-detail-button,
.ctm-btn,
.ctm-control {
  border-radius: 999px;
  font-weight: 900;
}

.resource-detail-button.primary,
.resource-detail-button.primary:visited,
.ctm-btn.primary,
.ctm-control.primary {
  border: 0 !important;
  color: #071321 !important;
  background: linear-gradient(135deg, var(--ctm-cyan), var(--ctm-lime)) !important;
  box-shadow: 0 16px 34px rgba(102, 227, 255, 0.18) !important;
}

.resource-detail-button.secondary,
.resource-detail-button.secondary:visited,
.ctm-btn.secondary,
.ctm-control.secondary {
  color: var(--ctm-ink) !important;
  border: 1px solid var(--ctm-line) !important;
  background: rgba(255, 255, 255, 0.075) !important;
  box-shadow: none !important;
}

/* Text sections */

.ctm-opening-section,
.ctm-build-section,
.ctm-summary-section,
.ctm-pro-card,
.ctm-closing {
  border: 1px solid var(--ctm-line) !important;
  background: var(--ctm-panel) !important;
  color: var(--ctm-ink) !important;
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.24) !important;
  backdrop-filter: blur(16px);
}

.ctm-opening-section p:first-child,
.ctm-summary-copy h2,
.ctm-section-header h2,
.ctm-pro-card h2,
.ctm-build-section h2,
.ctm-closing h2 {
  color: var(--ctm-ink) !important;
}

.ctm-opening-section p,
.ctm-build-section p,
.ctm-section-header p,
.ctm-summary-section p,
.ctm-pro-card p,
.ctm-closing p {
  color: var(--ctm-muted) !important;
}

.ctm-opening-section p:first-child {
  color: var(--ctm-ink) !important;
}

/* Summary stats */

.ctm-summary-section {
  background:
    radial-gradient(circle at top left, rgba(102, 227, 255, 0.14), transparent 36%),
    radial-gradient(circle at bottom right, rgba(185, 255, 122, 0.1), transparent 34%),
    var(--ctm-panel) !important;
}

.ctm-summary-stats div,
.ctm-pro-list,
.ctm-info-card,
.ctm-related-card {
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18) !important;
}

.ctm-summary-stats strong,
.ctm-info-card h3,
.ctm-related-card h3,
.ctm-pro-list h3 {
  color: var(--ctm-ink) !important;
}

.ctm-summary-stats span,
.ctm-info-card span,
.ctm-related-card span {
  color: var(--ctm-cyan) !important;
}

/* Course module */

.ctm-module {
  border: 1px solid var(--ctm-line) !important;
  background: rgba(10, 24, 42, 0.78) !important;
  box-shadow: var(--ctm-shadow) !important;
}

.ctm-module::before {
  background:
    radial-gradient(circle at 86% 14%, rgba(102, 227, 255, 0.14), transparent 34%),
    radial-gradient(circle at 16% 86%, rgba(185, 255, 122, 0.11), transparent 34%) !important;
}

.ctm-module-topbar,
.ctm-module-controls {
  border-color: rgba(148, 163, 184, 0.18) !important;
  background: rgba(6, 17, 31, 0.78) !important;
}

.ctm-module-brand span,
.ctm-module-progress span,
.ctm-sidebar-heading p,
.ctm-meter-panel > p,
.ctm-menu-text strong,
.ctm-meter strong {
  color: var(--ctm-ink) !important;
}

.ctm-module-brand strong,
.ctm-meter span,
.ctm-menu-text span {
  color: var(--ctm-muted) !important;
}

.ctm-module-sidebar {
  border-color: rgba(148, 163, 184, 0.18) !important;
  background: rgba(6, 17, 31, 0.68) !important;
}

.ctm-stage-wrap {
  background:
    radial-gradient(circle at 88% 10%, rgba(102, 227, 255, 0.1), transparent 34%),
    radial-gradient(circle at 18% 92%, rgba(185, 255, 122, 0.09), transparent 36%),
    rgba(3, 8, 18, 0.62) !important;
}

.ctm-slide {
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(102, 227, 255, 0.1), transparent 34%),
    rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22) !important;
}

.ctm-slide h2,
.ctm-slide h3,
.ctm-message-bubble p,
.ctm-choice-card strong,
.ctm-confidence-card strong,
.ctm-system-card strong {
  color: var(--ctm-ink) !important;
}

.ctm-slide p,
.ctm-choice-card p,
.ctm-confidence-card p,
.ctm-system-card p,
.ctm-choice-desc {
  color: var(--ctm-muted) !important;
}

/* Interactive cards */

.ctm-message-panel,
.ctm-quote-card,
.ctm-visual-card,
.ctm-slide-card,
.ctm-scan-card,
.ctm-message-bubble,
.ctm-choice-card,
.ctm-confidence-card,
.ctm-system-card,
.ctm-meter-panel,
.ctm-locked-card {
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  background: rgba(255, 255, 255, 0.065) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.18) !important;
}

.ctm-choice-card:hover,
.ctm-confidence-card:hover,
.ctm-system-card:hover,
.ctm-menu-btn:hover,
.ctm-menu-btn.is-active {
  border-color: rgba(102, 227, 255, 0.38) !important;
  background: rgba(102, 227, 255, 0.1) !important;
}

.ctm-choice-card.is-selected,
.ctm-confidence-card.is-selected {
  border-color: rgba(185, 255, 122, 0.5) !important;
  background:
    radial-gradient(circle at 96% 10%, rgba(185, 255, 122, 0.12), transparent 40%),
    rgba(255, 255, 255, 0.08) !important;
}

/* Code */

.ctm-code-card {
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  background: rgba(3, 8, 18, 0.92) !important;
  box-shadow: var(--ctm-shadow) !important;
}

.ctm-code-card code {
  color: rgba(226, 232, 240, 0.92) !important;
}

/* Related cards */

.ctm-related-card {
  color: inherit;
  text-decoration: none;
}

.ctm-related-card p {
  color: var(--ctm-muted) !important;
}

.ctm-related-card strong {
  color: var(--ctm-lime) !important;
}

/* Feedback modal */

.ctm-feedback-layer {
  background: rgba(3, 8, 18, 0.72) !important;
}

.ctm-feedback-card {
  border: 1px solid var(--ctm-line) !important;
  background:
    radial-gradient(circle at top left, rgba(102, 227, 255, 0.16), transparent 34%),
    var(--ctm-panel-strong) !important;
  color: var(--ctm-ink) !important;
}

.ctm-feedback-card h2 {
  color: var(--ctm-ink) !important;
}

.ctm-feedback-card p {
  color: var(--ctm-muted) !important;
}

/* Mobile */

@media (max-width: 760px) {
  .ctm-page {
    padding: 1rem 18px 5rem !important;
  }

  .resource-detail-hero {
    padding: 1.35rem;
    border-radius: 26px;
  }

  .resource-detail-hero h1 {
    font-size: clamp(2.65rem, 14vw, 4rem) !important;
  }

  .resource-detail-actions,
  .ctm-hero-actions {
    align-items: stretch;
  }
}
.ctm-slide {
  opacity: 1;
  visibility: visible;
}

.ctm-slide.is-exiting {
  opacity: 0;
}

.ctm-slide.is-entering {
  opacity: 1;
}