HTML 77.2%
TypeScript 10.5%
Python 9.6%
JavaScript 2.5%
1@import 'tailwindcss';23/*4 AI Atlas design tokens — institutional, dense, readable. Two themes on <html data-theme="light|dark">.5 Light: warm paper canvas, near-black ink, atlas blue accent. Dark: graphite canvas, off-white ink, brighter blue.6 Amber (accent-2) is reserved for money and change; positive/warning/danger are semantic only.7 Tier colours grade source quality (1 official → 4 unverified); entity-type colours identify badges everywhere.8*/910:root,11[data-theme='light'] {12 color-scheme: light;13 --canvas: #f6f6f3;14 --surface: #ffffff;15 --surface-2: #eeeeea;16 --surface-3: #e3e4de;17 --ink: #101216;18 --ink-2: #4b5161;19 --ink-3: #7c8293;20 --rule: rgba(16, 18, 22, 0.1);21 --rule-strong: rgba(16, 18, 22, 0.22);22 --accent: #1f4fd8;23 --accent-ink: #ffffff;24 --accent-soft: rgba(31, 79, 216, 0.1);25 --accent-2: #a8600a;26 --accent-2-soft: rgba(212, 130, 22, 0.14);27 --positive: #1d7a4a;28 --positive-soft: rgba(29, 122, 74, 0.12);29 --warning: #b4700e;30 --warning-soft: rgba(212, 130, 22, 0.14);31 --danger: #c0333d;32 --danger-soft: rgba(192, 51, 61, 0.12);3334 --tier-1: #1d7a4a;35 --tier-2: #1f4fd8;36 --tier-3: #b4700e;37 --tier-4: #7c8293;3839 --type-model: #1f4fd8;40 --type-company: #6d3fc7;41 --type-paper: #b6337e;42 --type-provider: #0d7c86;43 --type-benchmark: #c2560f;44 --type-hardware: #3d7a1d;45 --type-framework: #0f6fa8;46 --type-dataset: #8a3fb0;47 --type-tool: #5b6478;4849 --series-1: #1f4fd8;50 --series-2: #c2560f;51 --series-3: #1d7a4a;52 --series-4: #6d3fc7;53 --series-5: #0d7c86;54 --series-6: #b6337e;55 --series-7: #7c8293;56 --series-8: #c0333d;5758 /* Brand plate (LogoMark): inverted per theme so the mark always reads as a solid plate with a bright "now" node. */59 --brand-plate: #101216;60 --brand-ink: #f6f6f3;61 --brand-grid: rgba(246, 246, 243, 0.22);62 --brand-accent: #7fa3ff;6364 --radius: 4px;65 --radius-lg: 8px;66 --header-h: 56px;67 --tabbar-h: 58px;6869 /* Density (html[data-density]) — comfortable by default. Tables, key–value rows, sections and the base size scale. */70 --d-base: 15px;71 --d-cell-y: 0.55rem;72 --d-cell-x: 0.75rem;73 --d-kv-y: 0.5rem;74 --d-row-y: 0.625rem;75 --d-section-y: 1.75rem;76 --d-section-y-md: 2.5rem;77 --d-table-fs: 0.875rem;78}79[data-density='compact'] {80 --d-base: 14px;81 --d-cell-y: 0.38rem;82 --d-cell-x: 0.625rem;83 --d-kv-y: 0.32rem;84 --d-row-y: 0.45rem;85 --d-section-y: 1.25rem;86 --d-section-y-md: 1.75rem;87 --d-table-fs: 0.8125rem;88}89[data-density='dense'] {90 --d-base: 13.5px;91 --d-cell-y: 0.22rem;92 --d-cell-x: 0.5rem;93 --d-kv-y: 0.2rem;94 --d-row-y: 0.3rem;95 --d-section-y: 0.875rem;96 --d-section-y-md: 1.25rem;97 --d-table-fs: 0.78rem;98}99100[data-theme='dark'] {101 --brand-plate: #e9ebf0;102 --brand-ink: #0b0d11;103 --brand-grid: rgba(11, 13, 17, 0.2);104 --brand-accent: #1f4fd8;105 color-scheme: dark;106 --canvas: #0b0d11;107 --surface: #12151b;108 --surface-2: #191d25;109 --surface-3: #222732;110 --ink: #e9ebf0;111 --ink-2: #a3a9b8;112 --ink-3: #6f7688;113 --rule: rgba(190, 200, 225, 0.11);114 --rule-strong: rgba(190, 200, 225, 0.26);115 --accent: #6d95ff;116 --accent-ink: #061024;117 --accent-soft: rgba(109, 149, 255, 0.14);118 --accent-2: #f2b04a;119 --accent-2-soft: rgba(242, 176, 74, 0.14);120 --positive: #45c47f;121 --positive-soft: rgba(69, 196, 127, 0.14);122 --warning: #f2b04a;123 --warning-soft: rgba(242, 176, 74, 0.14);124 --danger: #ff6b74;125 --danger-soft: rgba(255, 107, 116, 0.14);126127 --tier-1: #45c47f;128 --tier-2: #6d95ff;129 --tier-3: #f2b04a;130 --tier-4: #8b92a5;131132 --type-model: #6d95ff;133 --type-company: #b08cff;134 --type-paper: #ff7ab6;135 --type-provider: #3fc3cf;136 --type-benchmark: #ff9a4d;137 --type-hardware: #8fd35b;138 --type-framework: #57b7f0;139 --type-dataset: #d38cff;140 --type-tool: #9aa3b8;141142 --series-1: #6d95ff;143 --series-2: #ff9a4d;144 --series-3: #45c47f;145 --series-4: #b08cff;146 --series-5: #3fc3cf;147 --series-6: #ff7ab6;148 --series-7: #9aa3b8;149 --series-8: #ff6b74;150}151152@theme inline {153 --color-canvas: var(--canvas);154 --color-surface: var(--surface);155 --color-surface-2: var(--surface-2);156 --color-surface-3: var(--surface-3);157 --color-ink: var(--ink);158 --color-ink-2: var(--ink-2);159 --color-ink-3: var(--ink-3);160 --color-rule: var(--rule);161 --color-rule-strong: var(--rule-strong);162 --color-accent: var(--accent);163 --color-accent-ink: var(--accent-ink);164 --color-accent-soft: var(--accent-soft);165 --color-accent-2: var(--accent-2);166 --color-accent-2-soft: var(--accent-2-soft);167 --color-positive: var(--positive);168 --color-positive-soft: var(--positive-soft);169 --color-warning: var(--warning);170 --color-warning-soft: var(--warning-soft);171 --color-danger: var(--danger);172 --color-danger-soft: var(--danger-soft);173 --color-tier-1: var(--tier-1);174 --color-tier-2: var(--tier-2);175 --color-tier-3: var(--tier-3);176 --color-tier-4: var(--tier-4);177 --color-type-model: var(--type-model);178 --color-type-company: var(--type-company);179 --color-type-paper: var(--type-paper);180 --color-type-provider: var(--type-provider);181 --color-type-benchmark: var(--type-benchmark);182 --color-type-hardware: var(--type-hardware);183 --color-type-framework: var(--type-framework);184 --color-type-dataset: var(--type-dataset);185 --color-type-tool: var(--type-tool);186 --color-series-1: var(--series-1);187 --color-series-2: var(--series-2);188 --color-series-3: var(--series-3);189 --color-series-4: var(--series-4);190 --color-series-5: var(--series-5);191 --color-series-6: var(--series-6);192 --color-series-7: var(--series-7);193 --color-series-8: var(--series-8);194195 --font-sans: var(--font-geist-sans), ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;196 --font-mono: var(--font-geist-mono), ui-monospace, SFMono-Regular, Menlo, monospace;197198 --radius-sm: var(--radius);199 --radius-md: var(--radius);200 --radius-lg: var(--radius-lg);201 --radius-xl: 12px;202203 --text-2xs: 0.6875rem;204 --text-2xs--line-height: 1rem;205}206207@layer base {208 html {209 background: var(--canvas);210 color: var(--ink);211 -webkit-text-size-adjust: 100%;212 text-rendering: optimizeLegibility;213 font-feature-settings: 'cv11', 'ss01';214 scroll-padding-top: calc(var(--header-h) + 12px);215 }216 body {217 font-family: var(--font-sans);218 font-size: var(--d-base, 15px);219 line-height: 1.5;220 background: var(--canvas);221 color: var(--ink);222 }223 ::selection {224 background: var(--accent-soft);225 }226 :focus-visible {227 outline: 2px solid var(--accent);228 outline-offset: 2px;229 }230 h1,231 h2,232 h3,233 h4 {234 letter-spacing: -0.01em;235 text-wrap: balance;236 }237 code,238 kbd,239 pre,240 samp {241 font-family: var(--font-mono);242 }243 table {244 font-variant-numeric: tabular-nums;245 }246 a {247 text-underline-offset: 3px;248 }249 button {250 cursor: pointer;251 }252 input,253 select,254 textarea {255 font: inherit;256 color: inherit;257 }258 input::placeholder {259 color: var(--ink-3);260 }261 input[type='search']::-webkit-search-decoration,262 input[type='search']::-webkit-search-cancel-button {263 -webkit-appearance: none;264 }265}266267/* ---------------------------------------------------------------------------------------------------------- utilities */268.container-x {269 padding-left: max(1rem, env(safe-area-inset-left));270 padding-right: max(1rem, env(safe-area-inset-right));271}272@media (min-width: 768px) {273 .container-x {274 padding-left: 2rem;275 padding-right: 2rem;276 }277}278279.eyebrow {280 font-size: 0.6875rem;281 line-height: 1rem;282 letter-spacing: 0.1em;283 text-transform: uppercase;284 font-weight: 600;285 color: var(--ink-3);286}287.display {288 font-weight: 600;289 letter-spacing: -0.03em;290 line-height: 1.02;291 text-wrap: balance;292}293.mono {294 font-family: var(--font-mono);295 font-feature-settings: 'tnum', 'zero';296}297.tnum {298 font-variant-numeric: tabular-nums;299 font-feature-settings: 'tnum';300}301.hairline {302 border-top: 1px solid var(--rule);303}304.hairline-strong {305 border-top: 1px solid var(--rule-strong);306}307.link {308 color: var(--accent);309 text-decoration: none;310}311.link:hover {312 text-decoration: underline;313}314/* Bordered surface — use sparingly (dialogs, sheets, the odd callout). Prefer hairlines and spatial composition. */315.panel {316 background: var(--surface);317 border: 1px solid var(--rule);318 border-radius: var(--radius-lg);319}320.grid-bg {321 background-image: linear-gradient(to right, var(--rule) 1px, transparent 1px), linear-gradient(to bottom, var(--rule) 1px, transparent 1px);322 background-size: 48px 48px;323 mask-image: radial-gradient(ellipse at 50% 0%, rgba(0, 0, 0, 0.9), transparent 75%);324}325.scrollbar-thin {326 scrollbar-width: thin;327 scrollbar-color: var(--rule-strong) transparent;328}329.scrollbar-thin::-webkit-scrollbar {330 height: 6px;331 width: 6px;332}333.scrollbar-thin::-webkit-scrollbar-thumb {334 background: var(--rule-strong);335 border-radius: 3px;336}337.no-scrollbar {338 scrollbar-width: none;339}340.no-scrollbar::-webkit-scrollbar {341 display: none;342}343.safe-bottom {344 padding-bottom: env(safe-area-inset-bottom, 0px);345}346.prose-atlas p + p {347 margin-top: 0.75rem;348}349.prose-atlas a {350 color: var(--accent);351}352.prose-atlas a:hover {353 text-decoration: underline;354}355356/* Live indicator */357.dot {358 display: inline-block;359 width: 7px;360 height: 7px;361 border-radius: 999px;362 background: var(--positive);363 vertical-align: middle;364}365.pulse {366 position: relative;367}368.pulse::after {369 content: '';370 position: absolute;371 inset: -3px;372 border-radius: 999px;373 border: 1px solid var(--positive);374 animation: pulse-ring 1.8s ease-out infinite;375}376@keyframes pulse-ring {377 0% {378 transform: scale(0.6);379 opacity: 0.9;380 }381 100% {382 transform: scale(1.8);383 opacity: 0;384 }385}386387/* ---------------------------------------------------------------------------------------------------------- data tables */388.data-table {389 width: 100%;390 border-collapse: collapse;391 font-variant-numeric: tabular-nums;392 font-size: var(--d-table-fs, 0.875rem);393}394.data-table th {395 text-align: left;396 font-weight: 600;397 font-size: 0.6875rem;398 letter-spacing: 0.08em;399 text-transform: uppercase;400 color: var(--ink-3);401 padding: calc(var(--d-cell-y) * 0.9) var(--d-cell-x);402 border-bottom: 1px solid var(--rule-strong);403 white-space: nowrap;404 vertical-align: bottom;405}406.data-table th:first-child,407.data-table td:first-child {408 padding-left: 0;409}410.data-table th:last-child,411.data-table td:last-child {412 padding-right: 0;413}414.data-table td {415 padding: var(--d-cell-y) var(--d-cell-x);416 border-bottom: 1px solid var(--rule);417 vertical-align: middle;418}419.data-table tbody tr:hover {420 background: var(--surface-2);421}422.data-table .num {423 text-align: right;424 font-variant-numeric: tabular-nums;425}426.data-table th.num {427 text-align: right;428}429.data-table .primary {430 font-weight: 500;431 color: var(--ink);432}433.data-table.compact td {434 padding-top: calc(var(--d-cell-y) * 0.65);435 padding-bottom: calc(var(--d-cell-y) * 0.65);436}437.data-table a.row-link {438 color: inherit;439 text-decoration: none;440}441.data-table a.row-link:hover {442 color: var(--accent);443}444@media (max-width: 767px) {445 .data-table.stack thead {446 display: none;447 }448 .data-table.stack tr {449 display: grid;450 grid-template-columns: 1fr 1fr;451 gap: 0.25rem 0.75rem;452 padding: 0.75rem 0;453 border-bottom: 1px solid var(--rule);454 }455 .data-table.stack tbody tr:hover {456 background: transparent;457 }458 .data-table.stack td {459 display: block;460 border: 0;461 padding: 0;462 min-width: 0;463 overflow-wrap: anywhere;464 }465 .data-table.stack td[data-label]::before {466 content: attr(data-label);467 display: block;468 font-size: 0.625rem;469 letter-spacing: 0.08em;470 text-transform: uppercase;471 color: var(--ink-3);472 font-weight: 600;473 margin-bottom: 0.1rem;474 }475 .data-table.stack td.primary {476 grid-column: 1 / -1;477 font-size: 0.9375rem;478 }479 .data-table.stack td.num {480 text-align: left;481 }482 .data-table.stack td.wide {483 grid-column: 1 / -1;484 }485 .data-table.stack td.hide-stack {486 display: none;487 }488}489/* Horizontal scroll wrapper for wide tables that must not stack. */490.table-scroll {491 position: relative; /* clip absolutely positioned .sr-only / caption children so they never widen the document */492 overflow-x: auto;493 -webkit-overflow-scrolling: touch;494 scrollbar-width: thin;495}496.table-scroll .data-table th,497.table-scroll .data-table td {498 white-space: nowrap;499}500501/* ---------------------------------------------------------------------------------------------------------- key–value */502.kv {503 display: grid;504 grid-template-columns: minmax(0, 1fr);505 font-size: 0.875rem;506}507.kv > div {508 display: grid;509 grid-template-columns: 9.5rem minmax(0, 1fr);510 gap: 0.25rem 1rem;511 padding: var(--d-kv-y) 0;512 border-bottom: 1px solid var(--rule);513 align-items: baseline;514}515.kv > div > dt {516 color: var(--ink-3);517 font-size: 0.8125rem;518}519.kv > div > dd {520 min-width: 0;521 overflow-wrap: anywhere;522}523@media (max-width: 480px) {524 .kv > div {525 grid-template-columns: 7.5rem minmax(0, 1fr);526 }527}528529/* ---------------------------------------------------------------------------------------------------------- density-aware layout */530/* Section vertical padding follows the density variables (Section component uses `.section-y`). */531.section-y {532 padding-top: var(--d-section-y);533 padding-bottom: var(--d-section-y);534}535@media (min-width: 768px) {536 .section-y {537 padding-top: var(--d-section-y-md);538 padding-bottom: var(--d-section-y-md);539 }540}541/* Dense feed rows (ChangeRow, lists): vertical padding from density. */542.row-y {543 padding-top: var(--d-row-y);544 padding-bottom: var(--d-row-y);545}546547/* ---------------------------------------------------------------------------------------------------------- evidence trigger */548/* A displayed value that can open the evidence drawer: subtle dotted underline, no button chrome. */549.evidence {550 appearance: none;551 background: none;552 border: 0;553 padding: 0;554 margin: 0;555 font: inherit;556 color: inherit;557 text-align: inherit;558 cursor: help;559 text-decoration: underline dotted;560 text-decoration-color: var(--rule-strong);561 text-decoration-thickness: 1px;562 text-underline-offset: 3px;563 border-radius: 2px;564}565.evidence:hover {566 text-decoration-color: var(--accent);567 color: var(--accent);568}569.evidence:focus-visible {570 outline: 2px solid var(--accent);571 outline-offset: 2px;572}573574/* ---------------------------------------------------------------------------------------------------------- hint tooltip (pure CSS) */575.hint {576 position: relative;577 display: inline-flex;578}579.hint > .hint-bubble {580 position: absolute;581 left: 0;582 top: calc(100% + 6px);583 z-index: 60;584 width: max-content;585 max-width: 18rem;586 padding: 0.45rem 0.6rem;587 font-size: 0.75rem;588 line-height: 1.35;589 font-weight: 400;590 letter-spacing: normal;591 text-transform: none;592 color: var(--ink-2);593 background: var(--surface);594 border: 1px solid var(--rule-strong);595 border-radius: var(--radius);596 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);597 opacity: 0;598 pointer-events: none;599 transform: translateY(-2px);600 transition: opacity 120ms ease, transform 120ms ease;601}602.hint.hint-right > .hint-bubble {603 left: auto;604 right: 0;605}606.hint:hover > .hint-bubble,607.hint:focus-within > .hint-bubble {608 opacity: 1;609 pointer-events: auto;610 transform: translateY(0);611}612613/* ---------------------------------------------------------------------------------------------------------- ticker */614.ticker {615 overflow: hidden;616 mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent);617}618.ticker-track {619 display: flex;620 width: max-content;621 gap: 2.5rem;622 animation: ticker-scroll var(--ticker-duration, 60s) linear infinite;623}624.ticker:hover .ticker-track,625.ticker[data-paused='true'] .ticker-track {626 animation-play-state: paused;627}628@keyframes ticker-scroll {629 from {630 transform: translateX(0);631 }632 to {633 transform: translateX(-50%);634 }635}636637/* ---------------------------------------------------------------------------------------------------------- heatmap */638.heatmap {639 border-collapse: separate;640 border-spacing: 2px;641 font-size: 0.75rem;642}643.heatmap th {644 position: sticky;645 background: var(--canvas);646 z-index: 2;647 font-weight: 500;648 color: var(--ink-2);649 white-space: nowrap;650}651.heatmap thead th {652 top: 0;653 vertical-align: bottom;654 padding: 0.25rem 0.3rem;655}656.heatmap tbody th {657 left: 0;658 text-align: left;659 padding: 0 0.6rem 0 0;660 z-index: 3;661}662.heatmap thead th:first-child {663 left: 0;664 z-index: 4;665}666.heatmap td {667 min-width: 2.6rem;668 height: 1.7rem;669 text-align: center;670 font-variant-numeric: tabular-nums;671 border-radius: 2px;672 color: var(--ink);673}674.heatmap td a {675 display: block;676 color: inherit;677 text-decoration: none;678}679.heatmap td.empty {680 background: var(--surface-2);681 color: var(--ink-3);682}683684/* ---------------------------------------------------------------------------------------------------------- terminal layout */685.terminal-rail {686 position: sticky;687 top: calc(var(--header-h) + 0.75rem);688 max-height: calc(100dvh - var(--header-h) - 1.5rem);689 overflow-y: auto;690 scrollbar-width: thin;691}692.sheet-enter {693 animation: sheet-in 160ms ease-out;694}695@keyframes sheet-in {696 from {697 opacity: 0;698 transform: translateY(8px);699 }700 to {701 opacity: 1;702 transform: translateY(0);703 }704}705706@media (prefers-reduced-motion: reduce) {707 *,708 *::before,709 *::after {710 animation-duration: 0.01ms !important;711 transition-duration: 0.01ms !important;712 }713 .ticker-track {714 animation: none;715 width: 100%;716 overflow-x: auto;717 }718}719