


:root{
  --cp103-magenta:      #ec1866;
  --cp103-magenta-lt:   #ff2d8a;
  --cp103-magenta-dp:   #b70d4e;
  --cp103-plum:         #4a1234;
  --cp103-plum-dk:      #2b0f22;
  --cp103-plum-lt:      #6b1442;

  
  --cp103-pill: linear-gradient(100deg,
                  var(--cp103-magenta-dp) 0%,
                  var(--cp103-magenta) 55%,
                  var(--cp103-magenta-lt) 100%);

  --cp103-band: linear-gradient(135deg,
                  var(--cp103-plum-dk) 0%,
                  var(--cp103-plum) 46%,
                  var(--cp103-plum-lt) 100%);

  
  --cp103-band-glow: radial-gradient(120% 140% at 88% 8%,
                       rgba(236,24,102,.34) 0%, rgba(236,24,102,0) 58%);

  --cp103-type: "Poppins", Arial, Helvetica, sans-serif;
}


#main h2,
#main h3,
#main .eyebrow,
#main .btn,
.cp103-band h2{
  font-family: var(--cp103-type);
}

#main h2{
  font-weight: 800;
  letter-spacing: -.022em;
  line-height: 1.16;              
  margin-bottom: 12px;
}

#main h3{
  font-weight: 700;
  letter-spacing: -.012em;
}


#main .eyebrow{
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--cp103-magenta-lt);
  margin-bottom: 10px;
}


#main p strong,
#main p b,
#main .lead strong,
#main .lead b{
  color: var(--ink);
  font-weight: 700;
}


#main .btn{
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: .01em;
}

#main .btn:not(.ghost):not(.glass){
  background: var(--cp103-pill);
  border-color: transparent;
}

#main .btn:not(.ghost):not(.glass):hover{
  filter: brightness(1.08);
  box-shadow: 0 8px 24px -8px rgba(236,24,102,.65);
}


#main .glass{
  position: relative;
  overflow: hidden;
}

#main .glass::after{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--cp103-pill);
  opacity: .9;
  pointer-events: none;
}


#main .grid > .glass:nth-child(3n+1)::after{
  background: linear-gradient(100deg,#f5a623,var(--cp103-magenta));
}
#main .grid > .glass:nth-child(3n+3)::after{
  background: linear-gradient(100deg,#8b5cf6,var(--cp103-magenta-lt));
}


.cp103-band{
  position: relative;
  border-radius: var(--r-lg,16px);
  padding: 26px 28px 22px;
  margin: 30px 0 20px;
  background: var(--cp103-band), var(--cp103-plum-dk);
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
}

.cp103-band::before{
  content: "";
  position: absolute;
  inset: 0;
  background: var(--cp103-band-glow);
  pointer-events: none;
}


.cp103-band::after{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--cp103-pill);
}

.cp103-band > *{ position: relative; }
.cp103-band > *:last-child{ margin-bottom: 0; }


.cp103-band + .grid > .glass::after{ opacity: .55; }


#cp103Theme{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 15px;
  line-height: 1;
  background: var(--panel);
  border: 1px solid var(--brd);
  color: var(--ink);
  transition: background .18s var(--ease,ease), border-color .18s var(--ease,ease);
}
#cp103Theme:hover{
  background: var(--cp103-pill);
  border-color: transparent;
  color: #fff;
}
#cp103Theme:focus-visible{
  outline: 2px solid var(--cp103-magenta-lt);
  outline-offset: 2px;
}


html.cp103-light{
  
  --bg:       #ffffff;
  --bg-2:     #f7f4f8;
  --panel:    #ffffff;
  --panel-2:  #faf7fb;
  --ink:      #1a1020;
  --muted:    #4d4655;
  --faint:    #6b7280;
  --brd:      rgba(26,16,32,.14);
  --brd-2:    rgba(236,24,102,.34);
  --line:     rgba(26,16,32,.10);
  --wash:     rgba(236,24,102,.07);

  
  --berry:     #ee0c5d;
  --berry-2:   #d10a52;
  --berry-dk:  #b70d4e;
  --berry-deep:#8d0a3c;
  --green:     #007040;
  --green-bg:  #eaf7ef;
  --amber:     #7a5500;
  --amber-bg:  #fdf3e3;
  --cyan:      #0e6f79;
  --purple:    #741984;
  --violet:    #6d28d9;
  --violet-2:  #7c3aed;
  --violet-dk: #5b21b6;
  --blue:      #1d4ed8;
  --blue-bg:   #eaf0fe;
}

html.cp103-light body{
  background: #ffffff;
  color: var(--ink);
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .glass{
  background: #ffffff;
  border-color: rgba(26,16,32,.13);
  box-shadow: 0 2px 10px -4px rgba(26,16,32,.16);
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .eyebrow{
  color: var(--cp103-magenta-dp);
}



html.cp103-light header.top,
html.cp103-light #navwrap,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) th,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .ic,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-thumb,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-play,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-dur,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-play,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vthumb,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vnum,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vplay,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vdur,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .pillicon,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .catchip.on,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .insight-sysbar,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .exec-banner,
html.cp103-light .cp103-band{
  --ink:    #ffffff;
  --muted:  rgba(255,255,255,.86);
  --faint:  rgba(255,255,255,.66);
  --brd:    rgba(255,255,255,.14);
  --brd-2:  rgba(236,24,102,.42);
  --line:   rgba(255,255,255,.09);
  --panel:  rgba(255,255,255,.05);
  --panel-2:rgba(255,255,255,.03);

  
  --berry:     #ec1866;
  --berry-2:   #ff2d8a;
  --berry-dk:  #ff6aa6;
  --green:     #4ade9a;
  --amber:     #ffcf80;
  --cyan:      #22c3d1;
  --violet:    #a78bfa;
  --blue:      #8ab4ff;
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band .eyebrow{
  color: var(--cp103-magenta-lt);
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .btn.ghost{
  color: var(--ink);
  background: #ffffff;
  border-color: rgba(26,16,32,.22);
}
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .btn.ghost:hover{
  background: var(--panel-2);
  border-color: rgba(26,16,32,.34);
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .btn.ghost.ds-watch{
  color: var(--cp103-magenta-dp);
  background: rgba(236,24,102,.07);
  border-color: rgba(236,24,102,.40);
}
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .btn.ghost.ds-watch:hover{
  background: rgba(236,24,102,.13);
}




html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-vid,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-card{
  background: #ffffff;
  border: 1px solid rgba(26,16,32,.13);
}
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-vt,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-t,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-t{ color: var(--ink); }

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-vs,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-dur,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-views,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-folder,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-s,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-n,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-file,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-need,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-note,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-s,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-by,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-sr,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-source,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .sk,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .yt-none{ color: var(--muted); }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-src.cp97-sp{ color:#4c1d95; background:rgba(120,90,247,.12); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-src.cp97-yt{ color:var(--berry-dk); background:rgba(236,24,102,.10); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-free,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .yt-pill.yt-yes{ color:var(--green); background:var(--green-bg); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .yt-pill.yt-public{ color:var(--berry-dk); background:rgba(236,24,102,.10); }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .status-pill.ok,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .li-status.li-ok,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .yes{ color: var(--green); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cat,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .rl,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .catchip:not(.on){ color: var(--cyan); }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .callout.yt-gap,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) code{ color: var(--amber); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp-flow-k,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp-tag.tg-app{ color:#b91c1c; }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band .btn.ghost{
  color: #ffffff;
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.22);
}
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band .btn.ghost:hover{
  background: rgba(255,255,255,.13);
}

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band a{ color: var(--cp103-magenta-lt); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band .cp-tag,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band .cp-flow-k{ color:#ff9d9d; }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .insight-sysbar,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .insight-sysbar .sk{ color: rgba(255,255,255,.8); }



html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) h2,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) h3,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .chart-card h3,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-t,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) b{ color: var(--ink); }

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band h2,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band h3,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp103-band b{ color: #ffffff; }

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp97-card a,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-vid a{ color: var(--berry-dk); }

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .status-pill.verify{ color: var(--amber); }



html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-ic{ color:#4a3200; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-s,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head-n{ color:#3a3442; }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head .cp-tag{
  background: #ffffff;
  border-color: rgba(26,16,32,.14);
}
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head .cp-tag.tg-agt{ color:#00563a; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head .cp-tag.tg-emp{ color:#173da8; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp84-head .cp-tag.tg-app{ color:#8f1212; }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) table a{ color: var(--berry-dk); }


html.cp103-light .navband-ic,
html.cp103-light .navband-n{ color:#ff9d9d; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp-tag.tg-emp{ color: var(--blue); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp-tag.tg-agt{ color: var(--green); }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cp-tag.tg-app{ color:#b91c1c; }

html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vtag.trend{ color:#007040; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vtag.good{ color:#1d4ed8; }


html.cp103-light .v70-brief .btn.ghost,
html.cp103-light .btn.ghost.v70-briefbtn{
  color: var(--ink);
  background: #ffffff;
  border-color: rgba(26,16,32,.22);
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .btn.btn-watch{
  color: #ffffff;
  background: var(--cp103-pill);
  border-color: transparent;
}




html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .vtag.neutral{ color:#1a1020; }
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .li-wrap th{ color:#1a1020; }


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .catchip.on{
  background: var(--cp103-pill);
  border-color: transparent;
  color: #ffffff;
}


html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .catchip:not(.on),
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .cat,
html.cp103-light :is(#main,#cpBriefModal,#glossaryModal,#syncModal) .rl{ color: var(--ink) !important; }


html.cp103-light #glossaryModal .gcard,
html.cp103-light #syncModal .gcard{
  background: #ffffff;
  border: 1px solid rgba(26,16,32,.14);
  box-shadow: 0 18px 48px -14px rgba(26,16,32,.30);
}


html.cp103-light #glossaryModal,
html.cp103-light #syncModal{
  background: rgba(26,16,32,.42);
}


html.cp103-light #glossaryModal .ghead,
html.cp103-light #syncModal .ghead{
  --ink:   #ffffff;
  --muted: rgba(255,255,255,.86);
  --faint: rgba(255,255,255,.7);
}
html.cp103-light #glossaryModal .ghead h3,
html.cp103-light #syncModal .ghead h3{ color:#ffffff; }


html.cp103-light #glossaryModal .gl,
html.cp103-light #syncModal .gl{ color: var(--cp103-magenta-dp); }

@media (prefers-reduced-motion:reduce){
  #cp103Theme{ transition: none; }
}
