/* Accessible sizing and responsive refinements for the full exercise library. */
[hidden]{display:none!important}
body{font-family:'Segoe UI',Arial,sans-serif;font-size:16px}
button,input,select,textarea{font:inherit}
input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #d1aa38;outline-offset:3px}
.skip-link{position:fixed;left:16px;top:-100px;z-index:20;background:#fff;padding:12px;color:#213e34;border:2px solid #387b51;border-radius:8px}
.skip-link:focus{top:12px}
.app{grid-template-columns:300px minmax(0,1fr)}
.work,aside{min-width:0}
.work{scroll-margin-top:20px}
#lessons{max-height:610px;overflow-y:auto;scrollbar-width:thin}
.lesson b{font-size:14px;line-height:1.5}
.lesson small{font-size:12px;color:#64725e;line-height:1.4}
.lesson{padding:12px 8px;gap:9px}
.aside-title{font-size:11px;letter-spacing:.5px}
.aside-title span{color:#52674b}
.library-filters{gap:12px}
.library-filters label{font-size:13px;font-weight:600;gap:6px}
.library-filters input,.library-filters select{min-height:42px;min-width:0;font-size:14px}
.filter-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.filter-row label{min-width:0}
.text-button{border:0;background:transparent;color:#326444;text-decoration:underline;justify-self:start;padding:5px 0;font-size:13px}
.paging button{border:1px solid #c9d4c2;border-radius:8px;background:#fff;color:#244d34;min-width:44px;min-height:40px;cursor:pointer}
button:disabled{cursor:default}
#libraryCount,.paging,#empty{font-size:13px;color:#52674b}
.description{font-size:15px;color:#52634f;line-height:1.8}
.mission{align-items:flex-start}
.mission b{font-size:14px}
.mission p{font-size:14px;color:#556146;line-height:1.75}
.mission button{font-size:12px;min-height:40px}
#hint{font-size:14px;color:#685321}
.sample-answer,.expected{margin:12px 0 16px}
summary{cursor:pointer;font-size:14px;line-height:1.7;color:#315d37;padding:5px 0}
.sample-answer pre,.expected pre{margin-top:8px;color:#2c4b32;font-size:14px}
.sample-answer pre{max-height:420px}
.editor-head{font-size:13px}
.editor-head button{font-size:12px;min-height:30px}
.code-area{height:270px;padding:16px 0;overflow:hidden}
.code-area textarea{resize:none;min-height:0;height:100%;overflow:auto;font:15px/1.9 Consolas,monospace;white-space:pre;tab-size:4}
#lines{font:15px/1.9 Consolas,monospace;height:100%;overflow:hidden;min-width:44px;user-select:none}
.editor-footer{font-size:12px;flex-wrap:wrap}
.editor-footer .primary{font-size:14px;min-height:44px}
.inputbox{display:block;font-size:13px;color:#52674b;margin:16px 0}
.inputbox textarea{min-height:66px;height:66px;padding:10px;font:14px/1.7 Consolas,monospace}
.output-head{font-size:14px}
.output-head span{font-size:12px;color:#52674b}
#output{font:14px/1.8 Consolas,monospace;color:#2f4c36;min-height:110px;max-height:330px}
#feedback{font-size:14px}
#feedback.success{color:#286335;background:#eff7e9;padding:12px;border-radius:8px}
#feedback.needs-work{color:#82551c;background:#fff6e6;padding:12px;border-radius:8px}
.save-state{font-size:12px;color:#667660;margin:10px 0}
.editor-help{font-size:12px;line-height:1.7;color:#52674b;margin:8px 0 16px}
.bottom{font-size:12px;gap:12px;flex-wrap:wrap}
.bottom button{font-size:14px;min-height:42px}
.progress-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;padding:24px;margin:28px 0;border:1px solid #d8e2cc;border-radius:14px;background:#f0f5e8}
.progress-tools b{font-size:16px}
.progress-tools p{font-size:13px;margin:6px 0;color:#52674b}
.transfer-actions{display:flex;gap:10px;flex-wrap:wrap;margin-left:auto}
.transfer-actions button,.import-button{border:1px solid #b5c6a5;background:white;border-radius:8px;color:#31553e;padding:11px 15px;font-size:14px;cursor:pointer}
.import-button{position:relative;overflow:hidden}
.import-button input{position:absolute;opacity:0;inset:0;width:100%;cursor:pointer}
.import-button:focus-within{outline:3px solid #d1aa38;outline-offset:3px}
#transferStatus{flex-basis:100%;margin:0}
.dialog-actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.dialog-actions button{padding:12px;border:1px solid #b5c6a5;border-radius:8px;cursor:pointer}
dialog{max-width:min(560px,calc(100vw - 32px));max-height:85vh;overflow:auto}
.values b{font-size:14px}.values p{font-size:13px;color:#65745f}
.intro-meta{font-size:12px;color:#5f7058}.eyebrow{color:#526b49}
footer{font-size:12px}footer button{font-size:13px}
@media(max-width:900px){.app{grid-template-columns:250px minmax(0,1fr)}.work{padding:22px}.filter-row{grid-template-columns:1fr}.intro{gap:22px}}
@media(max-width:640px){
  main,footer{margin-left:14px;margin-right:14px}
  header{gap:10px;padding:0 14px;flex-wrap:wrap;height:auto;min-height:76px}
  nav{gap:12px;order:3;justify-content:center;width:100%}nav button{font-size:13px;padding:8px 0}
  .intro{padding:24px 4px}.intro-meta{font-size:11px}
  .app{grid-template-columns:minmax(0,1fr)}
  .library-filters{grid-template-columns:1fr 1fr;gap:10px}
  .library-filters>label:first-child,.filter-row,.paging{grid-column:1/-1}
  .filter-row{grid-template-columns:1fr 1fr}
  #libraryCount{align-self:center;text-align:right}
  #lessons{display:flex;max-height:none;overflow-x:auto;overflow-y:hidden;padding-bottom:8px;scroll-snap-type:x proximity}
  .lesson{min-width:190px;max-width:230px;scroll-snap-align:start}
  .work{padding:22px 14px}.work h2{font-size:24px}.mission{flex-wrap:wrap}.mission>div{flex:1;min-width:170px}
  .mission button{margin-left:36px}.mission p{font-size:14px}
  .code-area{height:260px}.code-area textarea,#lines{font-size:14px}
  .progress-info{font-size:11px;width:135px}.journey h2{font-size:22px}
  .progress-tools{padding:18px}.transfer-actions{margin-left:0}
  .bottom>span{display:none}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Knowledge lookup and the curated FX Studio library. */
nav{flex-wrap:wrap}nav button{white-space:nowrap}
.lesson-source{display:inline-block;font-size:13px;color:#326444;margin:-4px 0 12px}
.lesson-article{margin:16px 0;border:1px solid #d6dfcc;border-radius:10px;padding:12px 16px;background:#f8faf3}
.study-article{font-size:14px;line-height:1.8;color:#384c3c;overflow-wrap:anywhere}
.study-article h3{font-size:19px;margin:22px 0 10px}.study-article h4{font-size:16px;margin:20px 0 8px}
.study-article p{margin:8px 0}.study-article ul{padding-left:23px}.study-article pre{max-height:440px;color:#284732;font-size:13px;margin:12px 0}
.study-article code{background:#e9efdf;padding:1px 4px;border-radius:4px;font-family:Consolas,monospace}
.runtime-note,.archive-notice{font-size:14px;line-height:1.8;background:#f0f5e8;border:1px solid #d6dfcc;padding:14px;border-radius:10px;color:#48623b}
.mark-studied{padding:11px 16px;margin:0 0 16px;border:1px solid #a8be94;border-radius:8px;background:white;color:#315c3b;cursor:pointer}
.knowledge{scroll-margin-top:24px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:28px;margin-bottom:28px}
.reference-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.reference-heading h2{font-size:29px;margin:8px 0}.reference-heading p{font-size:15px;color:#5c7058;line-height:1.8;max-width:760px}
.reference-badge{white-space:nowrap;color:#496439;background:#eaf2dc;border:1px solid #d9e5c9;padding:10px 15px;border-radius:30px;font-size:13px}
.reference-search{display:grid;grid-template-columns:minmax(0,1fr) 215px;gap:16px;margin:20px 0 12px}
.reference-search label{display:grid;gap:8px;font-size:14px;font-weight:600;color:#38543b}
.reference-search input,.reference-search select{width:100%;min-width:0;border:1px solid #c6d4bb;border-radius:10px;padding:13px;background:#fcfdf9;color:#263e2c;font-size:15px}
.reference-chips{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 22px}
.reference-chips button{background:#f2f6eb;border:1px solid #d8e2cc;color:#416335;border-radius:20px;padding:7px 13px;font-size:13px;cursor:pointer}
.reference-grid{display:grid;grid-template-columns:285px minmax(0,1fr);gap:26px;align-items:start}
.reference-sidebar{border:0;padding:0;background:transparent;min-width:0}
#referenceCount{font-size:12px;line-height:1.7;color:#607457;margin:0 0 12px}
.reference-results{display:grid;gap:8px;max-height:730px;overflow-y:auto;padding-right:5px}
.reference-result{display:grid;gap:6px;text-align:left;width:100%;padding:13px 14px;border:1px solid #e2e8da;border-radius:10px;background:#fbfcf8;color:#354d36;cursor:pointer}
.reference-result b{font-size:14px;line-height:1.5}.reference-result small{font-size:12px;color:#708265}
.reference-result.selected{border-color:#87aa62;background:#edf5df;box-shadow:inset 3px 0 #6b9648}
.reference-more{width:100%;margin-top:12px;padding:10px;border:1px solid #c6d4bb;border-radius:8px;background:#fff;color:#426535;cursor:pointer}
#referenceEmpty{font-size:14px;color:#657a5e;line-height:1.8}
.reference-detail{min-width:0;padding:22px 26px;border:1px solid #dce5d1;border-radius:12px;background:#fff}
.reference-detail h3{font-size:26px;line-height:1.4;margin:14px 0}.reference-detail h4{font-size:15px;color:#436037;margin:20px 0 10px}
#referenceExplanation{font-size:16px;line-height:1.9;color:#4d6248}
.reference-detail pre{font-size:14px;color:#2f4a32;min-height:0;max-height:420px}
#referenceCode{background:#23382e;color:#ddedca;border:1px solid #375442;font:14px/1.9 Consolas,monospace}
.reference-code-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.reference-code-head button{font-size:12px;padding:8px 12px;border:1px solid #b9ccaa;border-radius:7px;background:#eff6e6;color:#3d6133;cursor:pointer}
.reference-note{margin:20px 0;padding:16px;background:#fff8e5;border:1px solid #eee1b7;border-radius:10px;font-size:14px;line-height:1.8;color:#75603a}.reference-note p{margin:6px 0 0}
#referenceSource{display:block;margin:18px 0;font-size:13px;color:#3d6b40}#referencePractice{font-size:14px;margin-top:18px}
@media(max-width:900px){.reference-grid{grid-template-columns:235px minmax(0,1fr);gap:16px}.reference-detail{padding:20px}.knowledge{padding:22px}.reference-badge{display:none}}
@media(max-width:640px){nav{gap:12px}nav button{font-size:12px}.knowledge{padding:18px 14px}.reference-heading h2{font-size:25px}.reference-search{grid-template-columns:minmax(0,1fr)}.reference-grid{grid-template-columns:minmax(0,1fr)}.reference-results{display:flex;overflow-x:auto;max-height:none;padding-bottom:10px}.reference-result{min-width:220px;max-width:250px}.reference-detail{padding:18px 14px}.reference-detail h3{font-size:23px}.reference-code-head{flex-wrap:wrap}#referenceExplanation{font-size:15px}}
/* Static code analysis: nested source blocks and explanations. */
.analyze-button{padding:10px 13px;border:1px solid #a5bf8e;border-radius:8px;background:#edf5e2;color:#315737;cursor:pointer;font-size:13px}
.editor-footer>div{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.sample-answer .analyze-button{margin-top:10px}
.reference-code-actions{display:flex;gap:8px;flex-wrap:wrap}
.analysis-dialog{width:min(1060px,calc(100vw - 32px));max-width:1060px;padding:26px;max-height:90vh;box-sizing:border-box}
.analysis-dialog-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.analysis-dialog h2{font-size:25px;line-height:1.5;margin:10px 0;overflow-wrap:anywhere}
#closeAnalysis{flex-shrink:0;border:1px solid #bdcdb0;background:#f5f8ee;color:#3b5b32;padding:10px 14px;border-radius:8px;cursor:pointer}
#analysisSummary{font-size:14px;color:#537246}.analysis-busy,.analysis-note{font-size:13px;line-height:1.8;color:#5c7053;background:#f3f7ec;border-radius:8px;padding:12px 15px}
#analysisSource{max-height:300px;color:#35513a;font-size:13px;margin-top:10px}
.analysis-overview{font-size:15px;line-height:1.9;color:#445e3d;padding:12px 0}
.analysis-block{border:1px solid #d8e3ce;border-radius:10px;padding:12px 15px;margin:12px 0;background:#fff;min-width:0}
.analysis-block>summary{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;font-size:15px;list-style:revert;overflow-wrap:anywhere}
.analysis-line{font-size:12px;font-weight:400;background:#edf4e4;border-radius:5px;padding:3px 7px;white-space:nowrap;color:#5a7548}
.analysis-scope{font-size:12px!important;color:#6c8063;margin:5px 0 10px}.analysis-block ul{padding-left:23px}.analysis-block li{font-size:14px;line-height:1.85;overflow-wrap:anywhere;margin:7px 0}
.analysis-snippet{background:#23372d;color:#e0edcc;font:13px/1.8 Consolas,monospace;min-height:0;max-height:240px;margin:10px 0}
.analysis-block-code>summary{font-size:12px;padding:5px 0}.analysis-names{border-left:3px solid #c7d9b5;padding:2px 12px;margin:12px 0}.analysis-names p{font-size:12px;line-height:1.8;margin:5px 0;overflow-wrap:anywhere}
.analysis-group{border-left:2px solid #dbe6ce;padding-left:14px;margin-top:16px;min-width:0}.analysis-group h4{font-size:13px;line-height:1.7;color:#557440;margin:0}
.analysis-warning,.analysis-error{padding:12px 15px;background:#fff4de;border:1px solid #ebd9ae;border-radius:8px;color:#795d2c;font-size:14px;line-height:1.8}
.analysis-call{border-bottom:1px solid #e5ebdf;padding:13px 0;font-size:14px;overflow-wrap:anywhere}.analysis-call p{font-size:13px;line-height:1.8;margin:7px 0;color:#5b7151}
@media(max-width:640px){.analysis-dialog{padding:16px 12px;width:calc(100vw - 16px);max-width:calc(100vw - 16px)}.analysis-dialog h2{font-size:20px}.analysis-dialog-head{gap:10px}.analysis-block{padding:10px}.analysis-group{padding-left:8px}.analysis-block>summary{font-size:14px}.analyze-button{min-height:42px}}
.analysis-expressions>summary{font-size:13px}.analysis-expressions code{font:13px/1.7 Consolas,monospace;color:#385638;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:640px){.analysis-group .analysis-group .analysis-group{padding-left:0;border-left:0}.analysis-group .analysis-group .analysis-block{padding:10px 0;border-right:0;border-left:0}}
.analysis-block>summary::before{content:'▾';color:#6c8c52}.analysis-block:not([open])>summary::before{content:'▸'}