Hugging Face's logo

Spaces:
seonglae
/
OptimismBench
Paused

App Files Community
OptimismBench
File size: 5,650 Bytes
5c130ff
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
/* ============================================================================ */
/* Design Tokens */
/* ============================================================================ */
:root {
  /* Neutrals */
  --neutral-600: rgb(107, 114, 128);
  --neutral-400: rgb(185, 185, 185);
  --neutral-300: rgb(228, 228, 228);
  --neutral-200: rgb(245, 245, 245);

  --default-font-family: Source Sans Pro, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  /* Chrome accent = charcoal ink (neutral, no rust in the UI).
     The data figures keep the full ASG palette incl. RUST via the --ar-* vars below. */
  --primary-base: #2d2926;
  --primary-color: var(--primary-base);
  --primary-color-hover: oklch(from var(--primary-color) calc(l - 0.05) c h);
  --primary-color-active: oklch(from var(--primary-color) calc(l - 0.10) c h);
  --on-primary: #ffffff;

  /* OptimismBench palette — embeds read these so the web figures match the PDF figures */
  --opt: #e07a5f;         /* optimistic (paper cOpt, terracotta) */
  --pes: #3d5a80;         /* pessimistic (paper cPes, navy) */
  --opt-soft: #f0c9bd;    /* light terracotta for low-magnitude optimism */
  --pes-soft: #b9c3d4;    /* light navy for low-magnitude pessimism */
  --ar-rust: #c4553a;     /* AgentRoom / ours */
  --ar-slate: #3d5a80;    /* solo / baseline */
  --ar-sage: #7a9e7e;     /* shared-only */
  --ar-ochre: #e08838;    /* parallel-merge (orange, not mustard) */
  --ar-clay: #a66e4e;     /* noMCP */
  --ar-iron: #8a8a8a;     /* secondary baseline */
  --ar-teal: #2a9d8f;     /* agent 2 / heterogeneous */
  --ar-crimson: #a83e3e;  /* ChatDev / failure */
  --ar-purple: #6a5fa8;   /* agent 3 */
  --ar-green: #4a8a4a;    /* success / passed */
  --ar-charcoal: #2d2926; /* ink */

  /* Semantic colors — drawn from the ASG palette, not generic */
  --danger-color: #a83e3e;   /* CRIMSON */
  --success-color: #4a8a4a;  /* GREEN_OK */
  --info-color: #3d5a80;     /* SLATE */

  /* Text & Surfaces — clean white (the paper figures are on white too) */
  --page-bg: #ffffff;
  --surface-bg: #f5f6f7;
  --text-color: #1f2328;            /* near-black ink */
  --transparent-page-contrast: rgba(255, 255, 255, .85);
  --muted-color: rgba(31, 35, 40, .6);
  --border-color: rgba(31, 35, 40, .12);
  --code-bg: #f3f4f6;

  /* Links + citations — their own SLATE blue from the ASG palette, NOT the rust accent
     (keeps prose links distinct from the figure/accent color and from sibling articles) */
  --link-color: #3d5a80;       /* SLATE */
  --link-color-hover: #2c4463; /* deeper slate */
  --link-underline: var(--link-color);
  --link-underline-hover: var(--link-color-hover);

  /* Spacing scale */
  --spacing-1: 8px;
  --spacing-2: 12px;
  --spacing-3: 16px;
  --spacing-4: 24px;
  --spacing-5: 32px;
  --spacing-6: 40px;
  --spacing-7: 48px;
  --spacing-8: 56px;
  --spacing-9: 64px;
  --spacing-10: 72px;

  /* Custom Media aliases compiled by PostCSS */
  @custom-media --bp-xxs (max-width: 320px);
  @custom-media --bp-xs (max-width: 480px);
  @custom-media --bp-sm (max-width: 640px);
  @custom-media --bp-md (max-width: 768px);
  @custom-media --bp-lg (max-width: 1024px);
  @custom-media --bp-xl (max-width: 1280px);
  @custom-media --bp-content-collapse (max-width: 1100px);

  /* Layout */
  --content-padding-x: 16px;
  /* default page gutter */
  --block-spacing-y: var(--spacing-4);
  /* default vertical spacing between block components */

  /* Config */
  --palette-count: 8;

  /* Button tokens */
  --button-radius: 6px;
  --button-padding-x: 16px;
  --button-padding-y: 10px;
  --button-font-size: 14px;
  --button-icon-padding: 8px;
  /* Big button */
  --button-big-padding-x: 16px;
  --button-big-padding-y: 12px;
  --button-big-font-size: 16px;
  --button-big-icon-padding: 12px;

  /* Table tokens */
  --table-border-radius: 8px;
  --table-header-bg: oklch(from var(--surface-bg) calc(l - 0.02) c h);
  --table-row-odd-bg: oklch(from var(--surface-bg) calc(l - 0.01) c h);

  /* Z-index */
  --z-base: 0;
  --z-content: 1;
  --z-elevated: 10;
  --z-overlay: 1000;
  --z-modal: 1100;
  --z-tooltip: 1200;

  /* Charts (global) */
  --axis-color: var(--muted-color);
  --tick-color: var(--text-color);
  --grid-color: rgba(0, 0, 0, .08);
}

/* ============================================================================ */
/* Dark Theme Overrides */
/* ============================================================================ */
[data-theme="dark"] {
  /* Neutral dark (no warm/cream tint) */
  --page-bg: #0f1115;
  --surface-bg: #15171c;
  --text-color: rgba(237, 239, 242, .92);
  --muted-color: rgba(237, 239, 242, .62);
  --border-color: rgba(237, 239, 242, .14);
  --code-bg: #181b21;
  --transparent-page-contrast: rgba(15, 17, 21, .85);

  /* Chrome accent on dark = off-white ink (buttons render light-on-dark, no rust) */
  --primary-color: #edeff2;

  /* Links/citations: lighter slate so they stay legible on the warm dark ground */
  --link-color: #8aa6cc;
  --link-color-hover: #a8c0de;

  /* Lift the two darkest chart series so they stay legible on the warm dark ground */
  --ar-slate: #6f8bb5;
  --ar-iron: #b0a9a2;
  --ar-charcoal: #edeff2;

  /* Charts (global) */
  --axis-color: var(--muted-color);
  --tick-color: var(--muted-color);
  --grid-color: rgba(244, 238, 230, .10);

  /* Primary (lower L in dark) */
  --primary-color-hover: oklch(from var(--primary-color) calc(l - 0.05) c h);
  --primary-color-active: oklch(from var(--primary-color) calc(l - 0.10) c h);
  --on-primary: #0f1115;

  color-scheme: dark;
  background: var(--page-bg);
}