quillwright/theme.css

/* Quillwright — industrial precision. Source: docs/design/frontend-core-workspace.md */
@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@700;800;900&family=Inter:wght@400;700&family=JetBrains+Mono:wght@500&family=Material+Symbols+Outlined&display=swap");
:root {
  --ff-primary: #964900;
  --ff-accent: #f57c00;
  --ff-log-bg: #10191e;
  --ff-log-border: #1c2931;
  --ff-ok: #22c55e;
}
.ff-title {
  font-family: "Hanken Grotesk";
  font-weight: 900;
  color: var(--ff-primary);
  font-size: 24px;
  letter-spacing: -0.01em;
}
.ff-log {
  background: var(--ff-log-bg);
  color: #cdd6db;
  font-family: "JetBrains Mono", monospace;
  font-size: 13px;
  padding: 24px;
  min-height: 420px;
  border-radius: 8px;
}
.ff-step {
  display: flex;
  gap: 12px;
  padding: 8px 0;
  align-items: flex-start;
}
.ff-step-body p {
  color: #fff;
  opacity: 0.92;
  margin: 0;
}
.ff-badge {
  display: inline-block;
  margin-top: 4px;
  color: var(--ff-accent);
  font-size: 11px;
}
.ff-ok {
  color: var(--ff-ok);
  font-variation-settings: "FILL" 1;
}
.ff-err {
  color: #ba1a1a;
}
.ff-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ff-accent);
  display: inline-block;
  margin-top: 6px;
  animation: ff-pulse 2s infinite;
}
.ff-wait {
  color: #546e7a;
}
.terminal-cursor {
  display: inline-block;
  width: 8px;
  height: 16px;
  background: var(--ff-accent);
  margin-left: 4px;
  vertical-align: middle;
  animation: ff-blink 1s step-end infinite;
}
@keyframes ff-blink {
  50% {
    opacity: 0;
  }
}
@keyframes ff-pulse {
  50% {
    opacity: 0.4;
    transform: scale(1.15);
  }
}
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-size: 20px;
  vertical-align: middle;
}
.ff-pane-head {
  font-family: "Hanken Grotesk";
  font-weight: 700;
}