:root{--app-header-offset:4rem}
html.page-mode-embedded{--app-header-offset:0rem}
html.page-mode-standalone .em-page{padding-block-start:var(--app-header-offset)}
/* Fixed and above the shared header (z-index 1000..100001) so a focused skip link is never obscured (WCAG 2.4.11). */
.workflow-skip{position:fixed;inset-inline-start:1rem;inset-block-start:-6rem;z-index:100002;padding:.75rem;background:var(--em-panel);color:var(--em-text);border:.125rem solid var(--em-focus)}
.workflow-skip:focus{inset-block-start:1rem}
.workflow-heading{display:flex;flex-wrap:wrap;align-items:start;justify-content:space-between;gap:1rem}
.workflow-heading h1{margin-block:0 .75rem}
.workflow-preference{width:9rem}
.workflow-context{max-width:35rem;margin-block:1.5rem}
.workflow-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr))}
.workflow-form{display:grid;gap:1rem}
.workflow-status{min-height:3rem;margin-block:1.25rem}
.workflow-status[data-state="error"]{border-inline-start-color:var(--em-focus)}
.workflow-list{display:grid;gap:.75rem;padding-inline-start:1.25rem}
.workflow-media-card{display:grid;gap:1rem;align-content:start}
.workflow-media-card img{width:100%;height:12rem;object-fit:cover;border-radius:.5rem;background:var(--em-tint)}
.workflow-media-card h2,.workflow-media-card h3{font-size:1.25rem;margin:0}
.workflow-media-card button{justify-self:start}
.workflow-actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.workflow-prose{max-width:70ch}
.workflow-form textarea{min-height:10rem}
.workflow-message{white-space:pre-wrap;overflow-wrap:anywhere}
.workflow-footer{margin-block-start:2rem}
.workflow-page .em-toolbar>a,.workflow-footer>a{display:inline-flex;align-items:center;min-width:2.75rem;min-height:2.75rem;padding:.25rem .5rem}
.workflow-page [hidden]{display:none!important}
@media(max-width:30rem){.workflow-heading{display:block}.workflow-preference{width:100%;margin-block:1rem}}

/* Ticket received (DS3 UX-04): visible, focused, success tone from em-tokens. */
.workflow-confirmation{border:.125rem solid var(--em-leaf-line);background:var(--em-leaf-wash);margin-block:1rem 1.25rem;display:grid;gap:.75rem}
.workflow-confirmation h2{margin:0;color:var(--em-leaf-ink);font-size:1.375rem}
.workflow-confirmation:focus{outline:.1875rem solid var(--em-focus);outline-offset:.25rem}