.intro{max-width:900px;color:var(--ink);letter-spacing:-.02em;text-align:center;margin:0 auto 28px;font-size:30px;line-height:1.3}.hero{text-align:center;max-width:720px;margin:0 auto 40px}@media (width<=600px){.intro{font-size:22px}}.hero img{aspect-ratio:16/9;border:1px solid var(--line);background:#000;border-radius:8px;width:100%;height:auto;display:block}.hero figcaption{margin-top:8px}.chart-card{overflow:hidden}.chart{--best:#16a34a;--worst:#e00000;border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:860px}.chart col.c-group{width:128px}.chart col.c-row{width:150px}.chart thead th{white-space:normal;padding:0 12px}.chart thead th.name{vertical-align:bottom;padding-top:16px}.chart thead th.about{color:var(--muted);font:400 11.5px/1.4 var(--sans);letter-spacing:0;text-transform:none;vertical-align:top;padding-top:6px}.chart thead th.params{color:var(--muted);font:400 10.5px/1.4 var(--mono);letter-spacing:0;text-transform:none;padding-top:6px;padding-bottom:14px}.chart thead a{color:var(--ink);letter-spacing:-.005em;text-transform:none;font-size:12.5px;font-weight:500;text-decoration:none}.chart thead a span{color:var(--muted)}.chart thead a:hover{color:var(--accent)}.chart thead a:hover span{color:inherit}.chart th.group{border-top:3px solid var(--card);background:var(--hue);color:#fff;letter-spacing:.06em;text-align:left;vertical-align:top;white-space:normal;cursor:help;padding:10px 12px;font-size:10.5px;font-weight:600}.chart th.group small{color:#ffffffc7;letter-spacing:0;text-transform:none;margin-top:2px;font-size:10.5px;font-weight:500;display:block}.chart th.row,.chart tbody td{border-top:1px solid color-mix(in srgb, var(--hue) 16%, var(--card));background:color-mix(in srgb, var(--hue) 6%, var(--card));height:34px;padding:0 12px}.chart tbody tr:first-child th.row,.chart tbody tr:first-child td{border-top:3px solid var(--card)}.chart th.row{color:var(--ink);letter-spacing:0;text-transform:none;font-size:13px;font-weight:400;overflow:hidden}.chart tbody tr:hover th.row,.chart tbody tr:hover td{background:color-mix(in srgb, var(--hue) 13%, var(--card))}.chart tbody td{font-variant-numeric:tabular-nums}.chart td.best{color:color-mix(in oklch, var(--best) var(--good,100%), var(--worst));font-weight:700}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .chart{--best:#4ade80;--worst:#ff4040}}:root[data-theme=dark] .chart{--best:#4ade80;--worst:#ff4040}
