@font-face{font-family:Metrify;src:url('assets/NaNMetrifyANarrow-Reg.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Metrify;src:url('assets/NaNMetrifyANarrow-Bld.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:light;--ink:#291109;--muted:#695853;--bg:#f5f1e4;--surface:#d7d0c4;--paper:#fffdf7;--border:rgb(41 17 9 / 14%);font:16px/1.4 Metrify,Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}main{max-width:1400px;margin:auto;padding:0 32px}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #d74127;outline-offset:4px}button{border:1px solid var(--border);border-radius:7px;padding:8px 12px;background:var(--paper);color:var(--ink)}button:hover{background:#eee8dc}a{color:inherit;text-underline-offset:4px}.page-head{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:16px}.identity{display:flex;align-items:center;gap:20px;font-size:18px}.identity img{object-fit:contain}.separator{height:24px;border-left:1px solid var(--border)}.actions{display:flex;align-items:center;gap:18px;font-size:14px}.actions a{text-decoration:none}.chart-card{background:var(--surface);padding:4px;border-radius:18px}.card-head{padding:22px 24px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px}h1{font-size:28px;line-height:1.1;letter-spacing:-.025em;margin:0}h2{font-size:22px;line-height:1.2;margin:0;letter-spacing:-.015em}p{margin:8px 0}.card-head p{color:var(--muted);font-size:16px;margin-bottom:0}.toggle{display:flex;background:#ede8df;padding:4px;border:1px solid var(--border);border-radius:24px;flex-shrink:0}.toggle button{background:none;border:0;border-radius:20px;min-width:60px;font-weight:700}.toggle button span{font-weight:400;margin-left:3px}.toggle button[aria-pressed=true]{color:var(--paper);background:var(--ink)}.chart-panel{background:var(--paper);border-radius:14px;padding:24px 24px 14px}.plot-heading{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--muted);margin:0 0 8px 52px}.plot-heading span:first-child{color:var(--ink);font-weight:700}#chart{width:100%;display:block;overflow:visible;touch-action:pan-y}#chart .series{transition:opacity .18s}#chart .point:focus{outline:none}#chart .point:focus .focus-ring{opacity:1}.legend{display:flex;flex-wrap:wrap;gap:10px;padding:4px 0 0 52px}.legend button{display:flex;align-items:center;gap:8px;border-radius:8px;border-color:transparent;background:transparent;font-size:16px;padding:7px 10px}.legend button:hover{background:var(--bg)}.legend button[aria-pressed=true]{border-color:var(--series);background:var(--bg)}.symbol{width:17px;height:17px}.chart-caption{display:flex;justify-content:space-between;gap:12px;min-height:34px;align-items:center;margin:6px 0 0 62px;font-size:14px;color:var(--muted)}.chart-caption button{border:0;background:transparent;text-decoration:underline;font-size:14px;padding:0}.card-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px 10px;font-size:14px;color:var(--muted)}.card-foot .actions{gap:10px}.card-foot button{background:transparent}.lower-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px;margin:24px 0 32px}.panel{border:1px solid var(--border);border-radius:14px;background:var(--paper);padding:24px;min-width:0}.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-head a,.data-link{font-size:14px}.section-note{color:var(--muted);font-size:14px;margin:8px 0 18px}table{border-collapse:collapse;width:100%;font-size:16px;font-variant-numeric:tabular-nums}th{font-size:14px;color:var(--muted);font-weight:400}th,td{text-align:right;padding:11px 8px;border-bottom:1px solid var(--border);white-space:nowrap}td:first-child,th:first-child{text-align:left;padding-left:0}td:last-child,th:last-child{padding-right:0}.algo-title{font-weight:700}.depth-tag{font-size:14px;color:var(--muted)}tbody tr{transition:opacity .18s;background .18s;cursor:pointer}tbody tr:hover{background:var(--bg)}tbody tr.selected{background:var(--bg)}tbody tr:last-child td{border:0}.scope{margin:20px 0;font-size:16px}.scope>div{display:flex;justify-content:space-between;gap:16px;padding:7px 0}.scope dt{color:var(--muted)}dd{margin:0;font-variant-numeric:tabular-nums}details{border-top:1px solid var(--border);padding:14px 0}summary{font-size:16px;font-weight:700;cursor:pointer}details p{color:var(--muted);font-size:16px;margin:12px 0 0;line-height:1.5}.data-link{display:inline-block;margin-top:8px}footer{display:flex;justify-content:space-between;gap:16px;padding:0 0 32px;color:var(--muted);font-size:14px}.tooltip{position:fixed;z-index:10;width:268px;max-width:calc(100vw - 24px);background:var(--paper);border:1px solid var(--border);border-top:3px solid var(--series);border-radius:10px;padding:16px;box-shadow:0 8px 28px #29110924;pointer-events:none;font-size:16px}.tooltip strong{font-size:19px}.tooltip .hint{font-size:14px;color:var(--muted);margin:3px 0 12px}.tooltip dl{display:grid;grid-template-columns:1fr auto;gap:7px 12px;margin:0}.tooltip dt{color:var(--muted)}.tooltip dd{font-weight:700}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);padding:12px 20px;border-radius:10px;background:var(--ink);color:var(--paper);z-index:20;box-shadow:0 8px 32px #29110926;max-width:calc(100% - 24px);font-size:16px}.dimmed{opacity:.25}[hidden]{display:none!important}
@media(min-width:1600px){main{max-width:1480px}}
@media(max-width:1000px){.lower-grid{grid-template-columns:1fr}.plot-heading span:last-child{display:none}.panel{padding:20px}}
@media(max-width:600px){main{padding:0 12px}.page-head{min-height:74px}.identity{gap:10px;font-size:16px}.identity img{width:80px}.actions{gap:12px}.page-head .actions>a{display:none}.card-head{padding:18px 14px;flex-wrap:wrap;gap:16px}h1{font-size:25px}.card-head p{font-size:16px}.chart-panel{padding:16px 8px 12px}.plot-heading{margin-left:36px;font-size:14px}.legend{padding-left:0;gap:2px;display:grid;grid-template-columns:1fr 1fr}.legend button{font-size:16px;padding:8px;white-space:nowrap}.chart-caption{margin:10px 4px 0;align-items:flex-start;font-size:14px}.card-foot{flex-wrap:wrap;padding:12px 10px;gap:10px}.card-foot .actions{width:100%;justify-content:flex-end}.lower-grid{margin-top:16px;gap:16px}.panel{padding:16px}.section-head{flex-wrap:wrap}th,td{padding:10px 4px;font-size:14px}.algo-title{font-size:16px}.depth-tag{display:block;font-size:14px}.scope{font-size:16px}.section-note{line-height:1.4}footer{flex-wrap:wrap}.toggle button{font-size:16px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.lower-grid{display:block}.results{max-width:none;margin:0 auto}
@media(max-width:380px){.identity .separator,.identity>span:last-child{display:none}th{white-space:normal}td:first-child{white-space:normal}.section-head a{font-size:14px}.scope{font-size:14px}.plot-heading{margin-left:20px}}
/* Compact frame around a plot with stable, width-based proportions. */
.plot-heading{justify-content:flex-end}.plot-heading span:first-child{font-weight:400;color:var(--muted)}
.page-head{min-height:64px}.card-head{padding:16px 20px;gap:12px}h1{font-size:26px}
.chart-panel{padding:14px 20px 8px}.card-head p{margin-top:6px}.card-foot{padding:8px 16px}
.chart-caption{min-height:26px;margin-top:2px}.legend{gap:6px}.legend button{padding:5px 8px}
.results{background:var(--paper);color:var(--ink);border:1px solid var(--border);padding:20px 24px;border-radius:14px}
.results h2{font-size:22px;margin-bottom:14px}.results table{font-family:inherit;font-size:16px}
.results th{background:var(--surface);color:var(--muted);font-weight:700}
.results th,.results td{padding:10px 12px;border-color:var(--border)}
.results th:first-child{border-radius:10px 0 0 0}.results th:last-child{border-radius:0 10px 0 0}
.results td:first-child{font-weight:400}.results td.aperture-name{color:#d74127;font-weight:700}
.results tbody tr{cursor:default}.results tbody tr:hover{background:var(--bg)}
.results #table-wrap{overflow-x:auto}
@media(max-width:600px){
  .page-head{min-height:54px}.card-head{padding:12px;gap:8px}h1{font-size:22px}
  .card-head p{font-size:14px}.chart-panel{padding:10px 8px 6px}
  .toggle{padding:2px}.toggle button{padding:6px 10px;min-width:50px}
  .plot-heading{font-size:14px}.legend button{font-size:14px;padding:4px 6px}
  .chart-caption{margin:4px 2px 0;font-size:14px;min-height:0}
  .card-foot{padding:8px;gap:6px}.card-foot .actions{width:auto;margin-left:auto}
  .card-foot button{padding:6px 8px}.results{padding:16px 12px}
  .results table{min-width:620px}.results th,.results td{padding:9px 10px;font-size:14px}
  .chart-caption>span{display:none}.chart-caption:has(button[hidden]){display:none}
}
@media(max-width:380px){.card-head p{display:none}.chart-panel .plot-heading{margin-left:6px}}
