*{box-sizing:border-box}body{margin:0;background:#f2efe5;color:#283e46;font:16px/1.55 system-ui}main{max-width:1120px;margin:auto;padding:30px 20px}h1,h2,h3{font-family:Georgia,serif;line-height:1.15}h1{font-size:clamp(48px,8vw,86px);margin:10px 0}h2{font-size:26px}.eyebrow{letter-spacing:.16em;font-size:12px}section{background:#fffdf7;border:1px solid #d8d9cd;border-radius:20px;padding:24px;margin:22px 0}button,select{font:inherit;color:inherit;border:1px solid #a2aea3;border-radius:9px;padding:12px;background:#fffdf7;cursor:pointer}button:hover,button:focus-visible{background:#dce9dc;outline:2px solid #32665c}button:disabled{opacity:.5;cursor:default}.actions,.editor,.chips{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.scenarios{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.scenario{display:flex;align-items:center;gap:12px;text-align:left;padding:8px}.scenario.active{border:2px solid #32665c;background:#edf0e3}.art{width:70px;height:70px;background-image:url('instruments.webp');background-size:200% 200%;border-radius:10px;flex-shrink:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{padding:15px;background:#e5e8db;border-radius:12px}.stat strong{display:block;font:700 27px Georgia}.stat small{font-size:11px}#feedback{border-left:4px solid #b87440;background:#eae7d8;padding:14px}svg{width:100%;display:block;min-height:210px}.note,footer{font-size:13px;color:#52615c}footer{padding:25px 0}.chapter{border-left:5px solid;padding:8px 15px;margin:10px 0;background:#f4f2e9}.chips button.active{background:#285e57;color:white}.readings{display:flex;flex-wrap:wrap;gap:12px;font-size:13px}#certify{background:#285e57;color:white;margin-top:15px}#result{background:#e1ecdf}summary{cursor:pointer;padding:16px 0}.editor label{width:100%}@media(max-width:650px){main{padding:20px 12px}section{padding:17px}.scenarios{grid-template-columns:1fr 1fr}.scenario{display:block;font-size:14px}.art{width:65px;height:65px}.stats{grid-template-columns:1fr 1fr}.editor button{flex:1;min-width:130px}.editor select{width:100%}h2{font-size:23px}}

#chart{overflow-x:auto} @media(max-width:650px){#chart svg{min-width:650px}.note::after{content:" Swipe the plot sideways to inspect all reading numbers, or open exact values below."}}
