/* Shared typography roles across Start, Setup, Fast Track and both guided paths. */
:root{--type-page:2.375rem;--type-section:1.75rem;--type-card:1.25rem;--type-body:1rem;--type-detail:.875rem;--panel-space:1.5rem}
/* Keep the official wordmark above navigation on tablets and phones. */
@media(max-width:1100px){
 .app{display:block}
 .sidebar{position:static;display:block;width:100%;height:auto;padding:20px 24px 16px;border-right:0;border-bottom:1px solid var(--line)}
 .sidebar .brand{display:block;width:150px;height:81px;margin:0 auto 18px}
 .sidebar .wordmark{display:block;position:relative;width:150px;height:81px;overflow:hidden}
 .sidebar .wordmark img{position:absolute;width:150px;height:150px;left:0;top:-39px;object-fit:contain}
 .sidebar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .sidebar nav .path-button{width:100%;min-width:0;justify-content:center;text-align:center;padding:10px 12px}
 #setup-nav{grid-column:1/-1}
}
@media(max-width:600px){.sidebar{padding:18px 16px 14px}}
.page-heading h1{font:700 var(--type-page)/1.15 var(--display)}
.work-heading h2,.learning-intro h2,.setup-heading h2,.platform-heading h3{font:600 var(--type-section)/1.25 var(--display)}
.route-copy h2,.lesson-body h3,.checkpoint h3,.resource-card h3,.setup-callout h3,.own-assets h3,.setup-purpose-heading h3,.handoff-inner h3,.panel-heading h3{font:600 var(--type-card)/1.4 var(--body)}
.page-heading p,.route-copy p,.learning-intro p,.setup-heading p,.platform-intro,.resource-card p,.destination,.destination strong,.destination p,.platform-guide,.platform-guide summary,.platform-guide li,.setup-callout p,.own-assets p,.lesson-body p,.handoff-inner p,.handoff-inner li,.helper,.asset-note,.after-copy,.empty-fields,#workflow-instruction{font-size:var(--type-body);line-height:1.65}
.field label,.field input,.field select,.field textarea,.setup-copy-preview textarea,.prompt-preview pre,.reference-workflow .prompt-preview pre,#prompt-editor{font:400 var(--type-body)/1.75 var(--body)}
.field label{font-weight:600;line-height:1.5}
.prompt-section-heading{font-size:var(--type-body);line-height:1.6}
.primary-button,.secondary-button,.quiet-button,.preview-controls button,.destination-picker button,.lesson-body button,.lesson-body a,.sidebar nav .path-button{font:600 var(--type-body)/1.4 var(--body);min-height:3rem}
.platform-choice .platform-brand strong,.setup-purpose .platform-choice .platform-brand strong{font:600 var(--type-card)/1.4 var(--body)}
.tool-badge,.edit-status,.resource-status,.lesson-body .pending-label,.handoff-inner .draft-note,.eyebrow{font-size:var(--type-detail);line-height:1.5}
.work-heading .eyebrow,.reference-workflow .work-heading .eyebrow{font:500 var(--type-detail)/1.5 var(--body);letter-spacing:0}
.input-panel,.editor-panel .panel-heading,.work-heading,.handoff-inner{padding:var(--panel-space)}
.prompt-preview pre,#prompt-editor{padding:var(--panel-space)}
.step-strip,.reference-workflow .step-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;padding:.75rem}
.step-button,.reference-workflow .step-button{font:500 var(--type-body)/1.4 var(--body);min-height:4rem;padding:.65rem .5rem;overflow-wrap:anywhere}
.step-button span{display:block;font:500 var(--type-detail)/1.5 var(--mono);margin:0 0 .25rem}
.flow-footer{align-items:stretch}.flow-footer button{min-width:0;max-width:100%}
/* Workflow navigation stays secondary to the single Copy Prompt action. */
.flow-footer #previous,.flow-footer #next{background:transparent;color:#c6d1d8;border:1px solid #4b5d69;box-shadow:none;font-weight:500}
.flow-footer #previous{border-color:transparent;color:#aebbc4;text-decoration:underline;text-decoration-color:#53636d;text-underline-offset:.25rem}
.flow-footer #next{background:#18242d}
.flow-footer #previous:hover,.flow-footer #next:hover{background:#22313b;border-color:#71828e;color:#f1f5f7}
.flow-footer #previous:focus-visible,.flow-footer #next:focus-visible{outline-color:var(--lime)}
.step-purpose{margin:var(--panel-space);padding:var(--panel-space);background:#111d21;border-color:#46606b;background-image:none}
.step-purpose>h3{font:600 var(--type-card)/1.4 var(--body);margin:0 0 1.25rem;color:#edf4f7}
.purpose-track{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;padding:0;margin:0}
.purpose-node{position:relative;min-width:0;display:flex;align-items:flex-start;gap:.75rem;padding:1rem;border:1px solid #536571;border-radius:.5rem;background:#1b2b35}
.purpose-node:not(:last-child)::after{content:'';position:absolute;width:1.25rem;height:2px;background:#738a96;top:1.9rem;left:100%}
.purpose-number{flex-shrink:0;display:grid;place-items:center;width:1.65rem;height:1.65rem;border:1px solid #7d96a5;border-radius:50%;font:600 var(--type-detail)/1 var(--body);color:#d3e2e9}
.purpose-content{min-width:0}.purpose-node h4{font:600 var(--type-body)/1.5 var(--body);margin:0 0 .75rem;overflow-wrap:anywhere}
.purpose-tags{display:flex;flex-wrap:wrap;gap:.375rem;list-style:none;margin:0;padding:0}
.purpose-tags li{font:400 var(--type-detail)/1.5 var(--body);padding:.25rem .5rem;background:#0b1821;border-radius:.25rem;color:#d3dfe6;overflow-wrap:anywhere;max-width:100%}
.purpose-result{background:#203723;border-color:#80bd62}.purpose-result .purpose-number{background:#7cff3d;border-color:#7cff3d;color:#14200b}.purpose-result .purpose-tags li{background:#142718;color:#d7eccc}
@media(min-width:1200px){.step-strip{grid-template-columns:repeat(6,minmax(0,1fr))}.reference-workflow .step-strip{grid-template-columns:repeat(4,minmax(0,1fr))}.footage-workflow .step-strip{grid-template-columns:repeat(5,minmax(0,1fr))}}
.footage-workflow .prompt-only{grid-template-columns:minmax(0,1fr)}
.footage-workflow .prompt-only .editor-panel{grid-column:1/-1}
.footage-workflow .custom-objective{margin-top:14px}
.idea-workflow .step-strip{grid-template-columns:repeat(5,minmax(0,1fr))}
.idea-workflow .step-button{font-size:16px;overflow-wrap:anywhere}
.idea-workflow .idea-source-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.idea-source-options button[hidden]{display:none}
@media(max-width:850px){.idea-workflow .step-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.idea-workflow .idea-source-options{grid-template-columns:1fr}}
@media(max-width:1050px){.purpose-track{grid-template-columns:1fr;gap:1rem}.purpose-node:not(:last-child)::after{width:2px;height:1rem;top:100%;left:1.8rem}.purpose-node{padding:.875rem 1rem}.purpose-node h4{margin-bottom:.5rem}}
@media(max-width:600px){:root{--type-page:2rem;--type-section:1.625rem;--panel-space:1.125rem}.step-strip,.reference-workflow .step-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.step-purpose>h3{margin-bottom:1rem}.flow-footer button{flex:1}.platform-choice .platform-brand strong,.setup-purpose .platform-choice .platform-brand strong{font-size:var(--type-body)}.tool-badge{white-space:normal}.destination-picker>div[role=group]{grid-template-columns:1fr 1fr}}

/* Functional zones: navigate / choose / understand / fill / copy / continue. */
#vault-view .workflow-nav-label{margin:0;padding:16px 18px 0;background:#151a2b;color:#cbbfff;font:700 .875rem/1.5 var(--body);letter-spacing:.04em;display:flex;gap:16px;flex-wrap:wrap}
#vault-view .workflow-nav-label span{color:#afb8d2;font-weight:400;letter-spacing:0}
#vault-view .workflow-nav-label[hidden]{display:none}
#vault-view .step-strip{background:#151a2b;border-bottom:2px solid #605786;padding:12px 16px 16px}
#vault-view .step-button{background:#232a40;border:1px solid #65718d;color:#e3e8fa;min-height:62px;border-radius:8px}
#vault-view .step-button>span{color:#b1bad5}
#vault-view .step-button:hover{background:#343e58;border-color:#c2b8ed}
#vault-view .step-button.active{background:#ded8ff;border-color:#e6e1ff;color:#282140;box-shadow:inset 0 -3px #9380d5}
#vault-view .step-button.active>span{color:#4f407c}
#vault-view .work-heading{background:#111a23;border:0;padding-bottom:14px}
#vault-view #workflow-instruction{background:#111a23;padding-top:0;padding-bottom:18px;color:#c4d2dd}
#vault-view .destination-picker{background:#f6e6cf;border:1px solid #bba27e;border-left:4px solid #c69050;border-radius:10px;color:#332b24;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:16px;align-items:center;margin:20px 24px;padding:18px}
#vault-view .destination-picker[hidden]{display:none}
#vault-view .destination-picker .action-label{display:block;color:#73501f;font:700 .875rem/1.5 var(--body);margin:0 0 4px}
#vault-view .destination-picker>div:first-child p{font-size:1rem;line-height:1.5;margin:0;color:#5c4b35}
#vault-view .destination-picker>div[role=group]{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#vault-view .destination-picker button{background:#fffaf2;border:1px solid #998164;color:#403324;border-radius:7px;font-size:1rem;min-width:0;padding:12px 10px;flex-wrap:wrap}
#vault-view .destination-picker button[aria-pressed=true]{background:#343048;color:#fff;border-color:#343048;box-shadow:inset 0 -3px #baabed}
#vault-view .destination-picker button:focus-visible{outline-color:#5a369e;outline-offset:3px}
#vault-view .destination-picker button[aria-pressed=false]:hover{background:#ffefd5;border-color:#65471e}
#vault-view .idea-source-picker{border-top:3px solid #b7a2ea}
#vault-view .idea-code-choice{background:#2b273b;padding:12px;border:1px solid #75628c;border-radius:8px;margin-top:14px}
#vault-view .idea-code-choice>span{color:#ddd2f5;font-size:.875rem;font-weight:700}
#vault-view .step-purpose{background:#101d25;border:0;border-left:3px solid #6ea8bf;border-radius:0 8px 8px 0;padding:14px 18px;margin:20px 24px}
#vault-view .purpose-caption{color:#9eb9c6;font:500 .875rem/1.4 var(--body);margin:0 0 5px}
#vault-view .step-purpose>h3{font:600 1rem/1.5 var(--body);margin:0 0 12px}
#vault-view .purpose-track{gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}
#vault-view .purpose-node{background:none;border:0;border-radius:0;padding:0;gap:10px;align-items:center}
#vault-view .purpose-node:not(:last-child)::after{content:'›';width:auto;height:auto;left:calc(100% + 6px);top:50%;transform:translateY(-50%);background:none;color:#7895a4;font:24px/1 var(--body)}
#vault-view .purpose-icon{width:30px;height:30px;border:0;background:none;color:#abd4e5;border-radius:0}
#vault-view .purpose-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#vault-view .purpose-node h4{font:600 1rem/1.4 var(--body);margin:0 0 3px;color:#e6f0f5}
#vault-view .purpose-tags{gap:0 5px;display:block;line-height:1.4}
#vault-view .purpose-tags li{display:inline;background:none;color:#a9bec9;padding:0;border-radius:0;font:400 .875rem/1.5 var(--body)}
#vault-view .purpose-tags li:not(:last-child)::after{content:' · ';color:#76929e}
#vault-view .purpose-result .purpose-icon{color:#bce99d}
#vault-view .prompt-grid{gap:16px;padding:20px;background:#0a111a;border-top:1px solid #3c5061;align-items:start}
#vault-view .prompt-grid.prompt-only{grid-template-columns:minmax(0,1fr)}
#vault-view .input-panel{background:#e8f0fa;color:#1b3554;border:1px solid #adbed4;border-top:4px solid #729ed5;border-radius:10px;padding:22px;min-width:0}
#vault-view .workspace-zone-label{font:700 .875rem/1.5 var(--body);letter-spacing:.05em;color:#385d89;margin:0 0 7px}
#vault-view .input-panel .panel-heading{padding:0;flex-wrap:wrap}
#vault-view .input-panel h3{color:#17365a}
#vault-view .input-panel .panel-heading>span{color:#4a6483;font-size:.875rem}
#vault-view .input-panel .helper,#vault-view .input-panel .asset-note,#vault-view .input-panel .asset-note strong,#vault-view .input-panel .empty-fields{color:#425b75}
#vault-view .input-panel .field label{color:#243e5b}
#vault-view .input-panel input,#vault-view .input-panel select,#vault-view .input-panel textarea{background:#fff;color:#1a3552;border-color:#8098b3;box-shadow:0 1px 2px #263e5710}
#vault-view .input-panel input::placeholder,#vault-view .input-panel textarea::placeholder{color:#59718b;opacity:1}
#vault-view .input-panel input:focus-visible,#vault-view .input-panel select:focus-visible,#vault-view .input-panel textarea:focus-visible{outline:2px solid #3263a2;outline-offset:2px}
#vault-view .input-panel .asset-note{border-color:#6e91bd}
#vault-view .editor-panel{border:1px solid #527365;border-top:4px solid #b0d88f;border-radius:10px;overflow:hidden;background:#0c151a;align-self:stretch}
#vault-view .editor-panel>.panel-heading{background:#213b31;color:#edf9e5;gap:12px;justify-content:flex-start}
#vault-view .editor-panel>.panel-heading::before{content:'⧉';font:26px/1 var(--body);color:#c5e9ae}
#vault-view .editor-panel>.panel-heading h3{color:#edf9e5}
#vault-view .edit-status{font-size:.875rem;padding:10px 20px}
#vault-view .editor-footer{background:#152b22;border-top:1px solid #456251;padding:16px 20px;margin-top:auto}
#vault-view .editor-actions #reset{background:transparent;border-color:#718b7a;color:#d0e1d8}
#vault-view .editor-actions #copy{background:#b9f18d;border-color:#c9f5ac;color:#193211;font-weight:700}
#vault-view .after-copy{padding:16px 20px;background:#152b22;color:#c9ddcd;border-top:1px solid #365443}
#vault-view .flow-footer{background:#1e1b2b;border:1px solid #5f526f;border-radius:10px;padding:16px;margin-top:12px;flex-wrap:wrap}
#vault-view .flow-footer>span{display:block;font-size:.875rem;line-height:1.5;color:#cabfdb;min-width:0}
#vault-view .flow-footer #next{background:#393147;border-color:#9c87b4;color:#f3ebff}
#vault-view .flow-footer #previous{color:#cdc4d6}
@media(max-width:1050px){#vault-view .prompt-grid{grid-template-columns:1fr}#vault-view .purpose-track{grid-template-columns:1fr;gap:10px}#vault-view .purpose-node:not(:last-child)::after{display:none}#vault-view .purpose-content{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}#vault-view .purpose-node h4{margin:0}#vault-view .destination-picker{grid-template-columns:1fr}}
@media(max-width:600px){#vault-view .workflow-nav-label{gap:3px;padding:14px 12px 0}#vault-view .workflow-nav-label span{flex-basis:100%}#vault-view .step-strip{padding:12px}#vault-view .destination-picker,#vault-view .step-purpose{margin:14px}#vault-view .destination-picker{padding:14px}#vault-view .purpose-content{display:block}#vault-view .purpose-track{gap:12px}#vault-view .purpose-node h4{font-size:1rem}#vault-view .prompt-grid{padding:12px;display:grid;gap:18px}#vault-view .input-panel{padding:18px 14px}#vault-view .editor-panel>.panel-heading{padding:18px 14px}#vault-view .editor-actions{display:flex;flex-wrap:wrap}#vault-view .editor-actions button{flex:1;min-width:90px}#vault-view .editor-footer,#vault-view .after-copy{padding:14px}#vault-view .flow-footer>span{order:3;flex-basis:100%}}