body.studio-open{--studio-width:420px;--editor-height:145px;background:#e9eeed}
body.studio-open #appRoot{margin-left:var(--studio-width);width:calc(100% - var(--studio-width));padding-top:22px}
body.studio-open #appRoot::before{content:'STUDENT PREVIEW';display:block;text-align:center;font:700 11px/1.4 var(--font-ui);letter-spacing:.14em;color:#53706d;margin-bottom:18px}
body.studio-open #appRoot .paper{box-shadow:0 3px 24px #12352d0c}
#authoringStudio[hidden],#studioWelcome[hidden],#studioTemplates[hidden]{display:none}
#authoringStudio{position:fixed;left:0;top:var(--editor-height);bottom:0;width:var(--studio-width);background:#fff;border-right:1px solid #cddbd7;overflow:auto;z-index:80;font:14px/1.5 var(--font-ui),sans-serif;color:#173c37}
.studio-tabs{position:sticky;top:0;display:flex;background:#f2f6f4;border-bottom:1px solid #dce5df;z-index:2;padding:8px;gap:3px}
.authoring-studio button,.studio-template-card{font:inherit;cursor:pointer;border:1px solid #c7d7d1;border-radius:7px;background:white;color:#173c37;padding:7px 10px}
.authoring-studio button:hover,.studio-template-card:hover{background:#edf5f1;border-color:#3f7666}
.authoring-studio button:disabled{opacity:.5;cursor:default}
.studio-tabs button{flex:1;border:0;font-size:12px;padding:9px 4px}
.studio-tabs button[aria-current=true]{background:#145b50;color:white}
.studio-panel{padding:20px 18px}
.studio-field{display:block;margin:0 0 18px}
.studio-field>span{display:block;font-weight:650;font-size:12px;letter-spacing:.01em;margin-bottom:6px}
.studio-field input,.studio-field select,.studio-field textarea{box-sizing:border-box;width:100%;font:14px/1.5 var(--font-ui),sans-serif;padding:9px 10px;border:1px solid #becfc7;border-radius:6px;background:white;color:#183930;min-width:0}
.studio-field textarea{min-height:85px;resize:vertical}
.studio-field input[readonly]{background:#f4f6f4;color:#577167;font-size:11px}
.studio-field small,.studio-hint{display:block;color:#60736d;font-size:12px;line-height:1.65;margin:6px 0 16px}
.studio-field :focus-visible,.studio-rich:focus-visible,.authoring-studio button:focus-visible{outline:3px solid #dbb657;outline-offset:2px}
.studio-block{border:1px solid #d8e3dd;background:#fbfcfa;border-radius:9px;padding:12px;margin-bottom:16px}
.studio-block-head{display:flex;gap:4px;align-items:center;margin-bottom:14px}
.studio-block-head strong{flex:1;font-size:12px}
.studio-block-head button{font-size:11px;padding:4px 7px}
.studio-block h3{font-size:14px;margin:0 0 15px}
.studio-rich-tools{display:flex;flex-wrap:wrap;gap:3px;padding:5px;background:#edf2ee;border:1px solid #becfc7;border-bottom:0;border-radius:6px 6px 0 0}
.studio-rich-tools button{font-size:10px;padding:4px 7px;border:0;background:transparent}
.studio-rich{background:#fff;min-height:76px;border:1px solid #becfc7;border-radius:0 0 6px 6px;padding:12px;color:#253c32;font:15px/1.7 var(--font-read),Georgia,serif;overflow-wrap:anywhere}
.studio-rich p{margin:0 0 10px}.studio-rich h2{font-size:20px}.studio-rich h3{font-size:17px}
.studio-rich ul,.studio-rich ol{margin:8px 0;padding-left:1.5em;list-style-position:outside}
.studio-rich ul{list-style-type:disc}.studio-rich ol{list-style-type:decimal}.studio-rich li{margin:4px 0}.studio-rich li>ul,.studio-rich li>ol{margin:4px 0}
.studio-rich a{color:#0c6665;text-decoration:underline;text-underline-offset:3px}
.studio-link-dialog:not([open]){display:none}
.studio-link-dialog{box-sizing:border-box;position:fixed;inset:0;margin:auto;height:fit-content;width:min(460px,calc(100% - 32px));max-height:90vh;overflow:auto;border:1px solid #c8d5cc;border-radius:12px;padding:24px;color:#203d35;background:#fffef8;box-shadow:0 20px 70px #14382f33;font:14px/1.5 var(--font-ui),sans-serif}
.studio-link-dialog::backdrop{background:#173b345c}
.studio-link-dialog h2{font:600 28px/1.2 var(--font-display),Georgia,serif;margin:0 0 8px}
.studio-link-dialog p{margin:0 0 18px}.studio-link-dialog .studio-field{margin-bottom:16px}
.studio-link-dialog .studio-link-error{color:#9d382b}.studio-link-error:empty{display:none}
.studio-link-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.studio-link-actions [hidden]{display:none}.studio-link-actions .studio-link-save{background:#19594f;color:white;border-color:#19594f}
.studio-add,.studio-preview-button{width:100%;border-style:dashed!important}
.studio-preview-button{width:calc(100% - 36px);margin:0 18px 20px}
.studio-checks{border-top:1px solid #dce5df;padding:16px 18px;background:#f5f7f2;font-size:12px}
.studio-checks summary{font-weight:700;cursor:pointer}.studio-checks .error{color:#9d382b}.studio-checks .note{color:#5d6c5c}
.authoring-studio fieldset{border:1px solid #d5dfd8;border-radius:6px;padding:9px;margin:0 0 18px}.authoring-studio legend{font-size:12px;font-weight:650;padding:0 4px}
.studio-check{display:flex;align-items:flex-start;gap:8px;padding:6px 0;font-size:12px;line-height:1.5}.studio-check input{flex:none;margin-top:3px}
.authoring-studio details:not(.studio-checks){font-size:12px;margin:12px 0}.authoring-studio details[open]>summary{margin-bottom:15px}
#editorBar{background:#123c35!important;font-family:var(--font-ui),sans-serif!important;padding:13px 22px!important}
#editorBar .editor-actions{gap:7px}#editorBar strong{font:600 23px/1.2 var(--font-display),Georgia,serif;margin-right:14px}
#editorBar button{font-size:12px!important;border-radius:6px!important;padding:8px 11px!important}
#editorBar #editorPublish{background:#e8bd67;color:#173d32;border-color:#e8bd67;font-weight:700}
#editorBar #editorSave{background:#e9f2ed;color:#173d32}
#editorBar [data-editor-command]{display:none}#editorBar #editorState{margin-left:auto;font-size:12px;color:#dbecde}
#editorPage{width:360px;max-width:100%;font-size:12px!important;border-radius:5px;border:0}
#editorStatus{font-size:12px;color:#e0ebe4;margin-top:8px!important}
#studioWelcome{padding:30px 32px;max-width:960px;margin:30px auto;background:#fff;border:1px solid #d6e2db;border-radius:12px}
#studioWelcome h1{font:600 34px/1.2 var(--font-display),Georgia,serif;color:#173d32;margin:0 0 12px}
#studioWelcome p{font:15px/1.6 var(--font-ui),sans-serif;color:#596e63;max-width:680px}
#studioTemplates:not([open]){display:none}
#studioTemplates{box-sizing:border-box;position:fixed;inset:0;width:min(1020px,calc(100% - 40px));max-height:calc(100vh - 60px);z-index:120;background:#f8faf6;overflow:auto;padding:28px;border:1px solid #cbdad2;border-radius:14px;color:#173c37;font:14px/1.5 var(--font-ui),sans-serif}
#studioTemplates::backdrop{background:#102b27a8}
.studio-template-heading{margin-bottom:22px;justify-content:space-between}.studio-template-heading p{color:#5c7166}.studio-eyebrow{display:block;font-size:10px;letter-spacing:.15em;font-weight:700;color:#55806c;margin-bottom:12px}
#studioStart{font:600 14px var(--font-ui),sans-serif;color:white;background:#145b50;padding:12px 18px;border:0;border-radius:7px;cursor:pointer}
.studio-template-dialog{width:min(950px,100%);background:#f8faf6;border-radius:14px;padding:28px;box-shadow:0 24px 100px #0003;color:#173c37;font:14px/1.5 var(--font-ui),sans-serif}
.studio-template-heading{display:flex;align-items:center;gap:20px}.studio-template-heading h2{flex:1;font:600 30px/1.2 var(--font-display),Georgia,serif;margin:0}.studio-template-heading button{background:white;border:1px solid #bed0c3;border-radius:6px;padding:8px 12px;cursor:pointer}
.studio-template-dialog>p{color:#5c7166;margin:12px 0 22px}.studio-template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.studio-template-card{text-align:left;padding:18px;display:flex;flex-direction:column;gap:9px;min-height:154px}
.studio-template-card .studio-template-icon{font-size:30px;line-height:1;color:#397b69}.studio-template-card strong{font-size:14px}.studio-template-card small{font-size:12px;line-height:1.6;color:#65786d}
@media(max-width:1050px){body.studio-open{--studio-width:365px}.studio-panel{padding:14px}.studio-template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){body.studio-open #appRoot{margin-left:0;width:100%;padding-top:20px}#authoringStudio{position:relative;top:auto;width:100%;max-height:65vh;border-bottom:2px solid #bdcfc4}#editorBar{position:relative!important}#editorBar strong{width:100%}#editorBar #editorState{width:100%;margin:4px 0 0}.studio-template-grid{grid-template-columns:1fr}#studioTemplates{padding:12px}.studio-template-dialog{padding:20px}#studioWelcome{margin:15px;padding:22px}}

#editorLiveLink{font-size:12px;color:#e8bd67;padding:4px 0}#editorLiveLink[hidden]{display:none}

.studio-flow-placement{margin:0 0 20px;overflow-wrap:anywhere}
.studio-flow-path{display:flex;flex-direction:column;gap:28px;position:relative}
.studio-flow-step{position:relative;min-width:0;padding:16px;border:1px solid #c8dbcf;border-radius:9px;background:#fbfcfa}
.studio-flow-step+.studio-flow-step::before{content:'↓';position:absolute;top:-29px;left:calc(50% - 12px);width:24px;height:28px;text-align:center;font:20px/28px var(--font-ui),sans-serif;color:#527c70}
.studio-flow-step h2{font:650 16px/1.4 var(--font-ui),sans-serif;margin:0 0 14px;color:#174a3d}
.studio-flow-current{background:#145b50;border-color:#145b50}
.studio-flow-current h2{color:#e8bd67;font-size:14px;margin-bottom:6px}
.studio-flow-title{color:#fff;font:600 20px/1.35 var(--font-display),Georgia,serif;margin:0}
.studio-flow-incoming{list-style:none;padding:0;margin:0 0 16px;font-size:14px;line-height:1.5}
.studio-flow-incoming li+li{margin-top:10px}
.studio-flow-placement .studio-field>span{font-size:14px}
.studio-flow-placement .studio-hint,.studio-flow-placement .studio-field small{font-size:14px;line-height:1.5}
.studio-flow-step>:last-child{margin-bottom:0}
.studio-flow-actions{margin-top:16px}
.studio-flow-actions>button{width:100%}
.studio-flow-status{font-size:14px;line-height:1.5;color:#9a352c}
.studio-flow-status:empty{display:none}

.studio-naming{border:1px solid #c8dbcf;border-radius:9px;padding:16px 12px;margin-bottom:22px;background:#f6faf5}
.studio-naming h2{font:600 23px/1.2 var(--font-display);margin:0 0 7px;color:#174a3d}
.studio-naming select:disabled{background:#edf1eb;color:#8b978d;cursor:default}
.studio-generated-name{border-top:1px solid #c8dbcf;padding-top:12px;margin-top:4px}.studio-generated-name strong{display:block;font-size:11px;color:#4b6e5d;margin-bottom:7px}.studio-generated-name output{display:block;font:12px/1.7 var(--font-ui);overflow-wrap:anywhere;color:#173c37;user-select:all}
.studio-new-focus{padding:12px;border:1px dashed #a9c4b2;border-radius:7px;margin-bottom:18px;background:white}.studio-new-focus .studio-field{margin-bottom:8px}
.studio-draft-button{width:100%;margin-top:16px;padding:12px;border:1px solid #19594f;border-radius:8px;background:#19594f;color:#fff;font-family:inherit;font-size:14px;font-weight:600;line-height:1.3;cursor:pointer}
.studio-draft-button:disabled{opacity:.45;cursor:default}
#studioAI{box-sizing:border-box;width:min(620px,calc(100% - 32px));max-height:90vh;overflow:auto;border:1px solid #c8d5cc;border-radius:16px;padding:24px;color:#203d35;background:#fffef8;box-shadow:0 20px 70px #14382f33;font:15px/1.5 Arial,sans-serif}
#studioAI::backdrop{background:#173b345c}
#studioAI h2{margin:0;font:600 28px/1.2 Georgia,serif}
#studioAI button{padding:10px 14px;border:1px solid #b8c9c0;border-radius:7px;background:#fff;color:#174d42;cursor:pointer;font:inherit}
#studioAI button:disabled{opacity:.5;cursor:default}
#studioAI #studioAICopy,#studioAI #studioAIImport{background:#19594f;color:white;border-color:#19594f}
#studioAI textarea{min-height:112px;resize:vertical}
#studioAI h3{font-size:16px;margin:24px 0 12px}
#studioAI details{margin:12px 0;color:#466257}
#studioAI details summary{cursor:pointer;font-size:13px}
#studioAI details .studio-field{margin-top:10px}
#studioAIRequest,#studioAIImportText{font:12px/1.5 ui-monospace,monospace}
.studio-ai-name{font-size:12px;overflow-wrap:anywhere;color:#61756a}
.studio-ai-actions{display:flex;flex-wrap:wrap;gap:10px}
.studio-ai-notes{white-space:pre-wrap;background:#eef5ed;padding:14px;border-radius:8px;margin-top:16px}

.studio-field[hidden]{display:none}.studio-path .studio-field:last-child{margin-bottom:0}.studio-path textarea{min-height:65px}

/* Shared author-created examples: used in the editor and student text. */
[data-la-box]{display:block;position:relative;box-sizing:border-box;margin:24px 0 20px;padding:25px 20px 18px;border:2px solid #3f7666;border-radius:12px;background:#edf5f1;color:#332e25;min-height:70px;overflow-wrap:anywhere}
[data-la-box]::before{content:'Example Text';display:block;position:absolute;top:-14px;left:16px;max-width:calc(100% - 32px);padding:3px 10px;background:#edf5f1;color:#20584d;font:700 14px/1.4 var(--font-ui),sans-serif;pointer-events:none}
[data-la-box="simple"]{border-color:#C79737;background:#FFFAEA}
[data-la-box="simple"]::before{content:'Simple Language Example';background:#FFF4D6;color:#704A0A}
.studio-rich-tools .studio-field{margin:0;display:inline-flex;align-items:center;gap:5px}
.studio-rich-tools .studio-field>span{margin:0;font-size:12px}
.studio-rich-tools select{width:auto;min-width:75px;padding:5px;font:inherit}

.generator-section{border:1px solid #d1ded8;border-radius:10px;padding:12px;margin:12px 0}.generator-section summary{font-weight:700;cursor:pointer}.generator-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.generator-grid .studio-field{margin:0}.generator-check{display:flex;gap:10px;padding:7px}.generator-primary{background:#145b50!important;color:white!important;padding:12px 18px!important;margin:12px 0}.generator-result{padding:12px;background:#f3f7f4;white-space:pre-wrap;overflow-wrap:anywhere}.generator-preview details{margin:8px 0}.generator-status{font-size:14px;line-height:1.5}.generator-manual{margin:20px 0}#studioGenerator>details input,#studioGenerator>details select{max-width:100%;margin:6px}#studioGenerator fieldset{border:1px solid #cddbd7;border-radius:8px}#studioGenerator [hidden]{display:none!important}@media(max-width:600px){.generator-grid{grid-template-columns:1fr}}