/* Quiet, native controls; the example responds to the reader, never autoplays. */
.reader-lab{background:#fff;border:1px solid #d4ddca;border-top:3px solid #496936;border-radius:5px;padding:28px;margin:38px 0;color:#20261c}
.lab-heading{display:flex;justify-content:space-between;gap:15px;font-size:11px;color:#58674d;margin-bottom:16px}
.reader-lab h2{font-size:27px;line-height:1.3;margin:0 0 12px;letter-spacing:-.65px}
.reader-lab .lab-intro{font-size:15px;line-height:1.75;color:#4c5843;margin:0 0 20px}
.lab-presets{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px}
.lab-presets button{font:500 12px/1.4 'DM Sans',sans-serif;min-height:40px;padding:9px 13px;border:1px solid #cad5bf;background:#f4f7ee;border-radius:4px;color:#32442a;cursor:pointer}
.lab-presets button:hover{border-color:#496936;background:#eaf0df}.lab-presets [data-lab-reset]{margin-left:auto;background:#fff}
.reader-lab :focus-visible{outline:3px solid #c75a31;outline-offset:3px}
.lab-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px}
.lab-control{min-width:0}.lab-control label{display:block;font-size:12px;line-height:1.5;font-weight:600;margin-bottom:8px}
.lab-control input[type=number],.lab-control select{width:100%;min-height:44px;padding:9px 12px;border:1px solid #b8c5ad;border-radius:4px;background:#fff;font:500 17px/1.4 'DM Sans',sans-serif;color:#20261c}
.lab-control select{font-size:14px}
.lab-control input[aria-invalid=true]{border-color:#a13225}.lab-slider{display:block;width:100%;margin:10px 0 0;min-height:26px;accent-color:#496936;cursor:pointer}
.lab-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:25px 0}
.lab-metric{border-top:1px solid #dce1d6;padding-top:14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.lab-metric span{font-size:12px;line-height:1.5;color:#58674d}.lab-metric strong{font:700 24px/1.3 Manrope,sans-serif;overflow-wrap:anywhere}
.reader-lab .lab-figure{margin:20px 0 15px;background:#f6f8f1;padding:20px 16px;border-radius:4px}
.lab-chart svg{width:100%;height:auto;display:block;overflow:visible}.lab-figure figcaption{margin-top:14px;font-size:12px;line-height:1.65;color:#526045}
.lab-bar-row{display:grid;grid-template-columns:minmax(75px,1fr) minmax(60px,1.3fr) minmax(75px,1fr);gap:12px;align-items:center;margin:14px 0;font-size:11px;line-height:1.5}
.lab-bar-row b{font-size:12px;text-align:right;overflow-wrap:anywhere}.lab-track{height:12px;background:#e2e8d9;border-radius:2px;overflow:hidden}.lab-track i{display:block;height:100%;background:#55753a;transition:width .2s ease}.lab-track .negative{background:#a54832}
.lab-track.signed{position:relative}.lab-track.signed:after{content:'';position:absolute;left:50%;top:0;height:100%;border-left:1px solid #6b755e}.lab-track.signed i{position:absolute}
.reader-lab .lab-explanation,.reader-lab .lab-fallback{font-size:14px;line-height:1.8;margin:18px 0;color:#37472e}
.lab-data{margin:18px 0}.lab-data summary{font-size:12px;cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:8px 0;min-height:40px}
.lab-data>div{overflow-x:auto}.lab-data table{width:100%;border-collapse:collapse;margin:10px 0;font-size:12px;line-height:1.65}.lab-data caption{text-align:left;padding:8px 0;color:#536149}.lab-data th,.lab-data td{padding:8px;border-bottom:1px solid #dce1d6;text-align:left}.lab-data tbody th{font-weight:500}
.reader-lab .calc-note{font-size:12px;line-height:1.8;margin:18px 0 0;padding-top:16px;border-top:1px solid #dce1d6;color:#58674d}
.reader-lab .lab-error{font-size:13px;line-height:1.7;color:#9b3020;margin:18px 0}
@media(max-width:650px){.reader-lab{padding:21px 16px}.reader-lab h2{font-size:24px}.lab-controls{gap:18px 15px}.lab-control label{min-height:36px}.lab-heading{font-size:10px}.lab-presets button{min-height:44px}.lab-metric strong{font-size:22px}.reader-lab .lab-figure{padding:16px 10px}.lab-bar-row{gap:8px;grid-template-columns:minmax(66px,1fr) minmax(36px,1fr) minmax(66px,1fr)}}
@media(max-width:360px){.lab-controls{grid-template-columns:1fr}.lab-control label{min-height:0}.lab-results{gap:12px}.lab-metric strong{font-size:20px}}
@media(prefers-reduced-motion:reduce){.lab-track i{transition:none}}

.lab-chart-key{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;line-height:1.7;margin-top:14px}.lab-colour-note{font-size:12px!important;line-height:1.7!important;margin:10px 0 0!important;color:#526045}

.lab-control:has(select){grid-column:1/-1}.lab-control:has(select) label{min-height:0}.lab-bar-row{font-size:12px}
