:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif; background: #091315; color: #eef7f4; }
* { box-sizing: border-box; } body { margin: 0; min-width: 320px; background: radial-gradient(circle at 10% -20%, #154d46 0, transparent 36rem), #091315; } button, input, select { font: inherit; }
.shell { width: min(1200px, calc(100% - 32px)); margin: 0 auto; padding: 68px 0 56px; }.hero { display: flex; gap: 28px; align-items: end; justify-content: space-between; margin-bottom: 32px; }.eyebrow { margin: 0 0 9px; color: #74ddc4; font-size: 12px; font-weight: 800; letter-spacing: .13em; }h1 { font-size: clamp(34px, 5vw, 58px); line-height: 1; letter-spacing: -.055em; margin: 0; }.subtitle { margin: 14px 0 0; color: #a8bab5; }.updated { display: grid; justify-items: end; gap: 4px; color: #a8bab5; font-size: 13px; white-space: nowrap; }.updated strong { color: #eef7f4; font-size: 14px; }#refresh { margin-top: 7px; border: 1px solid #31524c; color: #a7e7d7; background: transparent; border-radius: 8px; padding: 7px 12px; cursor: pointer; }#refresh:hover { background: #15352f; }
.metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }.metrics article, .toolbar, .table-card { border: 1px solid #203532; background: rgba(15, 31, 29, .82); border-radius: 14px; }.metrics article { padding: 19px 20px; display: grid; gap: 7px; }.metrics span, .toolbar label span { color: #9cafaa; font-size: 13px; }.metrics strong { font-size: 28px; letter-spacing: -.04em; }.toolbar { padding: 14px; display: flex; gap: 13px; align-items: end; margin-bottom: 13px; }.toolbar label { display: grid; gap: 6px; min-width: 170px; }.toolbar .search { flex: 1; }input, select { border: 1px solid #31524c; border-radius: 8px; background: #0c1b19; color: #eef7f4; padding: 10px 11px; outline: none; }input:focus, select:focus { border-color: #61d2b6; box-shadow: 0 0 0 3px #2d79652e; }#resultCount { margin: 0 4px 10px auto; color: #9cafaa; font-size: 13px; white-space: nowrap; }
.table-card { overflow: hidden; }.table-wrap { overflow-x: auto; }table { border-collapse: collapse; width: 100%; min-width: 760px; }th { text-align: left; padding: 14px 20px; color: #8fa7a1; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; border-bottom: 1px solid #203532; }td { padding: 15px 20px; border-bottom: 1px solid #182b28; vertical-align: middle; font-size: 14px; }tbody tr:last-child td { border-bottom: 0; }tbody tr:hover { background: #112723; }.token strong { display: block; font-size: 15px; }.token small { display: block; color: #99aaa5; margin-top: 3px; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.token-link, .holder-profile { color: inherit; text-decoration: none; }.token-link:hover, .holder-profile:hover { color: #8ce0c9; text-decoration: underline; text-underline-offset: 3px; }.chain { color: #8ce0c9; }.market { font-variant-numeric: tabular-nums; font-weight: 700; }.holders { color: #c7d7d2; max-width: 270px; line-height: 1.5; }.address { border: 0; background: #18322d; color: #a8e8d8; border-radius: 6px; padding: 6px 8px; cursor: pointer; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }.address:hover { background: #245044; }.empty, .error { margin: 0; padding: 25px 20px; color: #9cafaa; }.error { color: #ffb6ac; background: #3c1d1d; }
 .sort { appearance: none; border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit; font-weight: 700; letter-spacing: inherit; padding: 0; text-transform: inherit; }.sort:hover, .sort[aria-pressed="true"] { color: #79d9c2; }.sort span { font-size: 15px; }.holders { min-width: 190px; max-width: 310px; }.holder-count { display: block; color: #8ce0c9; font-size: 12px; margin-bottom: 3px; }.holder-names { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.holder-entry { display: inline; }.holder-first-buy { color: #91aaa3; font-size: 11px; white-space: normal; }.holder-highlight { background: #ffdf43; border-radius: 4px; box-shadow: 0 0 10px #ffdf4366; color: #1a1804; font-weight: 800; padding: 1px 4px; }.holder-toggle { border: 0; background: transparent; color: #8ce0c9; cursor: pointer; font-size: 12px; margin-top: 4px; padding: 0; }.holder-toggle:hover { color: #d4fff4; text-decoration: underline; }dialog { border: 1px solid #3b645b; border-radius: 16px; background: #102521; color: #eef7f4; box-shadow: 0 24px 80px #000b; max-width: min(640px, calc(100vw - 32px)); padding: 0; width: 640px; }dialog::backdrop { background: #020807bb; }dialog header { align-items: start; border-bottom: 1px solid #29443e; display: flex; justify-content: space-between; padding: 19px 22px; }dialog header p { color: #8ce0c9; font-size: 12px; margin: 0 0 5px; }dialog h2 { font-size: 18px; margin: 0; }#closeHolderDialog { background: transparent; border: 0; color: #c1d5cf; cursor: pointer; font-size: 28px; line-height: 1; padding: 0 2px; }#holderDialogNames { line-height: 1.75; margin: 0; max-height: min(55vh, 440px); overflow-wrap: anywhere; overflow-y: auto; padding: 20px 22px; }
@media (max-width: 680px) { .shell { width: min(100% - 24px, 1200px); padding-top: 36px; }.hero { align-items: start; flex-direction: column; }.updated { justify-items: start; }.metrics { gap: 8px; }.metrics article { padding: 15px; }.metrics strong { font-size: 23px; }.toolbar { align-items: stretch; flex-direction: column; }.toolbar label { min-width: 0; }.toolbar #resultCount { margin: 0; } }
