*{box-sizing:border-box}html,body{padding:0;margin:0;width:100%;height:100%;font-family:ui-sans-serif,system-ui,sans-serif;color:#253f43;background:#f8faf4}body{display:flex;flex-direction:column}header{padding:18px 26px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d3e0d8;gap:12px}h1{font-size:29px;letter-spacing:-1px;margin:3px 0}h1 span{font-size:15px;font-weight:400;letter-spacing:0;margin-left:10px;color:#6b8581}.eyebrow{font-size:10px;letter-spacing:2.2px;color:#6b8581;margin:0;font-weight:700}button,select{font:600 13px system-ui;border:1px solid #bfd0c6;border-radius:9px;padding:10px 13px;color:#274847;background:#fffef7;min-height:42px;cursor:pointer}button:hover{background:#edf2e5}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #dfab43;outline-offset:2px}main{display:grid;grid-template-columns:minmax(0,1fr) 316px;flex:1;min-height:0}.chart{position:relative;overflow:hidden;background:#fffef9;min-height:400px}#plotCanvas{position:absolute;inset:0}.chart-label{position:absolute;left:22px;top:20px;display:flex;gap:9px;align-items:center;font-size:12px;color:#446463;padding:8px 12px;background:#fffef9e6;border:1px solid #e2e9df;border-radius:40px}.dot{width:7px;height:7px;background:#6699bb;border-radius:50%}.legend{position:absolute;left:22px;bottom:22px;display:flex;gap:12px;font-size:11px;background:#fffef9e8;padding:8px 12px;border-radius:8px;color:#9b741e}.green{color:#258a53}.red{color:#c9464e}aside{padding:22px 20px;border-left:1px solid #d3e0d8;overflow:auto;background:#f0f4eb}.section-title{display:flex;justify-content:space-between;gap:4px;font-size:9px;letter-spacing:1.3px;color:#6e8580;font-weight:700;margin:2px 0 12px}.section-title:not(:first-child){margin-top:23px}.section-title output{letter-spacing:0;white-space:nowrap}.fields{display:grid;gap:6px}.fields button{text-align:left;font-size:18px;display:flex;align-items:center;gap:10px;padding:9px 12px}.fields strong{font-size:13px}.fields small{font-size:10px;margin-left:auto;color:#728881}.fields button[aria-pressed="true"]{border-color:#46756b;background:#dde9db;box-shadow:inset 3px 0 #46756b}label{font-size:12px;color:#526f69;display:block;margin-bottom:6px}select{width:100%;background:#fffef9;font-weight:500}input[type="range"]{width:100%;accent-color:#46756b}input[type="checkbox"]{accent-color:#46756b}.muted{font-size:12px;line-height:1.55;color:#6c8179}.parameter{margin:12px 0}.parameter label{display:flex;justify-content:space-between}.parameter output{font-variant-numeric:tabular-nums;color:#284b46}.readings{display:grid;grid-template-columns:1fr 1fr;margin:10px 0 17px}.readings div{display:flex;flex-direction:column}.readings output{font-size:28px;letter-spacing:-1px;font-variant-numeric:tabular-nums}.readings span{font-size:11px;color:#71857a}.actions{display:grid;grid-template-columns:1fr auto;gap:7px}.primary{background:#315f54;border-color:#315f54;color:white}.primary:hover{background:#244d44}.options{display:flex;gap:17px;margin:15px 0}.options label{display:flex;align-items:center;gap:5px;font-size:11px}.wide{width:100%}.record{font-size:12px;font-weight:600;color:#8e702d;line-height:1.5}.credit{font-size:10px;line-height:1.6;color:#809084;border-top:1px solid #d4dfce;padding-top:13px}.credit button{display:block;padding:0;border:0;background:none;min-height:32px;font-size:10px;text-decoration:underline;color:#607a6d}#toast{position:absolute;top:72px;left:22px;max-width:310px;background:#315f54;color:white;padding:15px 18px;border-radius:12px;box-shadow:0 8px 25px #315f5422;font-size:13px;line-height:1.5}#toast[hidden]{display:none}dialog{max-width:min(600px,92vw);max-height:85vh;border:1px solid #c5d3c2;border-radius:18px;padding:28px;background:#fffef9;color:#294c46;line-height:1.65;box-shadow:0 30px 100px #183c4344}dialog::backdrop{background:#213e4c88}h2{font-size:25px;letter-spacing:-.5px;margin-top:0}li{margin:11px 0}form{text-align:right}@media(max-width:760px){header{padding:13px 16px}h1{font-size:23px}h1 span{font-size:12px;display:block;margin:0}.eyebrow{font-size:8px}main{display:flex;flex-direction:column;overflow:auto}.chart{height:52vh;min-height:370px;flex-shrink:0}aside{overflow:visible;border-left:0;border-top:1px solid #d3e0d8}.fields{grid-template-columns:repeat(3,1fr)}.fields button{display:block;text-align:center;font-size:19px;padding:7px 3px}.fields strong{display:block;font-size:11px}.fields small{display:block;font-size:9px}.legend{left:12px;bottom:12px;gap:8px;font-size:10px}.chart-label{left:12px;top:12px;font-size:10px}#toast{top:55px;left:12px}dialog{padding:20px}}
