
#pc-embed {

  --feroot-navy:           #000247;
  --feroot-navy-deep:      #00012E;


  --primary-dark:          #410AAC;
  --primary:               #6D3CCE;
  --primary-hover:         #5832B5;
  --primary-light:         #E3D6FF;
  --primary-light-hover:   #C6ABFF;
  --primary-lighter:       #ECE7F6;
  --primary-lightest:      #F7F4FF;


  --secondary-dark:        #0F84B6;
  --secondary:             #30A6D9;
  --secondary-light:       #A3DDF6;
  --secondary-lighter:     #D7F3FF;


  --red:                   #EB0028;
  --red-dark:              #CC0836;
  --red-light:             #FFB4C6;
  --red-lighter:           #FFEBED;

  --green-dark:            #007354;
  --green:                 #30AE8C;
  --green-light:           #95EAD3;
  --green-lighter:         #D3F3EB;

  --orange-dark:           #FF7A00;
  --yellow-dark:           #E29A00;
  --yellow:                #FEB415;
  --yellow-light:          #FFDF9B;
  --yellow-lighter:        #FFF3D8;


  --gray-900:              #212529;
  --gray-800:              #343A40;
  --gray-700:              #495057;
  --gray-600:              #6C757D;
  --gray-500:              #ADB5BD;
  --gray-400:              #CED4DA;
  --gray-300:              #DEE2E6;
  --gray-200:              #E9ECEF;
  --gray-100:              #F8F9FA;
  --white:                 #FFFFFF;
  --black:                 #000000;


  --bg-page:               var(--gray-100);
  --bg-surface:            var(--white);
  --bg-surface-tinted:     var(--primary-lightest);
  --bg-inverse:            var(--feroot-navy);

  --fg-strong:             var(--gray-900);
  --fg-default:            var(--gray-800);
  --fg-muted:              var(--gray-700);
  --fg-subtle:             var(--gray-600);
  --fg-disabled:           var(--gray-500);
  --fg-on-inverse:         var(--white);
  --fg-on-primary:         var(--white);
  --fg-link:               var(--primary);
  --fg-link-hover:         var(--primary-dark);

  --border-default:        var(--gray-300);
  --border-strong:         var(--gray-400);
  --border-subtle:         var(--gray-200);
  --border-focus:          var(--primary);


  --font-display:          "Open Sans", "Helvetica Neue", Arial, sans-serif;
  --font-body:             "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-mono:             "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;


  --text-page-title:       28px;
  --text-page-subtitle:    20px;
  --text-section-title:    24px;
  --text-display-lg:       36px;
  --text-display-xl:       48px;
  --text-body-lg:          16px;
  --text-body:             14px;
  --text-body-sm:          12px;
  --text-mono:             12px;


  --lh-tight:              100%;
  --lh-snug:               1.25;
  --lh-normal:             1.5;
  --lh-relaxed:            1.7;


  --fw-regular:            400;
  --fw-semibold:           600;
  --fw-bold:               700;
  --fw-extrabold:          800;


  --tracking-tight:        -0.011em;
  --tracking-uppercase:    0.04em;


  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  28px;
  --space-8:  32px;
  --space-9:  36px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;


  --radius-sm:     4px;
  --radius-md:     8px;
  --radius-lg:     20px;
  --radius-xl:     30px;
  --radius-pill:   999px;


  --shadow-xs:   0 1px 2px rgba(0,0,0,0.06);
  --shadow-sm:   0 2px 4px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.08);
  --shadow-md:   0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg:   0 12px 32px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.06);

  --shadow-slide-over: -2px 0 8px 0 rgba(0,0,0,0.18);

  --ring-primary: 0 0 0 3px rgba(109, 60, 206, 0.25);


  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);
  --ease-standard:  cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:       120ms;
  --dur-base:       200ms;
  --dur-slow:       320ms;
}#pc-embed {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--fg-default);
  background: var(--bg-page);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
}#pc-embed h1, #pc-embed .h1 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--text-display-lg);
  line-height: var(--lh-tight);
  color: var(--fg-strong);
  letter-spacing: var(--tracking-tight);
  margin: 0;
}#pc-embed h2, #pc-embed .h2 {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--text-section-title);
  line-height: var(--lh-tight);
  color: var(--fg-strong);
  margin: 0;
}#pc-embed h3, #pc-embed .h3 {
  font-family: var(--font-body);
  font-weight: var(--fw-bold);
  font-size: var(--text-page-title);
  line-height: var(--lh-tight);
  color: var(--fg-default);
  margin: 0;
}#pc-embed h4, #pc-embed .h4 {
  font-family: var(--font-body);
  font-weight: var(--fw-bold);
  font-size: var(--text-page-subtitle);
  color: var(--fg-default);
  margin: 0;
}#pc-embed p {
  font-family: var(--font-body);
  font-size: var(--text-body);
  color: var(--fg-muted);
  margin: 0;
}#pc-embed .eyebrow, #pc-embed .session-title {
  font-family: var(--font-body);
  font-size: var(--text-body-sm);
  font-weight: var(--fw-bold);
  color: var(--fg-subtle);
  text-transform: uppercase;
  letter-spacing: var(--tracking-uppercase);
}#pc-embed code, #pc-embed pre, #pc-embed .mono {
  font-family: var(--font-mono);
  font-size: var(--text-mono);
}#pc-embed a {
  color: var(--fg-link);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-standard);
}#pc-embed a:hover { color: var(--fg-link-hover); text-decoration: underline; }
  