.scx-note {
  background: radial-gradient(circle at 100% 0, rgba(55, 221, 181, .11), transparent 34%), linear-gradient(145deg, rgba(15, 30, 43, .97), rgba(9, 20, 31, .98));
  border: 1px solid rgba(92, 221, 190, .22);
  border-radius: 18px;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .18);
  color: #dce9f1;
  margin: 26px 0;
  overflow: hidden;
  padding: 28px;
  position: relative;
}
.scx-note::before { background: linear-gradient(90deg, #35d6ae, #4c8dff, transparent 85%); content: ""; height: 2px; inset: 0 0 auto; position: absolute; }
.scx-note__head { align-items: flex-start; display: flex; gap: 20px; justify-content: space-between; }
.scx-note__eyebrow { color: #71e7c7; font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.scx-note__eyebrow i { background: #42ddb7; border-radius: 50%; box-shadow: 0 0 0 5px rgba(66, 221, 183, .1); display: inline-block; height: 7px; margin-right: 8px; width: 7px; }
.scx-note h2 { color: #fff; font-size: clamp(21px, 2.3vw, 29px); letter-spacing: -.025em; margin: 8px 0 0; }
.scx-note__confidence { background: rgba(76, 141, 255, .11); border: 1px solid rgba(112, 161, 255, .27); border-radius: 999px; color: #a9c8ff; flex: 0 0 auto; font-size: 12px; font-weight: 750; padding: 7px 11px; }
.scx-note__summary { border-left: 2px solid #35d6ae; color: #b9cad5; font-size: 15px; line-height: 1.75; margin: 22px 0; padding-left: 16px; }
.scx-note__grid { display: grid; gap: 1px; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; }
.scx-note__grid article { background: rgba(255, 255, 255, .035); min-width: 0; padding: 19px; }
.scx-note__grid article > span { color: #5f7890; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.scx-note__grid h3 { color: #f6fbff; font-size: 15px; margin: 7px 0 8px; }
.scx-note__grid p { color: #9fb2c0; font-size: 13px; line-height: 1.65; margin: 0; }
.scx-note footer { align-items: center; color: #71899a; display: flex; font-size: 11px; gap: 16px; justify-content: space-between; margin-top: 18px; }
@media (max-width: 680px) {
  .scx-note { border-radius: 14px; padding: 22px 18px; }
  .scx-note__head { display: block; }
  .scx-note__confidence { display: inline-flex; margin-top: 12px; }
  .scx-note__grid { grid-template-columns: 1fr; }
  .scx-note footer { align-items: flex-start; flex-direction: column; gap: 5px; }
}