1@font-face {
  2  font-family: "Atkinson Hyperlegible Next";
  3  src: url("/static/fonts/AtkinsonHyperlegibleNext-Regular.woff2") format("woff2");
  4  font-weight: 400;
  5  font-style: normal;
  6  font-display: swap;
  7}
  8@font-face {
  9  font-family: "Atkinson Hyperlegible Next";
 10  src: url("/static/fonts/AtkinsonHyperlegibleNext-Bold.woff2") format("woff2");
 11  font-weight: 700;
 12  font-style: normal;
 13  font-display: swap;
 14}
 15@font-face {
 16  font-family: "0xProto";
 17  src: url("/static/fonts/0xProto-Regular.woff2") format("woff2");
 18  font-weight: 400;
 19  font-style: normal;
 20  font-display: swap;
 21}
 22:root {
 23  --font-sans: "Atkinson Hyperlegible Next", system-ui, sans-serif;
 24  --font-mono: "0xProto", ui-monospace, monospace;
 25}
 26body { font-family: var(--font-sans); }
 27code, pre, .mono { font-family: var(--font-mono); }
 28textarea { font-family: var(--font-sans); }
 29.skip-link {
 30  position: absolute;
 31  left: -9999px;
 32  z-index: 999;
 33  padding: 1em;
 34  background: #000;
 35  color: #fff;
 36}
 37.sr-only {
 38  position: absolute;
 39  width: 1px;
 40  height: 1px;
 41  padding: 0;
 42  margin: -1px;
 43  overflow: hidden;
 44  clip: rect(0, 0, 0, 0);
 45  white-space: nowrap;
 46  border: 0;
 47}
 48.skip-link:focus {
 49  left: 50%;
 50  transform: translateX(-50%);
 51  top: 0;
 52}
 53.task-title {
 54  display: inline;
 55  margin-inline-end: var(--space-2);
 56}
 57.task-title + .badge {
 58  vertical-align: text-bottom;
 59}
 60.card > header:has(.task-title) {
 61  margin-block-end: var(--space-6);
 62}
 63details:has(> .table) {
 64  overflow: visible;
 65}
 66details:has(> .table) > .table {
 67  width: auto;
 68  min-width: 0;
 69}
 70[hidden] {
 71  display: none !important;
 72}
 73
 74/* FAB */
 75.fab-group {
 76  position: fixed;
 77  bottom: 1.5rem;
 78  right: 1.5rem;
 79  display: flex;
 80  flex-direction: column;
 81  align-items: flex-end;
 82  gap: 0.5rem;
 83  z-index: 100;
 84}
 85.fab-toggle {
 86  width: 3.5rem;
 87  height: 3.5rem;
 88  border-radius: 50%;
 89  display: flex;
 90  align-items: center;
 91  justify-content: center;
 92  padding: 0;
 93  cursor: pointer;
 94  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
 95  transition: transform 0.2s ease;
 96}
 97.fab-toggle:hover {
 98  transform: scale(1.05);
 99}
100.fab-toggle .fab-icon-close {
101  display: none;
102}
103.fab-toggle[aria-expanded="true"] .fab-icon-plus {
104  display: none;
105}
106.fab-toggle[aria-expanded="true"] .fab-icon-close {
107  display: block;
108}
109.fab-actions {
110  display: flex;
111  flex-direction: column;
112  align-items: flex-end;
113  gap: 0.5rem;
114}
115.fab-actions[hidden] {
116  display: none !important;
117}
118.fab-action {
119  display: flex;
120  align-items: center;
121  gap: 0.5rem;
122  padding: 0.5rem 1rem;
123  border-radius: 2rem;
124  cursor: pointer;
125  white-space: nowrap;
126  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
127}
128
129/* Stat card border colors */
130.card.border-success {
131  border-color: var(--success);
132}
133.card.border-warning {
134  border-color: var(--warning);
135}