/* Panel structure follows the supplied September 21 macOS recording. */
.motion-landing .decision-float { top: 203px; }
.motion-landing .decision-panel.glass-panel {
  padding: 16px; border: 1px solid #d2d8da; border-radius: 25px;
  color: #24343f; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: radial-gradient(ellipse at 0 100%, #d9eff8a6, transparent 55%), radial-gradient(ellipse at 100% 100%, #f5efd9a1, transparent 50%), #f8f9f9f5;
  box-shadow: 0 24px 45px -21px #27314052, inset 0 1px 1px #fff;
}
.motion-landing .decision-bar {
  height: 32px; padding: 0; gap: 6px; background: transparent; color: inherit;
  font-family: inherit; font-size: 17px; font-weight: 700; letter-spacing: -.5px;
}
.motion-landing .decision-bar img { width: 17px; height: 21px; }
.motion-landing .panel-status { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 9px; font-weight: 600; color: #657078; letter-spacing: 0; }
.motion-landing .panel-status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #008cef; }
.motion-landing .panel-tools { display: flex; gap: 6px; margin-left: 3px; }
.motion-landing .panel-tool { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid #fff; border-radius: 50%; }
.motion-landing .panel-tool svg, .motion-landing .panel-detail svg, .motion-landing .panel-footer svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.motion-landing .panel-detail-row { display: flex; justify-content: flex-end; margin-top: 9px; }
.motion-landing .panel-detail { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border: 1px solid #fff; border-radius: 20px; font-size: 10px; font-weight: 600; }
.motion-landing .panel-summary { margin: 13px 0 14px; font-size: 13px; line-height: 1.35; font-weight: 650; letter-spacing: -.2px; }
.motion-landing .decision-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: 134px; gap: 10px; max-height: none; padding: 0; overflow: visible; }
.motion-landing .decision-option {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  min-height: 134px; padding: 13px 12px; border: 1px solid #fff; border-radius: 20px;
  background: #ffffff24; color: #24343f; transform: none;
}
.motion-landing .decision-option:first-child { background: #e8f5fb9c; }
.motion-landing .decision-option > span { font-size: 14px; font-weight: 650; line-height: 1.25; }
.motion-landing .decision-option small { align-self: flex-start; max-width: none; padding: 3px 7px; border: 1px solid #bad4e1; border-radius: 20px; font-family: inherit; font-size: 8px; font-weight: 600; color: #4e7d95; text-transform: none; letter-spacing: 0; }
.motion-landing .decision-option kbd { align-self: flex-end; width: 30px; height: 23px; margin-top: auto; border: 0; border-radius: 20px; background: #34424a0b; box-shadow: none; font-family: inherit; color: inherit; font-size: 12px; font-weight: 500; }
.motion-landing .decision-option:hover, .motion-landing .decision-option:focus-visible, .motion-landing .decision-option.is-selected { background: #dceff8; border-color: #b6d4e5; color: #24343f; transform: none; }
.motion-landing .decision-option:focus-visible { outline: 2px solid #2875a3; outline-offset: 3px; }
.motion-landing .panel-footer { display: flex; gap: 6px; margin-top: 17px; }
.motion-landing .panel-footer > span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border: 1px solid #fff; border-radius: 20px; font-size: 10px; font-weight: 600; white-space: nowrap; }
.motion-landing .panel-footer > span:last-child { color: #929b9f; }
.motion-landing .product-demo[data-demo-state="sending"] .decision-option { opacity: .4; cursor: default; }
.motion-landing .product-demo[data-demo-state="sending"] .panel-status::before { width: 7px; height: 7px; background: none; border: 1.5px solid #c6d8e2; border-top-color: #008cef; animation: panel-send-spin .8s linear infinite; }
.motion-landing .product-demo[data-demo-state="working"] .decision-float,
.motion-landing .product-demo[data-demo-state="completed"] .decision-float,
.motion-landing .product-demo[data-demo-state="continued"] .decision-float { opacity: 0 !important; visibility: hidden !important; pointer-events: none; }
.motion-landing .product-demo[data-demo-state="sending"] .decision-options { opacity: 1; }
@keyframes panel-send-spin { to { transform: rotate(360deg); } }
@media (max-width: 1100px) and (min-width: 901px) { .motion-landing .decision-float { top: 205px; } }
@media (max-width: 760px) {
  .motion-landing .decision-float { top: auto; min-height: 332px; }
  .motion-landing .decision-panel.glass-panel { padding: 14px; border-radius: 23px; }
  .motion-landing .decision-bar { font-size: 16px; }
  .motion-landing .panel-tools { gap: 4px; }
  .motion-landing .panel-tool { width: 25px; height: 25px; }
  .motion-landing .panel-status { font-size: 8px; gap: 4px; }
  .motion-landing .panel-summary { font-size: 12px; }
  .motion-landing .decision-options { grid-template-rows: 126px; gap: 8px; }
  .motion-landing .decision-option { min-height: 126px; padding: 11px; }
  .motion-landing .decision-option > span { font-size: 13px; }
  .motion-landing .decision-option small { font-size: 8px; max-width: none; }
  .motion-landing .panel-footer { gap: 5px; }
  .motion-landing .panel-footer > span { padding: 5px 7px; font-size: 9px; }
}