/* Customer guide. The original scene, materials and visual language stay intact. */
.workspace{grid-template-columns:minmax(0,1fr) 322px;align-items:start}
.stage{position:sticky;top:12px}
.inspector{padding-left:25px;padding-right:10px;min-height:0;max-height:clamp(540px,66vh,760px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#dce2d2 transparent}
.stage .layers-control{position:absolute;left:24%;right:24%;bottom:75px;top:auto!important;padding:0;z-index:5;background:#ffffffeb}
.stage .layer-key{bottom:135px}
.explorer-top{display:flex;align-items:center;justify-content:space-between;padding:8px 0 14px;border-bottom:1px solid var(--line);gap:8px;position:sticky;top:-23px;background:#fff;z-index:3}
.explorer-top .eyebrow{font-size:9px;letter-spacing:1.4px}
#open-notebook{display:flex;align-items:center;gap:7px;padding:5px 0;font-size:11px;white-space:nowrap}
#question-count{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;font-size:10px;background:#edf0e7;color:#637252}
.inspector-heading{padding-top:18px}
.inspector-heading>.eyebrow{display:none}
.inspector-heading #reset-all{margin-left:auto}
.selected-info{padding:10px 0 20px;min-height:0!important}
.selected-info>p:last-child{max-width:none;font-size:12px;line-height:1.65;min-height:0}
.detail-number{font-size:9px;letter-spacing:1.2px;line-height:1.6}
h2{font-size:25px}
.guide-label{font-size:9px;letter-spacing:1.5px;color:var(--muted);margin:2px 0 10px}
.guide-home{margin-bottom:15px}
.route-choice{display:flex;width:100%;align-items:center;text-align:left;gap:11px;padding:12px 0;border-bottom:1px solid var(--line)}
.route-symbol{font-size:23px;width:22px;color:#8c967a;flex-shrink:0}
.route-choice strong{display:block;font-size:12px;font-weight:500;line-height:1.4}
.route-choice small{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.route-arrow{margin-left:auto;color:#8f9981;font-size:17px}
.route-choice:hover{background:#f8f9f4}
.topics-heading{display:flex;justify-content:space-between;align-items:center;margin:23px 0 0;font-size:10px;color:var(--muted)}
#discovery-count{font-size:9px;color:#858e78}
.part-row.was-opened .part-arrow{color:#758765;font-size:12px}
.quick-actions{padding-bottom:15px}
.back-to-topics{font-size:11px;color:var(--muted);padding:17px 0 3px;text-align:left}
.inspector[data-topic]:not([data-topic=""]) .inspector-heading{display:none}
.inspector[data-topic]:not([data-topic=""]) .selected-info{padding-top:13px}
.inspector[data-topic]:not([data-topic=""]) .detail-extra{display:none!important}
.inspector[data-topic]:not([data-topic=""]) .quick-actions{display:none}
.topic-benefit{border-left:2px solid #c6cdbb;padding:0 0 0 12px;margin:0 0 20px}
.topic-benefit p{font-size:12px;line-height:1.7;color:#6b7163;margin:0 0 9px}
.model-action{font-size:11px;padding:4px 0;display:flex;gap:14px;align-items:center;color:#62794b;text-align:left}
.model-action span{font-size:16px}
.topic-tabs{display:flex;gap:20px;border-bottom:1px solid var(--line);margin-bottom:6px}
.topic-tabs button{font-size:12px;padding:12px 0;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--muted)}
.topic-tabs button[aria-selected=true]{border-bottom-color:#899678;color:#45513b}
.element-card{border-bottom:1px solid var(--line)}
.element-heading{display:flex;align-items:center;width:100%;gap:9px;text-align:left;padding:13px 0;font-size:12px;line-height:1.5}
.element-index{font-size:9px;color:#9aa08e;flex-shrink:0}
.element-sign{margin-left:auto;font-size:16px;font-weight:300;color:#8b987b}
.element-card.is-active .element-heading{color:#526b3f}
.element-body{padding:0 0 14px 22px}
.element-body p{font-size:12px;line-height:1.75;color:#697060;margin:0 0 12px}
.look-closely{font-size:11px;line-height:1.7;color:#717866}
.look-closely>span{display:block;font-size:8px;letter-spacing:1.1px;text-transform:uppercase;color:#96a187;margin-bottom:3px}
.element-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0}
.element-tools button{font-size:10px;text-align:left;padding:8px 0;color:#6b8056}
.element-tools button[aria-pressed=true]{color:#343f2c;font-weight:550}
#clear-element{color:#8b9181}
.choice-intro{font-size:11px;line-height:1.7;color:var(--muted);margin:15px 0 10px}
.question-option{display:flex;align-items:flex-start;gap:10px;text-align:left;width:100%;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.6}
.question-symbol{display:grid;place-items:center;width:21px;height:21px;flex-shrink:0;border:1px solid #d9dece;border-radius:3px;color:#869873;font-size:14px;margin-top:1px}
.question-option[aria-pressed=true] .question-symbol{color:white;background:#88997a;border-color:#88997a}
.question-option[aria-pressed=true]{color:#597145}
#topic-faq{margin-top:24px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{font-size:11px;line-height:1.6;display:flex;align-items:flex-start;gap:10px;list-style:none;padding:11px 0;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}.faq-item summary>span{margin-left:auto;color:#8b9780}
.faq-item[open] summary>span{transform:rotate(45deg)}
.faq-item p{font-size:11px;line-height:1.75;color:var(--muted);margin:0 0 14px}
#topic-source a{display:inline-block;font-size:9px;color:#879079;margin-top:14px;text-decoration:none}
.topic-takeaway{margin-top:23px;padding:15px 0;border-top:1px solid var(--line)}
.topic-takeaway>span{font-size:8px;letter-spacing:1.3px;color:#949d87;text-transform:uppercase}
.topic-takeaway p{font-size:12px;line-height:1.65;color:#707963;margin:7px 0 0}
.topic-navigation{display:flex;align-items:center;gap:10px;margin:2px 0 14px}
.topic-navigation button{min-height:38px;border:1px solid var(--line);border-radius:3px;font-size:11px}
#previous-topic{width:37px;flex-shrink:0;font-size:16px}
#next-topic{flex:1;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 10px;line-height:1.5;color:#5f7450}
.route-status{padding:15px 0 4px;border-bottom:1px solid var(--line)}
.route-status>div:first-child{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:11px;color:#63764f}
.route-status button[data-exit-route]{font-size:20px;color:#99a08f;padding:0 3px}
.route-progress{display:flex;gap:7px;margin:8px 0 9px}
.route-progress button{flex:1;padding:4px 0;text-align:left;font-size:9px;color:#919a87}
.route-progress i{display:block;height:2px;background:#e8ecdf;margin-bottom:6px}.route-progress i.filled{background:#879873}
.route-progress button[aria-current=step]{color:#4f633e}
.route-status p{font-size:12px;line-height:1.75;color:#717b64;margin:10px 0}
.route-save{font-size:11px;color:#5c7745;padding:8px 0 14px}
#notebook-dialog{width:min(620px,92vw);padding:30px;max-height:88dvh}
.notebook-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.notebook-heading h2{font-size:29px;margin:11px 0 0}
#close-notebook{font-size:25px;padding:0 4px}
.notebook-intro{font-size:12px;line-height:1.75;color:var(--muted);margin:18px 0 20px}
.notebook-row{display:flex;justify-content:space-between;align-items:flex-start;border-top:1px solid var(--line);padding:14px 0;gap:17px}
.notebook-row small{font-size:9px;color:#8b987d;letter-spacing:.3px}
.notebook-row p{margin:5px 0 0;font-size:13px;line-height:1.65;overflow-wrap:anywhere}
.notebook-row button{color:#9a9f92;font-size:20px;flex-shrink:0}
.notebook-empty{padding:20px 12px 25px;text-align:center;background:#f6f7f1}
.notebook-empty>span{color:#9da78e;font-size:25px}.notebook-empty h3{font-size:17px;font-weight:450;margin:9px 0}
.notebook-empty p{font-size:12px;line-height:1.75;color:var(--muted);max-width:330px;margin:0 auto}
#custom-question-form{margin-top:23px}#custom-question-form label{display:block;font-size:11px;color:var(--muted);margin-bottom:9px}
#custom-question-form>div{display:flex;border:1px solid #dbe0d1;border-radius:3px}
#custom-question{min-width:0;flex:1;border:0;font:inherit;font-size:12px;padding:13px 11px;color:var(--ink);background:#fff}#custom-question::placeholder{color:#a1a595}
#custom-question-form button{width:42px;color:#7e9269;font-size:23px}
#notebook-message{min-height:20px;font-size:11px;color:#6e8357;line-height:1.6}
.notebook-actions{display:flex;gap:10px}.notebook-actions button{padding:12px 17px;border:1px solid #dce2d2;border-radius:3px;font-size:12px}.notebook-actions button:first-child{background:#778665;color:#fff;border-color:#778665}
#copy-fallback{width:100%;height:180px;border:1px solid #dce2d2;padding:10px;font:inherit;font-size:12px;line-height:1.6;margin-top:14px}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 348px}.inspector{padding-left:30px}}
@media(max-width:1100px) and (min-width:761px){.workspace{grid-template-columns:minmax(0,1fr) 290px}.inspector{padding-left:20px}.stage{height:580px}h2{font-size:23px}}
@media(max-width:760px){
 .workspace{display:flex}.stage{position:relative;top:0}
 .inspector{display:block;padding:22px 0;min-height:0;max-height:none;overflow:visible;width:100%}
 .workspace[data-exploring=true] .stage{position:sticky;top:0;height:310px;z-index:7;border-bottom:1px solid var(--line)}
 .workspace .stage .layers-control{left:18px;right:18px;bottom:64px}
 .workspace .stage .layer-key{bottom:117px}
 .explorer-top{padding-bottom:15px}.explorer-top .eyebrow{font-size:9px}
 .selected-info{padding:6px 0 18px}.detail-number{display:block;font-size:8px}
 .route-choice{padding:13px 0}.route-choice strong{font-size:13px}.route-choice small{font-size:11px}
 .inspector[data-topic]:not([data-topic=""]) .detail-number{display:block}
 .topic-panel{margin-top:0}.topic-benefit p,.element-body p{font-size:13px}
 .element-heading{font-size:13px;padding:14px 0}.look-closely{font-size:12px}
 .question-option{font-size:13px}.topic-tabs button{font-size:13px;padding:13px 0}
 .choice-intro,.faq-item summary,.faq-item p{font-size:12px}.element-tools button{font-size:11px}
 .topic-takeaway p{font-size:13px}.topic-navigation button{min-height:43px;font-size:12px}
 .part-list{display:grid}.quick-actions{margin:0 0 3px}
 #notebook-dialog{padding:23px 19px}.notebook-heading h2{font-size:25px}.notebook-heading .eyebrow{font-size:8px}.notebook-actions{flex-wrap:wrap}.notebook-actions button{flex:1;font-size:11px;padding:12px 10px}
 .workspace[data-mode=layers] .layers-control,.workspace[data-mode=exploded] .layers-control{z-index:6}
}