/* Transitions.dev Reasoning stream: free recipe adapted to the illustrative research plan. */
.agent-reason-example {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: 32px;
  margin-top: 18px;
  padding: 26px;
  border: 1px solid #ffffff08;
  border-radius: 24px;
  background: #19191b;
}
.agent-reason-copy h3 { margin: 8px 0; color: #f5f5f6; font-size: 18px; font-weight: 500; letter-spacing: -.035em; }
.agent-reason-copy p { margin: 0; color: #b8b8bf; font-size: 13px; line-height: 1.6; }
.reason-expand { min-height: 44px; margin-top: 8px; padding: 0 2px; border: 0; border-radius: 4px; background: transparent; color: #e8e8eb; font: inherit; font-size: 12px; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.reason-expand[hidden] { display: none; }
.reason-expand:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.t-reason {
  --reason-hold: 840ms;
  --reason-step: 500ms;
  --reason-lines: 2;
  --reason-fade: 28px;
  --reason-ease: cubic-bezier(.22, 1, .36, 1);
  position: relative;
  min-width: 0;
  overflow: hidden;
}
.t-reason-text { padding: 28px 0; color: #dcdce1; font: 12px / 20px ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.t-reason-text p { margin: 0; }
.t-reason:not([data-reason-layout="loop"]) [data-reason-clone] { display: none; }
.t-reason[data-reason-layout="loop"] { height: 148px; }
.t-reason[data-reason-layout="loop"] .t-reason-viewport {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent 0, black var(--reason-fade), black calc(100% - var(--reason-fade)), transparent 100%);
  mask-image: linear-gradient(transparent 0, black var(--reason-fade), black calc(100% - var(--reason-fade)), transparent 100%);
}
.t-reason[data-reason-layout="loop"] .t-reason-scroll { position: absolute; left: 0; right: 0; transform: translateY(0); }
.t-reason[data-reason-state="playing"] .t-reason-scroll { will-change: transform; }
@media (max-width: 600px) {
  .agent-reason-example { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 24px 22px; border-radius: 22px; }
}
@media (prefers-reduced-motion: reduce), (forced-colors: active), print {
  .t-reason[data-reason-layout] { height: auto; }
  .t-reason[data-reason-layout] .t-reason-viewport { position: relative; -webkit-mask-image: none; mask-image: none; }
  .t-reason[data-reason-layout] .t-reason-scroll { position: relative; transition: none !important; transform: none !important; will-change: auto; }
  [data-reason-clone] { display: none !important; }
  .reason-expand { display: none; }
}
@media print {
  .agent-reason-example { background: #fff; border-color: #999; }
  .agent-reason-example .bento-eyebrow, .agent-reason-copy h3, .agent-reason-copy p, .t-reason-text { color: #000; }
}
