/* Claude Cloud edition: distinct navigation, input and output surfaces. */
:root{--cloud-ink:#18384b;--cloud-muted:#526879;--cloud-border:#cbd9e1;--cloud-blue:#08668a;--cloud-green:#216648}
body,.page{background:#f6f8fa;color:var(--cloud-ink)}
.sidebar{background:#e5eef3;border-right:1px solid #b9cdd9}
.sidebar .vault-nav :is(.path-button,#start-nav,#path-fast,#path-reference){color:#294d63!important;opacity:1;background:transparent}
.sidebar .vault-nav .path-button.active{color:#fff!important;background:#075d80!important;border-color:#075d80!important}
.sidebar .vault-nav .path-button:hover{background:#d2e3ec!important;color:#123f58!important}
.sidebar .vault-nav .path-button.active:hover{background:#064d69!important;color:#fff!important}
.sidebar .vault-nav .nav-group-title{color:#4c6a7e}
.sidebar .vault-nav .path-button small{color:#506b7c}
.sidebar .vault-nav .path-button.active small{color:#e8f5fa}
.sidebar .brand{margin-bottom:20px}.topbar{background:#fff}
.nav-toggle{display:none}
.page-heading{margin-bottom:24px}.page-heading h1{letter-spacing:-.035em}.page-heading p{color:var(--cloud-muted)}
#script-ready-view,#phone-cloud-view,#start-view,#setup-view,#model-guide-view,#vault-view{background:transparent;color:var(--cloud-ink);border:0;box-shadow:none;padding:0;border-radius:0;max-width:none}
#script-ready-view[hidden],#phone-cloud-view[hidden]{display:none!important}
#workspace .primary-button{background:#08668a;color:#fff;border:1px solid #08668a;box-shadow:0 2px 3px #12374b14;border-radius:8px;padding:12px 18px;min-height:46px;font-weight:700}
#workspace .primary-button:hover{background:#064e6a;filter:none}
#workspace .secondary-button{background:#fff;color:#155879;border:1px solid #8bafc2;box-shadow:none;border-radius:8px;padding:12px 18px}
#workspace .quiet-button{color:#466173;background:transparent;border-color:#a9bfcd;border-radius:7px}
#workspace :is(button,a,input,textarea,select,summary):focus-visible{outline:3px solid #087aa5;outline-offset:3px}
#workspace button:disabled{opacity:.45;cursor:not-allowed}
#workspace .cloud-kicker,.sr-bonus{color:#08668a;font-size:12px;letter-spacing:.1em;font-weight:750}
.cloud-links{display:flex;gap:12px;flex-wrap:wrap}
.cloud-note{padding:22px 24px;margin:24px 0;background:#edf4f8;border-left:4px solid #4d98bb;border-radius:0 10px 10px 0;line-height:1.7;color:#304f62}
.cloud-note h3,.cloud-note p{margin:0 0 8px}.cloud-note p:last-child{margin:0}
.cloud-role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0}
.cloud-role-grid article{padding:24px;background:#fff;border:1px solid var(--cloud-border);border-radius:12px;line-height:1.7}
.cloud-role-grid article>span{font-size:12px;color:#36637c;font-weight:700;letter-spacing:.04em}.cloud-role-grid h3{font-size:22px;margin:12px 0}.cloud-role-grid p{color:var(--cloud-muted)}
.cloud-role-grid a,#setup-view a:not([class]),#start-view a:not([class]){color:#09678a}
.learning-intro p,.lesson-body p{color:var(--cloud-muted)}
.learning-intro h2{color:var(--cloud-ink);font-size:30px;letter-spacing:-.02em}.learning-route{background:#e8f1f5;border:1px solid #c4d8e3;color:#2c536a;border-radius:10px;padding:16px 22px;margin:24px 0}
.learning-route p,.route-platform{color:#2c536a}.lesson-card{background:#fff;border:1px solid var(--cloud-border);border-radius:12px;margin:14px 0}.lesson-number{color:#08668a;background:#e6f2f8}.lesson-body h3{color:var(--cloud-ink)}
/* A compact introduction gives the actual task more room. */
#script-ready-view .sr-intro{max-width:none;margin:0 0 24px;padding:0 2px}
#script-ready-view .sr-intro h2{font-size:clamp(24px,2.2vw,31px);letter-spacing:-.025em;line-height:1.3;margin:8px 0}
#script-ready-view .sr-intro p{color:var(--cloud-muted);max-width:78ch;margin:8px 0}
#script-ready-view .sr-session{color:#587082!important;font-size:13px!important}
#script-ready-view .sr-steps{background:transparent;border:0;padding:0;gap:10px;margin:24px 0}
#script-ready-view .sr-steps button{background:#fff;border:1px solid #bcced9;color:#3b586b;box-shadow:none;padding:15px;min-height:78px;font-weight:650}
#script-ready-view .sr-steps button span{color:#5e7788;margin-bottom:6px}
#script-ready-view .sr-steps button.active{background:#075d80;color:#fff;border-color:#075d80;box-shadow:0 3px 8px #075d801c}
#script-ready-view .sr-steps button.active span{color:#c4e6f3}
#script-ready-view .sr-work{border:1px solid var(--cloud-border);background:#fff;border-radius:14px;overflow:hidden}
#script-ready-view .sr-work>header{padding:22px 24px;border-bottom:1px solid var(--cloud-border);background:#fff;position:relative}
#script-ready-view .sr-work h2{font-size:25px;color:var(--cloud-ink)}
#script-ready-view .sr-work header p{color:var(--cloud-muted);margin:8px 0;max-width:70ch}
#script-ready-view .sr-chat{background:#fff5ee;border:1px solid #e8d2c2;color:#73523c;font-size:13px;padding:7px 10px;margin-top:6px;border-radius:6px}
#script-ready-view .sr-editor,#vault-view .prompt-grid{background-color:#f0f4f7;background-image:radial-gradient(#c9d7df 0.7px,transparent 0.7px);background-size:12px 12px;padding:24px;gap:24px;align-items:start}
#script-ready-view .sr-editor{grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr)}
#script-ready-view .sr-input-panel,#vault-view .input-panel{background:#e5f0f8;border:1px solid #aec8da;border-top:4px solid #377ca4;padding:24px;box-shadow:none}
#script-ready-view .sr-input-panel h3{margin-bottom:22px}
#script-ready-view .sr-input-panel .prompt-zone-label{font-size:12px;letter-spacing:.08em;color:#265f82}
#script-ready-view .sr-output,#vault-view .editor-panel{background:#fff;border:1px solid #b8cec1;border-top:4px solid #3b8a63;box-shadow:0 5px 18px #173d4d0b;align-self:start}
#script-ready-view #sr-output-title,#vault-view .editor-panel>.panel-heading{background:#eef7f0;color:#244e38;padding:20px 22px;font-size:19px;border-bottom:1px solid #d4e4d9}
#vault-view .editor-panel>.panel-heading h3,#vault-view .editor-panel>.panel-heading:before{color:#244e38}
#script-ready-view #sr-prompt-status,#vault-view .edit-status{background:#fff7df;color:#73561b;border:0;padding:10px 22px;font-weight:500}
#script-ready-view .sr-copy-bar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:18px 22px;border-bottom:1px solid #dce5e0}
#script-ready-view .sr-copy-bar a{color:#286747;font-size:14px;text-underline-offset:4px}
#script-ready-view #sr-copy,#vault-view #copy{background:#216648;color:#fff;border-color:#216648}
#script-ready-view #sr-preview{max-height:440px;padding:22px;background:#fff;border:0;margin:0;color:#294252}
#script-ready-view .sr-output pre,#vault-view .prompt-preview pre{font:400 15px/1.85 var(--body);color:#294252}
#script-ready-view #sr-prompt,#vault-view #prompt-editor{background:#fff;color:#294252}
#script-ready-view .sr-output>.sr-actions{background:#f7faf8;border-top:1px solid #d4e4d9;padding:14px 22px}
#script-ready-view .sr-output>.sr-session{background:#f7faf8;color:#486355!important;padding:0 22px 18px}
#script-ready-view :is(#sr-edit,#sr-reset,#sr-reset-final){color:#466153;border-color:#a3bbae;min-height:42px}
#script-ready-view .sr-navigation,#vault-view .flow-footer{background:#e8eff4;border:1px solid #c5d5df;padding:16px 20px;margin-top:20px}
#script-ready-view #sr-next,#vault-view .flow-footer #next{background:#fff;color:#1f5776;border-color:#88aabd}
#script-ready-view #sr-back,#vault-view .flow-footer #previous{color:#476578}
#script-ready-view .sr-navigation #sr-next{margin-left:auto}
#script-ready-view .sr-finish{background:#eef7f0;border-color:#b8cec1}.sr-finish h3,#script-ready-view .sr-finish p{color:#244e38}
#script-ready-view #sr-lock-status{color:#356c4e}#script-ready-view .sr-approval{background:#fff7df;color:#614d23;border-color:#dfc88c}
.prompt-section-heading{color:inherit!important}.prompt-placeholder{background:#ffedb5;color:#674817;border-color:#ddbc68}
/* Phone walkthrough: numbered white cards and a green copy area. */
#phone-cloud-view{--pc-accent:#08668a}
#phone-cloud-view .pc-intro{background:#e9f3f8;border:1px solid #c0d8e5;padding:26px;border-radius:14px}
#phone-cloud-view .pc-intro h2{color:#153f57;font-size:clamp(26px,3vw,36px)}
#phone-cloud-view .pc-intro p{color:#476477}.pc-map li{background:#fff;border-color:#c0d5e0}
#phone-cloud-view .pc-map strong{color:#155779}#phone-cloud-view .pc-map span{color:#526b7b}
#phone-cloud-view .pc-tabs button{background:#fff;border-color:#b6cbd8;color:#37596f;min-height:54px}
#phone-cloud-view .pc-tabs button[aria-pressed=true]{background:#075d80;color:#fff;border-color:#075d80}
#phone-cloud-view .pc-progress label,#phone-cloud-view .pc-progress small{color:#4e6879}
#phone-cloud-view .pc-step{background:#fff;border:1px solid var(--cloud-border);margin:16px 0;box-shadow:0 2px 6px #163b5505}
#phone-cloud-view .pc-step>summary{color:#1e4056;padding:20px 22px}
#phone-cloud-view .pc-step[open]>summary{background:#f4f8fb;border-bottom:1px solid #d3e1e9}
#phone-cloud-view .pc-step-no{background:#ddecf5;border:0;color:#155d83;font-weight:700;padding:10px;border-radius:8px}
#phone-cloud-view .pc-step-body{color:#405b6c;padding:24px;line-height:1.85}
#phone-cloud-view .pc-step-body strong{color:#203f53}
#phone-cloud-view a{color:#08668a}
#phone-cloud-view .pc-note{background:#fff7e6;color:#6f5627;border-left-color:#cba044}
#phone-cloud-view .pc-check{background:#eaf5ed;color:#2d6042;border:1px solid #bdd5c5}
#phone-cloud-view .pc-prompt{background:#fff;border:1px solid #a8c5b2;border-top:4px solid #3b8a63}
#phone-cloud-view .pc-prompt-head{background:#eef7f0}
#phone-cloud-view .pc-prompt-head h4{color:#24563b;font-size:17px}#phone-cloud-view .pc-prompt-head small{color:#4e6c59}
#phone-cloud-view .pc-prompt summary{color:#41654e}
#phone-cloud-view .pc-prompt textarea{background:#f9fcfa;color:#294252;border-color:#c2d6c8}
#phone-cloud-view .pc-copy-status{color:#286044}
#phone-cloud-view .pc-form{background:#e5f0f8;border:1px solid #aec8da;border-top:4px solid #377ca4;padding:22px}
#phone-cloud-view .pc-form label{color:#294f69}
#phone-cloud-view .pc-form :is(input,select,textarea){background:#fff;color:#203f53;border-color:#8faec1}
#phone-cloud-view .pc-panel h3{color:#1c4259}
#phone-cloud-view .pc-panel>p,#phone-cloud-view .pc-faq p,#phone-cloud-view .pc-sources{color:#506879}
#phone-cloud-view .pc-sources{background:#eef3f6;border-color:#ccdce6}
#phone-cloud-view .pc-sources summary,#phone-cloud-view .pc-faq summary{color:#335b73}
#phone-cloud-view .pc-faq{border-color:#cbd9e1}
.pc-entry{background:#fff;border:1px solid #a8c7d8;border-left:4px solid #3187ae;border-radius:10px}
.pc-entry strong{color:#244e65}.pc-entry p{color:#526c7d}.pc-entry a{color:#09678a}
/* Carry the same hierarchy through Fast Track and DNA. */
#vault-view .route-summary{background:#e8f2f7;border:1px solid #c5dae5;color:#1b485f;border-radius:12px}
#vault-view .route-summary p{color:#506f80}
#vault-view .work-area{background:#fff;border:1px solid var(--cloud-border);border-radius:12px;overflow:hidden}
#vault-view .work-heading,#vault-view #workflow-instruction{background:#fff;color:#38586e}
#vault-view .work-heading h2{color:#1c4058}#vault-view .eyebrow{color:#456d83}
#vault-view .idea-source-picker{background:#fff;border:1px solid var(--cloud-border);border-radius:12px;color:#24475d}
#vault-view .idea-source-options button{background:#f6f9fb;color:#254f68;border:1px solid #b5cad7}
#vault-view .idea-source-options button :is(strong,span,small){color:inherit}
#vault-view .idea-source-options button[aria-checked=true]{background:#e3f1f8;color:#164b69;border-color:#528faf;box-shadow:inset 4px 0 #3083ac}
#vault-view .idea-code-choice,#vault-view .destination-picker{background:#fff4eb;color:#704e35;border:1px solid #e2cbb9}
#vault-view .idea-code-choice>span{color:#704e35}
#vault-view .idea-code-choice button,#vault-view .destination-picker button[aria-pressed=true]{background:#fff;color:#654a38;border-color:#d3b9a5;box-shadow:none}
#vault-view .destination-picker>div[role=group]{grid-template-columns:1fr}
#vault-view .idea-route-note{color:#4f6a7b;border-color:#7ca8c0}
#vault-view .workflow-nav-label,#vault-view .step-strip{background:#eaf0f5;color:#375c74;border-color:#c4d5df}
#vault-view .workflow-nav-label span{color:#5b7384}
#vault-view .step-button{background:#fff;color:#35576e;border-color:#b6cad7}
#vault-view .step-button.active{background:#075d80;color:#fff;border-color:#075d80;box-shadow:none}
#vault-view .step-button>span{color:inherit}
#vault-view .visual-flow,#vault-view .step-purpose{background:#edf4f8;color:#365970;border-color:#c1d7e4}
#vault-view .visual-flow :is(h3,h4,b),#vault-view .purpose-tags li,#vault-view .purpose-caption{color:#365970}
#vault-view .purpose-icon{color:#377fa3}#vault-view .flow-node{background:#fff;border-color:#bbd1dd;color:#365970}
#vault-view .prompt-preview{background:#fff;border-color:#dce5e0}
#vault-view .edit-guidance{color:#5d7467;background:#fff}
#vault-view .preview-controls,#vault-view .editor-footer,#vault-view .after-copy{background:#f2f8f4;border-color:#ccddd2;color:#456653}
#vault-view #char-count,#vault-view .editor-actions #reset{color:#4c6b58}
#vault-view .flow-footer>span,#vault-view .bottom-note{color:#506c7d}
/* Menus fold away on small screens so the lesson comes first. */
@media(max-width:1100px){
 .sidebar{padding:12px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
 .sidebar .brand{width:auto;flex-direction:row;gap:10px;margin:0;align-items:center}.sidebar .brand strong{font-size:15px}.sidebar .brand small{display:none}
 .nav-toggle{display:block;border:1px solid #89adbf;border-radius:8px;background:#fff;color:#244e66;padding:10px 14px;font:600 14px var(--body);min-height:44px}
 .sidebar nav.vault-nav{display:none;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px 0}
 .sidebar nav.vault-nav.is-open{display:grid}.topbar{display:none}
 .cloud-role-grid{grid-template-columns:1fr}.page-heading{margin-bottom:20px}
}
@media(max-width:850px){#script-ready-view .sr-editor{grid-template-columns:1fr}#script-ready-view .sr-lock-fields{grid-template-columns:1fr}}
@media(max-width:650px){
 main{padding:24px 16px}#script-ready-view,#phone-cloud-view,#start-view,#setup-view,#model-guide-view,#vault-view{padding:0}
 .page-heading h1{font-size:28px}#script-ready-view .sr-intro h2{font-size:24px}
 #script-ready-view .sr-steps{gap:8px}#script-ready-view .sr-steps button{font-size:14px;padding:12px;min-height:74px}
 #script-ready-view .sr-work>header{padding:20px}#script-ready-view .sr-editor,#vault-view .prompt-grid{padding:14px;gap:20px}
 #script-ready-view .sr-input-panel,#vault-view .input-panel{padding:18px}
 #script-ready-view .sr-copy-bar{padding:16px;gap:14px}#script-ready-view #sr-preview{padding:18px;max-height:340px}
 #script-ready-view .sr-copy-bar .primary-button{width:100%}
 #script-ready-view .sr-navigation{padding:12px;gap:12px}#script-ready-view .sr-navigation button{width:100%;margin:0}
 #phone-cloud-view .pc-intro,#phone-cloud-view .pc-step-body{padding:20px}
 #phone-cloud-view .pc-tabs{gap:8px}#phone-cloud-view .pc-tabs button{text-align:left}
 #phone-cloud-view .pc-map{grid-template-columns:1fr}
 .cloud-role-grid article{padding:20px}.lesson-card{padding:20px}.pc-entry{padding:18px}
}
.sidebar .vault-nav :is(.path-button,#start-nav,#path-fast,#path-reference).active{color:#fff!important}
#script-ready-view .sr-finish h3{color:#244e38}
#script-ready-view .editable-token,#vault-view .editable-token{background:#ffecb0;color:#674817;border-color:#ddbc68}
#vault-view .idea-source-picker h2{color:#24475d}
#vault-view .idea-route-note{background:#eef4f8}
#vault-view .flow-sequence{color:#39738f}
#vault-view .style-selection{background:#f1f5fa;border:1px solid #bdcddd;color:#294d68}
#vault-view .style-selection :is(strong,p,span){color:#294d68}
#vault-view .style-selection button{background:#fff;color:#315c7a;border-color:#8faac0}
#vault-view .idea-code-choice>div{grid-template-columns:1fr}
/* Asset builder uses the same form / prompt language as the video workflow. */
#broll-view{background:transparent;border:0;box-shadow:none;padding:0;color:#18384b}
#broll-view .br-first>span{color:#08668a}
#broll-view .br-platform-note{color:#526879}
#broll-view .br-platforms{grid-template-columns:1fr}
#broll-view .br-input{background:#e5f0f8;border:1px solid #aec8da;border-top:4px solid #377ca4}
#broll-view .br-output{background:#fff;border:1px solid #b8cec1;border-top:4px solid #3b8a63;color:#294252}
#broll-view .br-output header{background:#eef7f0;border-color:#ccddd2;color:#244e38}
#broll-view .br-output header>span,#broll-view .br-output header p,#broll-view .br-summary{color:#456853}
#broll-view #br-status{color:#73561b}
#broll-view .br-actions button{background:#fff;color:#365b48;border-color:#9bb6a6}
#broll-view #br-copy{background:#216648;color:#fff;border-color:#216648}
#broll-view .br-next{border-color:#ccddd2}#broll-view .br-next strong{color:#24563b}
#broll-view .br-preview{background:#f5f9f6;border-color:#ccddd2}
#broll-view .br-preview summary,#broll-view .br-preview summary small,#broll-view .br-output .br-hint{color:#526e5d}
#broll-view #br-prompt{background:#fff;color:#294252;border-color:#a8c3b2}
#broll-view .br-summary{background:#edf5ef;color:#345c44;border-color:#cadfd1}
#broll-view .br-next p{color:#526e5d}
