/* Shared frame for the static mock embeds in work/media.
   The mock skin itself comes from assets/css/approach-mocks.css (same as the case studies).
   Colour tokens are overwritten by inherit-theme.js so each embed tracks its parent page. */
:root{
  --bkgd:#fff; --accent:#f8fff0; --action:#fcf7a7; --border:#baf1a9; --frgd:#3a4237; --shadow:#00000080;
  --font-meta:'Departure Mono',ui-monospace,monospace;
  --text-functional-sm:12px;
}
html,body{margin:0}
body{background:var(--accent);color:var(--frgd);font-family:'Inter',system-ui,sans-serif;padding:6px 4px 10px;-webkit-font-smoothing:antialiased}

/* Embeds get more room than a text column, so the mock type scale steps up. */
.ax-mock{margin:0 auto;max-width:780px;--ax-fs:12.5px;--ax-fs-sm:11.5px;--ax-fs-xs:10px}
.ax-list li{margin:0;padding:0 0 0 20px;position:relative;line-height:1.45}
.ax-meter .fill.ok{background:var(--ax-ok)}
.ax-mock > .ax-row{align-items:stretch}
.ax-bar{min-height:34px;box-sizing:border-box}