Upload frontend/src/index.css with huggingface_hub

frontend/src/index.css

@@ -38,6 +38,20 @@ body {
   margin-bottom: 2.5rem;
 }
 
+.hero-positioning {
+  display: inline-block;
+  font-size: 0.78rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.12em;
+  color: var(--green);
+  border: 1px solid var(--green-dim);
+  background: #00ff8810;
+  padding: 0.25rem 1rem;
+  border-radius: 999px;
+  margin-bottom: 1rem;
+}
+
 .hero h1 {
   font-size: clamp(2rem, 5vw, 3.2rem);
   font-weight: 800;
@@ -466,6 +480,39 @@ body {
 .fw-wall--bypassed .fw-wall-bricks { opacity: 0.06; }
 .fw-wall--blocked  { border-color: var(--red); box-shadow: 0 0 25px #ff404040; color: var(--red); }
 
+/* SecAlign binding defense — gold when it holds */
+.fw-wall--binding { border-color: #aa8800; }
+.fw-wall--binding.fw-wall--blocked {
+  border-color: var(--yellow);
+  box-shadow: 0 0 35px #ffd70055;
+  color: var(--yellow);
+  animation: binding-hold 1s ease-in-out infinite;
+}
+@keyframes binding-hold {
+  0%,100% { box-shadow: 0 0 25px #ffd70040; }
+  50%      { box-shadow: 0 0 50px #ffd70090; }
+}
+.fw-binding-badge {
+  font-size: 0.55rem;
+  font-family: var(--mono);
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  color: var(--yellow);
+  border: 1px solid #aa8800;
+  background: #ffd70012;
+  padding: 0.1rem 0.4rem;
+  border-radius: 4px;
+  margin-top: 0.2rem;
+}
+.fw-held {
+  background: #ffd70020 !important;
+  color: var(--yellow) !important;
+  border: 1px solid var(--yellow) !important;
+  font-size: 0.72rem;
+  font-weight: 800;
+}
+
 @keyframes wall-pulse {
   0%,100% { box-shadow: 0 0 15px #58a6ff30; }
   50%      { box-shadow: 0 0 30px #58a6ff60; }
@@ -761,6 +808,49 @@ body {
   line-height: 1.5;
 }
 
+/* ── Live Reward Panel ──────────────────────────────────────────────────────── */
+.reward-panel {
+  background: var(--bg2);
+  border: 1px solid var(--border);
+  border-radius: 14px;
+  padding: 1.25rem 1.5rem 1rem;
+  margin-bottom: 1.5rem;
+}
+.reward-panel-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+  margin-bottom: 0.75rem;
+  font-size: 0.82rem;
+  font-weight: 600;
+  color: var(--text2);
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+}
+.reward-panel-chips { display: flex; gap: 0.5rem; }
+.rp-chip {
+  padding: 0.2rem 0.65rem;
+  border-radius: 999px;
+  font-size: 0.72rem;
+  font-weight: 700;
+  font-family: var(--mono);
+}
+.rp-chip--dim   { background: #ffffff10; color: var(--text2); border: 1px solid var(--border); }
+.rp-chip--green { background: #00ff8820; color: var(--green); border: 1px solid #00ff8840; }
+.rp-chip--blue  { background: #58a6ff20; color: var(--blue);  border: 1px solid #58a6ff40; }
+
+/* Taller graph when standalone */
+.reward-panel .reward-graph-wrap {
+  background: transparent;
+  border: none;
+  padding: 0;
+}
+.reward-panel .reward-svg {
+  height: 100px;
+}
+
 /* ── Fast mode badge ────────────────────────────────────────────────────────── */
 .fast-badge {
   margin-left: 0.75rem;