.first-journey{max-width:70rem;margin-inline:auto}.first-journey fieldset{border:1px solid var(--border-color,#64748b);border-radius:.7rem;padding:1rem;margin-block:1rem;min-width:0}.first-journey label{display:block;margin-block:.6rem .25rem}.first-journey input,.first-journey textarea,.first-journey select{box-sizing:border-box;width:100%;max-width:100%;padding:.7rem;font:inherit;color:inherit;background:var(--surface-color,#18232d);border:1px solid #94a3b8;border-radius:.4rem}.first-journey button,.first-journey a{display:inline-block;min-height:44px;padding:.65rem;margin:.25rem;overflow-wrap:anywhere}.first-journey button{font:inherit;cursor:pointer}.first-journey button:focus-visible,.first-journey a:focus-visible,.first-journey input:focus-visible,.first-journey textarea:focus-visible,.first-journey select:focus-visible{outline:3px solid #f8cf65;outline-offset:3px}.first-journey table{width:100%;border-collapse:collapse;table-layout:fixed}.first-journey th,.first-journey td{text-align:left;vertical-align:top;padding:.5rem;border-bottom:1px solid #64748b;overflow-wrap:anywhere}.first-journey-notice{border-inline-start:3px solid #f8cf65;padding-inline-start:1rem}.first-journey-step{margin-block:1rem} .first-journey [role=status]{min-height:1.6em}

.first-journey button{border:1px solid #87949e;border-radius:.5rem;background:#27323a;color:#fff}.first-journey button:hover:not(:disabled){background:#364650}.first-journey button:disabled{opacity:.5;cursor:default}.first-journey a{color:#f8cf65}.first-journey li{white-space:pre-wrap;overflow-wrap:anywhere}.first-journey h2{margin-top:1.25rem}

.first-journey a.first-journey-primary {
    background: #f8cf65;
    border-radius: .5rem;
    color: #18232d;
    font-weight: 600;
}

.first-journey a.first-journey-primary:hover {
    text-decoration: underline;
}

/* The example's general button rule must not reveal Studio's phone-only toggle. */
.first-journey .workflow-studio-example .blueprint-studio-outline-toggle { display: none; }
@container blueprint-workspace (max-width: 899.98px) {
    .first-journey .workflow-studio-example .blueprint-studio-outline-toggle { display: flex; }
}

.workflow-loading, .workflow-recovery, .workflow-preview { padding: 1.25rem; border: 1px solid var(--hs-color-border, #64748b); border-radius: .7rem; margin-block: 1rem; }
.workflow-skeleton { height: 12rem; border-radius: .5rem; background: linear-gradient(100deg, #222a30 30%, #303a42 50%, #222a30 70%); background-size: 200% 100%; animation: workflow-loading 2s ease-in-out infinite; }
@keyframes workflow-loading { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .workflow-skeleton { animation: none; } }
.workflow-action-row, .workflow-next-actions { display: flex; flex-wrap: wrap; gap: .5rem; padding-block: .75rem; align-items: center; }
.workflow-action-row { position: sticky; top: calc(max(var(--hs-shell-header-height, 7rem), 7rem) + .5rem); z-index: 2; background: var(--hs-color-bg, #191b1c); }
.first-journey .workflow-primary { background: #f8cf65; color: #18232d; font-weight: 650; }
@media (max-height: 45rem), (max-width: 40rem) { .workflow-action-row { position: static; } }

.first-journey .workflow-primary:hover:not(:disabled) { background: #ffe099; color: #18232d; }