.om-trace {
  min-width:0;
  padding-block:28px 8px;
  border-top:1px solid #d4cdb636;
  color:#e9e7dc;
  overflow-wrap:anywhere;
}
.om-trace-heading { margin-bottom:28px; }
.om-trace .om-trace-eyebrow {
  margin:0 0 12px;
  color:#c6a17b;
  font:14px/1.5 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.om-trace h4 {
  margin:0;
  color:inherit;
  font:500 clamp(28px,3.4vw,44px)/1.1 var(--sans);
  letter-spacing:-.035em;
}
.om-trace p { margin:0;max-width:78ch;font:16px/1.65 var(--sans); }
.om-device-stage { position:relative;isolation:isolate;overflow:hidden;padding:214px 28px 28px; }
.om-desktop--front { position:relative;z-index:3; }
.om-rear { position:absolute;top:24px;width:74%;pointer-events:none; }
.om-rear--classification { left:12px;z-index:1;transform:translate3d(calc(var(--depth-x,0) * -16px),calc(var(--depth-y,0) * -10px + var(--depth-scroll,0) * -18px),0) rotate(-3deg); }
.om-rear--running { right:12px;top:104px;z-index:2;transform:translate3d(calc(var(--depth-x,0) * 20px),calc(var(--depth-y,0) * 14px + var(--depth-scroll,0) * 24px),0) rotate(3deg); }
.om-rear iframe { display:block;width:100%;height:480px;border:0;background:#fcfcfc; }
#showcase[data-still] .om-rear--classification { transform:rotate(-3deg); }
#showcase[data-still] .om-rear--running { transform:rotate(3deg); }
@media (prefers-reduced-motion:reduce) {
  .om-rear--classification { transform:rotate(-3deg); }
  .om-rear--running { transform:rotate(3deg); }
}
.om-device-stage figure { margin:0;min-width:0; }
.om-trace .om-device-label { margin:0 0 16px;color:#a8b7ac;font:14px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase; }
.om-desktop-window { overflow:hidden;border:1px solid #9da4a870;border-radius:12px;background:#fcfcfc;box-shadow:0 18px 40px #0003; }
.om-window-bar { display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid #e4e4e7;background:#f4f4f5;color:#71717b;font:500 14px/1.5 "SF Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif; }
.om-window-dots { display:flex;gap:7px; }
.om-window-dots i { width:9px;height:9px;border-radius:50%;background:#ff5f57; }
.om-window-dots i:nth-child(2) { background:#febc2e; }
.om-window-dots i:nth-child(3) { background:#28c840; }
.om-trace-frame { display:block;width:100%;height:720px;border:0;background:#fcfcfc; }
@media (max-width:600px) {
  .om-device-stage { padding:152px 0 20px; }
  .om-rear { width:94%; }
  .om-rear--classification { left:6px; }
  .om-rear--running { right:6px;top:82px; }
  .om-rear .om-window-bar { gap:4px;padding-inline:8px; }
}
.om-trace-full {
  display:block;
  width:fit-content;
  max-width:100%;
  padding:16px 20px;
  color:#d9b58e;
  font:14px/1.5 var(--sans);
  text-decoration:underline;
  text-underline-offset:4px;
}
.om-trace-full:focus-visible { outline:2px solid currentColor;outline-offset:-5px; }
.om-trace-notes { padding-top:20px; }
.om-trace .om-trace-caption { color:#a8b7ac;font-size:14px; }
.om-trace-facts {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px 40px;
  margin:28px 0 0;
  padding:28px 0 0;
  border-top:1px solid #d4cdb636;
}
.om-trace-facts dt { margin:0 0 6px;font:600 16px/1.5 var(--sans); }
.om-trace-facts dd { margin:0;color:#a8b7ac;font:14px/1.65 var(--sans); }
@media (max-width:600px) {
  .om-trace-frame { height:600px; }
  .om-trace-facts { grid-template-columns:minmax(0,1fr);gap:20px; }
}