:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #151714; color: #ecefe7; }
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 56px 0; }
header { max-width: 760px; }
.eyebrow { color: #d8ff57; font: 700 12px/1.2 ui-monospace, monospace; letter-spacing: .12em; text-transform: uppercase; }
h1 { font-size: clamp(32px, 6vw, 64px); line-height: 1; letter-spacing: -.04em; margin: 18px 0; }
p { color: #b7bdb0; line-height: 1.6; }
.actions { display: flex; align-items: center; gap: 16px; margin: 28px 0 44px; }
button { border: 0; border-radius: 999px; background: #d8ff57; color: #151714; padding: 12px 20px; font-weight: 750; cursor: pointer; }
button:disabled { cursor: wait; opacity: .5; }
#status { color: #b7bdb0; }
.result { margin: 38px 0; overflow-x: auto; }
h2 { margin-bottom: 12px; font-size: 19px; }
table { width: 100%; min-width: 650px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { text-align: right; padding: 11px 14px; border-bottom: 1px solid #343830; }
th:first-child, td:first-child { text-align: left; }
th { color: #d8ff57; font-size: 12px; letter-spacing: .06em; }
td { color: #daddd5; }
details { margin-top: 48px; padding: 18px 0; border-top: 1px solid #343830; border-bottom: 1px solid #343830; }
summary { cursor: pointer; font-weight: 700; }
footer { margin-top: 36px; color: #777e72; }
a { color: #d8ff57; }