:root { --paper:#f6f5ef;--white:#fffefa;--ink:#21382f;--body:#475950;--muted:#55645a;--line:#dfe3d9;--forest:#1d382e;--green:#466e54;--lime:#d5e7a8;--copper:#b86942;--amber:#a0652f;--serif:Georgia,'Times New Roman',serif;--sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif }
* { box-sizing:border-box }
body { margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6 }
button,input,textarea,select { font:inherit }
button,a,input,textarea,select { -webkit-tap-highlight-color:transparent }
button { cursor:pointer }
a { color:inherit }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid #91ad6b;outline-offset:4px }
[hidden] { display:none!important }
.sidebar { width:246px;position:fixed;inset:0 auto 0 0;background:var(--forest);color:#f3f4e9;padding:35px 23px;display:flex;flex-direction:column;z-index:10 }
.brand { display:flex;gap:12px;align-items:center;text-decoration:none;font-size:23px;letter-spacing:-1px;font-weight:650;line-height:1.2 }
.brand svg { width:39px;height:44px;stroke:var(--lime);fill:none;stroke-width:1.4;flex-shrink:0 }
.brand-light { font-weight:300 }
.brand small { display:block;font-size:11px;letter-spacing:1px;font-weight:500;margin-top:8px;color:#c9d6ca }
.sidebar-label { font-size:12px;letter-spacing:1px;color:#b4c6b8;margin:53px 13px 13px }
nav { display:flex;flex-direction:column;gap:7px }
.nav-item { border:0;color:#c1d0c5;background:transparent;text-align:left;padding:13px 12px;border-radius:5px;display:flex;align-items:center;font-size:15px;gap:10px;width:100%;line-height:1.5 }
.nav-item:hover { background:#2b463a }
.nav-item.active { background:#d5e7a8;color:#24372b }
.nav-number { font-size:12px;font-variant-numeric:tabular-nums;opacity:.55 }
.sidebar-bottom { margin-top:auto;padding:28px 11px 0 }
.status-dot-line { font-size:13px;color:#b9cabb;display:flex;align-items:center;gap:8px }
.dot { background:var(--lime);height:5px;width:5px;border-radius:50% }
.sidebar-bottom p { font-family:var(--serif);font-size:21px;font-weight:normal;line-height:1.45;color:#dce5d6;margin:23px 0 }
.sidebar-version { border-top:1px solid #486052;padding-top:17px;color:#b4c6b8;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.5px }
.workspace { margin-left:246px }
.topbar { height:70px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 46px;font-size:12px;letter-spacing:1px;color:var(--muted) }
.crumb { margin:0 15px;color:#5f6b5b }
main { max-width:1460px;margin:auto;padding:43px 46px 0 }
.page-heading { display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:27px }
.eyebrow { font-size:12px;letter-spacing:1px;font-weight:650;color:var(--muted);line-height:1.6 }
h1 { font-size:clamp(38px,4.25vw,64px);font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-2.2px;margin:17px 0 19px }
h1 em { font-weight:400;color:#6c8061 }
h2 { font-family:var(--serif);font-size:25px;font-weight:400;line-height:1.25;letter-spacing:-.5px;margin:7px 0 13px }
.lede { max-width:610px;color:var(--body);font-size:16px;line-height:1.8;margin:0 }
.heading-mark { flex:0 0 178px;width:178px;height:178px;border:1px solid #d7dfce;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle,#e9eddf 0,#f6f5ef 70%);position:relative }
.heading-mark:before,.heading-mark:after { position:absolute;content:'';width:210px;height:1px;background:#dce3d3;transform:rotate(-32deg) }
.heading-mark:after { transform:rotate(32deg) }
.heading-mark span { font-family:var(--serif);font-size:90px;line-height:1;z-index:1;font-style:italic;color:#77906b }
.heading-mark small { z-index:1;font-size:11px;letter-spacing:1px;margin-top:11px }
.notice { border:1px solid #e5dfce;background:#f5f0e3;display:flex;align-items:center;gap:15px;padding:12px 16px;border-radius:5px;margin:17px 0;color:#5c563f;font-size:14px;line-height:1.6 }
.notice p { margin:0 }
.badge { display:inline-flex;align-items:center;font-size:11px;font-weight:700;letter-spacing:1px;line-height:1.5;padding:5px 7px;border-radius:3px;white-space:nowrap;flex-shrink:0 }
.badge.amber { background:#eaddc2;color:#7a5220 }
.badge.green { background:#e3ebd8;color:#3f5739 }
.badge.neutral { background:#e6e9df;color:#55604f }
.control-bar { display:flex;align-items:flex-end;gap:14px;margin:24px 0 }
.control-bar label { font-size:13px;font-weight:600;color:#53655a;display:flex;flex-direction:column;gap:5px }
.control-bar input { width:112px;height:40px }
.control-bar .noise-label { position:relative }
.control-bar .noise-label input { width:178px }
.input-suffix { font-weight:400;color:#5a6558;font-size:12px;position:absolute;top:0;left:70px;white-space:nowrap }
.button { border:1px solid transparent;border-radius:4px;display:inline-flex;gap:15px;align-items:center;justify-content:center;padding:10px 16px;min-height:40px;font-size:14px;font-weight:600;white-space:nowrap;text-decoration:none }
.button.primary { background:var(--forest);color:#f1f4e8 }
.button.primary:hover { background:#34573e }
.button.secondary { background:var(--white);border-color:#cbd5c5;color:var(--ink) }
.button.secondary:hover { background:#edf1e5 }
.button.quiet { background:transparent;color:#596c5b;border-color:transparent }
.button.quiet:hover { background:#ecefe5 }
button:disabled { opacity:.45;cursor:default }
.control-bar .quiet { margin-left:auto }
.message { font-size:15px;margin:12px 0;min-height:0;color:var(--body) }
.message:empty { display:none }
.message.error { background:#f6e8df;border:1px solid #e5cbbb;color:#8a4426;padding:13px 16px;border-radius:5px }
.message.loading { font-style:italic }
.scenario-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0 }
.scenario-card { background:var(--white);border:1px solid var(--line);border-radius:6px;padding:17px;text-align:left;color:var(--ink);position:relative;min-height:170px;display:flex;flex-direction:column }
.scenario-card:hover { border-color:#9aaf8c }
.scenario-card.selected { border-color:var(--forest);box-shadow:0 0 0 1px var(--forest);background:#f0f4e8 }
.scenario-number { font-size:11px;color:#5f6b5b;letter-spacing:1px;margin-bottom:8px;display:flex;justify-content:space-between }
.scenario-card.selected .scenario-number:after { content:'●';color:var(--forest);font-size:11px }
.scenario-name { font-size:15px;font-weight:600;line-height:1.5;min-height:36px }
.scenario-value { font-family:var(--serif);font-size:29px;line-height:1.3;margin:12px 0 2px }
.scenario-value small { font-size:15px }
.scenario-bottom { margin-top:auto;display:flex;justify-content:space-between;font-size:11px;color:#5a6856;letter-spacing:.3px }
.scenario-bottom span:last-child { color:#4b6047 }
.bench-grid { display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;margin:0 0 18px }
.panel { border:1px solid var(--line);background:var(--white);border-radius:6px;padding:24px }
.panel-heading { display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px }
.panel-heading h2 { margin-bottom:0 }
.small-tag { font-size:11px;letter-spacing:1px;padding:5px 7px;border:1px solid var(--line);color:var(--muted);border-radius:3px;white-space:nowrap }
.legend { display:flex;align-items:center;gap:20px;color:#566350;font-size:12px;margin:18px 0 5px;flex-wrap:wrap }
.legend>span { display:inline-flex;align-items:center;gap:6px }
.line { display:inline-block;width:17px;border-top:2px solid var(--forest) }
.line.estimate { border-color:var(--copper);border-top-style:dashed }
.chart { width:100%;min-height:245px }
.chart svg { width:100%;height:auto;display:block;overflow:visible }
.chart-empty { height:245px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:15px }
.chart-caption { font-size:14px;line-height:1.7;color:#586352;margin:8px 0 0 }
.rank-panel { background:#edf1e6 }
.rank-panel h2 { font-size:24px;margin:15px 0 }
.rank-value { font-family:var(--serif);line-height:1;margin:25px 0 14px }
.rank-value>span:first-child { font-size:67px }
.rank-total { font-size:28px;color:#6a7660;margin-left:7px }
.rank-bars { display:flex;gap:6px }
.rank-bars i { height:6px;background:#d9dfce;border-radius:2px;flex:1 }
.rank-bars i.filled { background:var(--forest) }
.rank-state { font-size:14px;font-weight:650;margin-top:15px }
.rank-panel>p { font-size:14px;line-height:1.7;color:#566350 }
.condition { display:flex;justify-content:space-between;border-top:1px solid #d8dfce;margin-top:20px;padding-top:13px;font-size:13px }
.condition strong { font-weight:600 }
.microcopy { font-size:13px!important;line-height:1.7;color:#566350 }
.metamer-panel { display:grid;grid-template-columns:260px minmax(0,1fr);gap:35px;margin:18px 0 }
.metamer-copy h2 { font-size:27px;margin:13px 0 }
.metamer-copy p { font-size:14px;color:var(--muted);line-height:1.7 }
.metamer-stats { display:flex;gap:25px;margin-top:21px }
.metamer-stats strong { display:block;font-size:17px;font-family:var(--serif);font-weight:400 }
.metamer-stats span { font-size:11px;color:#5f6753 }
.small-chart { min-height:210px }
.notes { border-top:1px solid var(--line);padding:15px 0;font-size:14px;color:#586450 }
.notes summary { cursor:pointer;font-weight:600;color:#5c6d55 }
.notes ul { padding-left:19px;line-height:1.8;max-width:1000px }
.notes li { margin:6px 0 }
footer { display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin:30px 0 0;padding:22px 0;font-size:11px;letter-spacing:.7px;color:#5f6b5b }
.compact h1 { font-size:55px }
.upload-panel { margin:25px 0 }
.upload-panel>p { font-size:15px;color:var(--muted);max-width:780px }
.file-row { display:flex;align-items:center;gap:15px;margin:22px 0 15px;font-size:14px;color:var(--muted) }
.file-button { position:relative;cursor:pointer;overflow:hidden }
.file-button input { position:absolute;inset:0;width:100%;opacity:0;cursor:pointer }
.file-button:focus-within { outline:3px solid #91ad6b;outline-offset:3px }
.field-label { font-size:14px;color:var(--body);display:block;margin-bottom:6px;font-weight:600 }
input,textarea,select { border:1px solid #d3dbcb;border-radius:4px;background:#fffefa;color:var(--ink);padding:9px 11px }
input::placeholder,textarea::placeholder { color:#75806f }
textarea { display:block;width:100%;resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.8 }
.form-footer { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:18px }
.section-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;margin:34px 0 17px }
.section-heading h2 { margin:5px 0 0 }
.table-panel { padding:0;overflow:hidden }
.table-scroll { overflow:auto }
table { width:100%;border-collapse:collapse;text-align:left;font-size:14px;white-space:nowrap }
th { font-size:12px;font-weight:650;color:#546549;background:#edf1e6;padding:17px 18px;vertical-align:top }
th small { display:block;font-weight:400;font-size:11px;margin-top:3px }
td { padding:18px;border-top:1px solid var(--line) }
td:first-child { font-weight:650 }
td small { display:block;font-size:12px;color:var(--muted);margin-top:3px }
.notice.subtle { background:#edf1e7;border-color:#dde4d3;color:#566548 }
.hash { overflow-wrap:anywhere;font:12px/1.8 ui-monospace,monospace }
.capture-grid { display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;margin-top:30px }
.capture-grid form>label,.form-grid>label { display:flex;flex-direction:column;gap:7px;font-size:14px;color:#5c6e55;font-weight:600;margin-bottom:18px }
.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:0 18px }
.capture-grid input,.capture-grid select { width:100%;min-width:0;font-size:14px }
.capture-grid textarea { font-family:var(--sans);font-weight:400 }
.capture-grid form>.button { margin-top:10px }
.field-checklist { background:#edf1e6 }
.field-checklist h2 { font-size:26px;margin:15px 0 25px }
.field-checklist ol { counter-reset:steps;list-style:none;padding:0;margin:0 }
.field-checklist li { position:relative;padding-left:31px;margin:0 0 24px;counter-increment:steps }
.field-checklist li:before { content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:0;color:#6a7660;font-size:13px }
.field-checklist strong { display:block;font-weight:600;font-size:14px }
.field-checklist li span { display:block;font-size:13px;color:#566350;line-height:1.8;margin-top:6px }
#manifest-result { margin-top:20px }
pre { white-space:pre-wrap;overflow-wrap:anywhere;background:#f2f4ec;border:1px solid #e1e7d8;border-radius:4px;padding:18px;max-height:400px;overflow:auto;font-size:13px;line-height:1.8 }
.warning-list { font-size:14px;color:#95633c;line-height:1.8 }
.clean-list { padding:0;list-style:none;font-size:14px;line-height:1.7;color:var(--muted) }
.clean-list li { border-top:1px solid var(--line);padding:10px 0 }
.clean-list li:last-child { padding-bottom:0 }
.source-link { font-size:13px;color:var(--forest);text-decoration:none;margin-top:auto;padding-top:18px }
.source-link:hover { text-decoration:underline }
@media(min-width:1600px) {
  main { padding-top:52px }
  .page-heading { margin-bottom:32px }
  .bench-grid { grid-template-columns:minmax(0,1fr) 295px }
  .scenario-card { min-height:182px }
  .metamer-panel { grid-template-columns:310px minmax(0,1fr) }
}
@media(max-width:1200px) {
  .sidebar { width:214px;padding:30px 16px }
  .workspace { margin-left:214px }
  .topbar { padding:0 30px }
  main { padding:32px 30px 0 }
  .brand { font-size:21px;gap:8px }
  .brand svg { width:34px }
  .nav-item { font-size:14px;padding:12px 9px;gap:8px }
  .heading-mark { width:145px;height:145px;flex-basis:145px }
  .heading-mark:before,.heading-mark:after { width:165px }
  .heading-mark span { font-size:75px }
  .scenario-card { padding:14px;min-height:173px }
  .scenario-name { font-size:14px }
  .bench-grid { grid-template-columns:minmax(0,1fr) 240px;gap:14px }
  .panel { padding:20px }
  .rank-panel h2 { font-size:22px }
  .metamer-panel { grid-template-columns:220px minmax(0,1fr);gap:20px }
  .capture-grid { grid-template-columns:minmax(0,1fr) 250px;gap:16px }
  .table-panel { padding:0 }
}
@media(max-width:1000px) {
  .sidebar { width:190px;padding:25px 12px }
  .workspace { margin-left:190px }
  .brand { font-size:19px }
  .brand small { font-size:11px;letter-spacing:1px }
  .sidebar-label { margin-top:42px }
  .nav-item { font-size:13px;gap:7px }
  .nav-number { font-size:11px }
  .sidebar-bottom { padding:24px 9px 0 }
  .sidebar-bottom p { font-size:18px }
  .status-dot-line { font-size:12px }
  .sidebar-version { font-size:11px }
  .topbar { padding:0 24px }
  main { padding:30px 24px 0 }
  .heading-mark { display:none }
  .scenario-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .scenario-card { min-height:155px }
  .scenario-name { min-height:0;font-size:15px }
  .scenario-value { margin-top:10px }
  .scenario-bottom { margin-top:7px }
  .bench-grid { grid-template-columns:1fr }
  .rank-panel { display:grid;grid-template-columns:1fr 1fr;column-gap:30px }
  .rank-panel>.eyebrow { grid-column:1/-1 }
  .rank-panel h2 { grid-column:1;grid-row:2 }
  .rank-value { grid-column:2;grid-row:2;margin:0;align-self:center }
  .rank-bars { grid-column:2;grid-row:3;align-self:center }
  .rank-state { grid-column:1;grid-row:3;margin:0 }
  .rank-panel>p { grid-column:1/-1 }
  .rank-panel .condition { grid-column:1/-1;margin-top:8px }
  .metamer-panel { grid-template-columns:1fr }
  .metamer-copy { display:grid;grid-template-columns:1fr 1fr;column-gap:25px }
  .metamer-copy>.eyebrow { grid-column:1/-1 }
  .metamer-copy h2 { grid-column:1;grid-row:2 }
  .metamer-copy>p { grid-column:2;grid-row:2 }
  .metamer-stats { grid-column:1/-1;margin-top:2px }
  .control-bar { gap:8px;flex-wrap:wrap }
  .control-bar .quiet { margin-left:0 }
  .capture-grid { grid-template-columns:1fr }
  .field-checklist ol { display:grid;grid-template-columns:1fr 1fr;gap:0 22px }
  .compact h1 { font-size:49px }
}
@media(max-width:700px) {
  .sidebar { position:static;width:auto;padding:20px 20px 0 }
  .brand { font-size:23px }
  .brand svg { width:35px;height:36px }
  .brand small { font-size:11px;letter-spacing:1px }
  .sidebar-label,.sidebar-bottom { display:none }
  nav { flex-direction:row;overflow-x:auto;margin-top:22px;gap:5px;padding-bottom:12px }
  .nav-item { width:auto;white-space:nowrap;font-size:13px;padding:9px 11px;gap:6px }
  .workspace { margin-left:0 }
  .topbar { height:50px;padding:0 20px;font-size:11px;letter-spacing:1px }
  .crumb { margin:0 7px }
  main { padding:28px 20px 0 }
  .eyebrow { font-size:11px;letter-spacing:1px }
  h1,.compact h1 { font-size:46px;letter-spacing:-1.7px }
  .lede { font-size:15px }
  .notice { align-items:flex-start;gap:11px;font-size:13px;padding:12px }
  .badge { font-size:11px }
  .control-bar { display:grid;grid-template-columns:1fr 1fr;gap:12px }
  .control-bar input,.control-bar .noise-label input { width:100% }
  .input-suffix { position:static;font-size:11px;line-height:1;margin:-3px 0 0 }
  .control-bar .noise-label { gap:3px }
  .control-bar .quiet { justify-self:stretch }
  .scenario-grid { gap:10px;margin-top:20px }
  .scenario-card { padding:14px;min-height:157px }
  .scenario-name { font-size:14px }
  .scenario-value { font-size:28px }
  .scenario-bottom { font-size:11px }
  .panel { padding:18px }
  .panel-heading { gap:10px }
  .panel-heading h2 { font-size:22px }
  .small-tag { font-size:11px }
  .chart { min-height:190px }
  .legend { font-size:11px;gap:14px }
  .chart-caption { font-size:13px }
  .rank-panel h2 { font-size:23px }
  .rank-value>span:first-child { font-size:58px }
  .rank-total { font-size:24px }
  .metamer-copy { display:block }
  .metamer-copy h2 { font-size:26px }
  .metamer-copy p { font-size:14px }
  .metamer-stats { margin:17px 0 0 }
  .small-chart { min-height:170px }
  .notes { font-size:13px }
  footer { flex-direction:column;gap:7px;font-size:11px;margin-top:25px;padding:18px 0 }
  .upload-panel .panel-heading { align-items:flex-start;flex-direction:column }
  .upload-panel .panel-heading .button { padding:6px 0 }
  .upload-panel>p { font-size:14px }
  .form-footer { align-items:stretch;flex-direction:column;gap:12px }
  .section-heading { align-items:flex-start;gap:12px }
  .section-heading .button { font-size:12px;padding:8px 10px }
  .section-heading h2 { font-size:23px }
  .table-panel { padding:0 }
  .form-grid { grid-template-columns:1fr }
  .field-checklist ol { grid-template-columns:1fr }
  .file-row { font-size:13px }
  .capture-grid { margin-top:23px }
}
@media(prefers-reduced-motion:no-preference) {
  .button,.scenario-card,.nav-item { transition:background .15s,border-color .15s,box-shadow .15s }
  .view { animation:appear .22s ease-out }
  @keyframes appear { from{opacity:.3;transform:translateY(3px)}to{opacity:1;transform:translateY(0)} }
}
.button-group { display:flex;flex-wrap:wrap;align-items:center;gap:9px }
.calibration-metrics { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0 }
.metric-card { display:flex;flex-direction:column }
.metric-card strong { font-family:var(--serif);font-size:39px;font-weight:400;letter-spacing:-1px;line-height:1.2;margin:15px 0 7px }
.metric-card>span:last-child { font-size:13px;color:var(--muted) }
.metric-card:first-child { background:#edf1e6 }
.calibration-grid { display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 }
.table-heading { padding:21px 20px 7px }
.table-heading h2 { font-size:23px }
.diagnostic-list { display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;margin:20px 0;font-size:13px }
.diagnostic-list dt,.diagnostic-list dd { margin:0;padding:9px 0;border-bottom:1px solid var(--line) }
.diagnostic-list dt { color:var(--muted) }
.diagnostic-list dd { text-align:right;font-weight:650;font-variant-numeric:tabular-nums }
.export-bar { display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;font-size:14px;color:var(--muted) }
code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9em;background:#edf0e6;padding:2px 4px;border-radius:3px }
#calibration-alpha { font-size:14px;line-height:1.8;max-width:900px }
#calibration-input { max-height:420px }
@media(max-width:1200px) {
  .metric-card strong { font-size:33px }
  .calibration-grid { grid-template-columns:1fr }
  .export-bar { align-items:flex-start;flex-direction:column;gap:12px }
}
@media(max-width:1000px) {
  .calibration-metrics { gap:11px }
  .metric-card { padding:17px }
  .metric-card strong { font-size:29px }
  .metric-card .eyebrow { font-size:11px;letter-spacing:.7px }
  .metric-card>span:last-child { font-size:12px }
}
@media(max-width:700px) {
  .calibration-metrics { grid-template-columns:1fr }
  .metric-card { padding:18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:7px 15px }
  .metric-card strong { grid-row:1/3;grid-column:2;font-size:31px;margin:0 }
  .metric-card .eyebrow { grid-column:1;grid-row:1;font-size:11px }
  .metric-card>span:last-child { grid-column:1;grid-row:2;font-size:12px }
  .calibration-grid { gap:15px }
  .table-heading { padding:18px 17px 5px }
  .calibration-grid th,.calibration-grid td { padding:14px }
  .diagnostic-list { font-size:12px;gap:0 12px }
  .export-bar .button-group { width:100% }
  .export-bar .button { flex:1;padding:10px;font-size:12px }
  .button-group { gap:7px }
  .form-footer .button-group { justify-content:flex-end }
  #view-calibration .section-heading h2 { font-size:24px;max-width:320px }
}
.uncertainty-control { display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:22px;align-items:center;border-top:1px solid var(--line);padding-top:20px;margin-top:20px }
.uncertainty-control label { display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:600;color:var(--body) }
.uncertainty-control select { width:100%;font-size:14px;min-height:42px;background:#fffefa }
.uncertainty-control p { font-size:14px;line-height:1.8;color:var(--muted);margin:0 }
.interval-notes { font-size:14px;line-height:1.8;color:#6b5a35;background:#f5f0e3;border-left:3px solid #c5ac76;padding:12px 18px 12px 32px;margin:17px 0 24px }
.interval-notes:empty { display:none }
.interval-notes li+li { margin-top:8px }
td .interval-unavailable { white-space:normal;max-width:230px;min-width:150px;color:#8a5a33;line-height:1.65;margin-top:8px }
.empty-table { white-space:normal;color:var(--muted);font-size:14px }
.validation-metrics .metric-card strong { font-variant-numeric:tabular-nums }
#validation-unmatched-note { overflow-wrap:anywhere }
#validation-paired-summary { grid-template-columns:minmax(0,1fr) auto }
#validation-paired-summary dd { white-space:nowrap }
#validation-specimen-table td:first-child,#validation-session-table td:first-child,#validation-paired-table td:first-child { max-width:300px;overflow-wrap:anywhere;white-space:normal }
@media(max-width:900px) {
  .uncertainty-control { grid-template-columns:1fr;gap:12px }
  .uncertainty-control label { max-width:400px }
  .validation-metrics .metric-card strong { font-size:29px }
}
@media(max-width:700px) {
  .uncertainty-control { gap:12px;padding-top:16px;margin-top:16px }
  .uncertainty-control p,.interval-notes { font-size:13px }
  .uncertainty-control label { font-size:13px;max-width:none }
  .uncertainty-control select { font-size:13px }
  .interval-notes { padding:12px 15px 12px 29px }
  .validation-metrics .metric-card strong { font-size:31px }
}

/* v0.3: readable type, the Findings page, the phone test. */
:root { --series-1: #1f7a54; --series-2: #c2622a; --series-3: #2f77b5; }
html { -webkit-text-size-adjust: 100%; }
body { font-size: 15px; }
.brand { font-size: 24px; }
.research-tag { white-space: normal; text-align: right; line-height: 1.4; max-width: 340px; }
.topbar { min-height: 70px; height: auto; gap: 16px; padding-top: 10px; padding-bottom: 10px; }
.lede { font-size: 16px; line-height: 1.7; max-width: 720px; }
.lede + .lede { margin-top: 12px; }
.control-bar select { height: 40px; min-width: 190px; }
.source-label select { width: 100%; }
.segmented { display: inline-flex; border: 1px solid #cbd5c5; border-radius: 4px; overflow: hidden; flex-shrink: 0; }
.segment { border: 0; background: var(--white); color: var(--ink); padding: 8px 14px; font-size: 13px; font-weight: 600; }
.segment + .segment { border-left: 1px solid #cbd5c5; }
.segment.active { background: var(--forest); color: #f1f4e8; }
.example-name { font-size: 14px; color: var(--body); margin: 0 0 6px; overflow-wrap: anywhere; }
.bench-grid { grid-template-columns: minmax(0, 1fr) 300px; }
.rank-panel .diagnostic-list { margin: 16px 0 0; }
.rank-bars { flex-wrap: nowrap; }
.scenario-bottom { gap: 8px; flex-wrap: wrap; }
.notice.safety { background: #f6e8df; border-color: #e5cbbb; color: #6f3a22; font-size: 15px; }
.notice.safety .badge { background: #8a4426; color: #fff; }
.notice.safety p { font-weight: 600; }
.findings-heading h1 { font-size: clamp(34px, 4.4vw, 56px); letter-spacing: -1.4px; }
.stat-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 22px 0 10px; }
.stat-tile { display: flex; flex-direction: column; gap: 6px; padding: 20px; }
.stat-tile strong { font-family: var(--serif); font-size: 36px; font-weight: 400; line-height: 1.1; letter-spacing: -1px; }
.stat-tile span { font-size: 14px; color: var(--body); line-height: 1.4; }
.stat-note { font-size: 13px; color: var(--muted); }
.all-tests { margin-top: 18px; }
.all-tests summary { cursor: pointer; font-family: var(--serif); font-size: 22px; }
.tiles-note { margin: 8px 0 26px; max-width: 900px; }
.finding-list { display: flex; flex-direction: column; gap: 18px; }
.finding h2 { font-size: 27px; margin: 8px 0 12px; }
.finding-copy { max-width: 780px; }
.finding-copy p { margin: 0 0 12px; font-size: 15px; line-height: 1.7; color: var(--body); }
.chart-title { font-size: 14px; font-weight: 650; color: var(--ink); margin: 18px 0 6px; }
.finding-chart { width: 100%; min-height: 80px; }
.finding-caveat { margin: 12px 0 0; max-width: 780px; }
.chart-wrap { position: relative; width: 100%; }
.chart-wrap svg { display: block; max-width: 100%; height: auto; overflow: visible; font-family: var(--sans); }
.chart-mark:hover, .chart-mark:focus { opacity: .85; }
.chart-hit:focus, .chart-mark:focus { outline: 2px solid #91ad6b; outline-offset: -2px; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--body); margin: 2px 0 10px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 7px; }
.chart-key { width: 11px; height: 11px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.chart-tip { position: absolute; z-index: 5; background: #21382f; color: #f3f5e9; border-radius: 5px; padding: 8px 10px; font-size: 13px; line-height: 1.5; pointer-events: none; max-width: 280px; box-shadow: 0 2px 10px rgba(0, 0, 0, .18); }
.chart-tip-row { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.chart-tip-row span { color: #c9d7bf; white-space: normal; }
.chart-tip-key { width: 12px; height: 2px; display: inline-block; flex-shrink: 0; }
.chart-table { margin-top: 10px; font-size: 13px; }
.chart-table summary { cursor: pointer; font-weight: 600; color: #4c5e46; }
.chart-table table, .finding-table table { font-size: 13px; margin-top: 8px; }
.chart-table td, .chart-table th, .finding-table td, .finding-table th { padding: 8px 12px; white-space: normal; }
.finding-table { margin-top: 18px; }
.findings-sources { margin-top: 18px; }
.table-note { margin: 10px 0 24px; max-width: 900px; }
.source-link { font-size: 14px; color: #1d5b42; text-decoration: underline; text-underline-offset: 3px; }
.phone-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 22px 0; }
.phone-steps .panel { padding: 20px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.phone-steps h3 { font-family: var(--serif); font-size: 21px; font-weight: 400; margin: 0; }
.phone-steps p { font-size: 14px; line-height: 1.6; color: var(--body); margin: 0; overflow-wrap: anywhere; }
.phone-steps .button { margin-top: auto; }
.step-number { font-family: var(--serif); font-size: 26px; color: #4c6641; line-height: 1; }
.roi-stage { margin: 14px 0; max-height: 560px; overflow: hidden; border-radius: 5px; border: 1px solid var(--line); background: #e9ece3; text-align: center; }
.roi-stage canvas { max-width: 100%; max-height: 556px; cursor: crosshair; touch-action: none; display: inline-block; vertical-align: middle; }
.phone-rank-row { display: grid; grid-template-columns: minmax(120px, 220px) 80px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px 0; border-top: 1px solid var(--line); font-size: 14px; }
.phone-rank-row strong { font-family: var(--serif); font-size: 19px; font-weight: 400; white-space: nowrap; }
.phone-rank-label { overflow-wrap: anywhere; }
.light-panel { position: fixed; inset: 0; z-index: 50; display: flex; align-items: flex-end; justify-content: center; padding: 28px; cursor: pointer; }
.light-panel:focus { outline: none; }
.light-panel-help { background: rgba(0, 0, 0, .55); color: #fff; border-radius: 6px; padding: 8px 14px; font-size: 13px; display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
td .interval-unavailable { white-space: normal; max-width: 300px; }
@media (max-width: 1200px) {
  .stat-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .phone-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bench-grid { grid-template-columns: minmax(0, 1fr) 270px; }
}
@media (max-width: 1000px) {
  .bench-grid { grid-template-columns: 1fr; }
  .rank-panel { display: block; }
}
@media (max-width: 700px) {
  .topbar { flex-direction: column; align-items: flex-start; gap: 8px; }
  .research-tag { text-align: left; max-width: none; font-size: 11px; }
  .control-bar .source-label { grid-column: 1 / -1; }
  .stat-tile strong { font-size: 30px; }
  .finding h2 { font-size: 23px; }
  .phone-steps { grid-template-columns: 1fr; }
  .phone-rank-row { grid-template-columns: minmax(0, 1fr) auto; }
  .phone-rank-row .rank-bars { grid-column: 1 / -1; }
  .panel-heading { flex-wrap: wrap; }
  .scenario-grid { grid-template-columns: 1fr 1fr; }
}
