
    :root {
      /* Carbon, brass, and signal colors give the dashboard a product-grade vault feel. */
      --bg: #080a0d;
      --bg-raised: #141922;
      --bg-card: #151b23;
      --bg-card-2: #0f141b;
      --bg-card-3: #1a2029;
      --border: #2c3744;
      --border-soft: rgba(149, 166, 188, 0.16);
      --text: #edf3f8;
      --text-muted: #a4b1c1;
      --text-dim: #748194;
      --accent: #6bb8ff;
      --accent-2: #d6a84b;
      --accent-3: #4fc8a5;
      --accent-4: #d97eb7;
      --c-views: #6bb8ff;
      --c-uniques: #4fc8a5;
      --c-clones: #d97eb7;
      --c-cloners: #f0b75a;
      --c-positive: #4fc8a5;
      --c-negative: #ff6b6b;
      --chart-grid: rgba(141, 161, 184, 0.16);
      --chart-axis: rgba(141, 161, 184, 0.32);
      --chart-tooltip-bg: rgba(12, 16, 22, 0.97);
      --chart-tooltip-border: rgba(214, 168, 75, 0.30);
      --inset-highlight: rgba(255, 255, 255, 0.055);
      --surface-sheen: rgba(255, 255, 255, 0.035);
      --surface-etch: rgba(214, 168, 75, 0.07);
      --surface-blueprint: rgba(107, 184, 255, 0.065);
      --card-shadow: 0 18px 42px rgba(0, 0, 0, 0.36), 0 2px 8px rgba(0, 0, 0, 0.24);
      --card-shadow-hover: 0 24px 54px rgba(0, 0, 0, 0.44), 0 4px 12px rgba(0, 0, 0, 0.30);
      --radius: 8px;
      --radius-lg: 8px;
    }
    [data-theme="light"] {
      --bg: #f7f9fc;
      --bg-raised: #ffffff;
      --bg-card: #ffffff;
      --bg-card-2: #eef3f7;
      --bg-card-3: #f9fbfd;
      --border: #c9d4df;
      --border-soft: rgba(74, 90, 110, 0.15);
      --text: #17202b;
      --text-muted: #536174;
      --text-dim: #718095;
      --accent: #1267ad;
      --accent-2: #8a5b12;
      --accent-3: #137d68;
      --accent-4: #a53d83;
      --c-views: #1267ad;
      --c-uniques: #137d68;
      --c-clones: #a53d83;
      --c-cloners: #a76318;
      --c-positive: #137d68;
      --c-negative: #b4232f;
      --chart-grid: rgba(92, 111, 132, 0.16);
      --chart-axis: rgba(92, 111, 132, 0.34);
      --chart-tooltip-bg: rgba(255, 255, 255, 0.98);
      --chart-tooltip-border: rgba(138, 91, 18, 0.30);
      --inset-highlight: rgba(255, 255, 255, 0.86);
      --surface-sheen: rgba(255, 255, 255, 0.72);
      --surface-etch: rgba(138, 91, 18, 0.07);
      --surface-blueprint: rgba(18, 103, 173, 0.06);
      --card-shadow: 0 12px 28px rgba(37, 50, 66, 0.10), 0 1px 4px rgba(37, 50, 66, 0.08);
      --card-shadow-hover: 0 18px 38px rgba(37, 50, 66, 0.15), 0 2px 6px rgba(37, 50, 66, 0.10);
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { color-scheme: dark; }
    [data-theme="light"] { color-scheme: light; }
    body {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.024), transparent 15rem),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 44px),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 44px),
        linear-gradient(135deg, var(--bg) 0%, var(--bg-card-2) 56%, var(--bg) 100%);
      background-attachment: fixed;
      color: var(--text);
      padding: clamp(1rem, 2vw, 2rem);
      max-width: 1440px;
      margin: 0 auto;
      position: relative;
      isolation: isolate;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    [data-theme="light"] body {
      background:
        linear-gradient(180deg, rgba(18, 103, 173, 0.045), transparent 15rem),
        repeating-linear-gradient(90deg, rgba(23, 32, 43, 0.026) 0 1px, transparent 1px 44px),
        repeating-linear-gradient(0deg, rgba(23, 32, 43, 0.018) 0 1px, transparent 1px 44px),
        linear-gradient(135deg, var(--bg) 0%, var(--bg-card-2) 56%, var(--bg) 100%);
    }
    body:not(.auth-locked)::before {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background:
        linear-gradient(120deg, transparent 0 36%, rgba(214, 168, 75, 0.035) 36.3% 36.55%, transparent 36.9% 100%),
        linear-gradient(73deg, transparent 0 64%, rgba(107, 184, 255, 0.028) 64.2% 64.42%, transparent 64.8% 100%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.012) 0 1px, transparent 1px 13px);
      opacity: 0.72;
    }
    [data-theme="light"] body:not(.auth-locked)::before {
      background:
        linear-gradient(120deg, transparent 0 36%, rgba(138, 91, 18, 0.045) 36.3% 36.55%, transparent 36.9% 100%),
        linear-gradient(73deg, transparent 0 64%, rgba(18, 103, 173, 0.038) 64.2% 64.42%, transparent 64.8% 100%),
        repeating-linear-gradient(135deg, rgba(23, 32, 43, 0.020) 0 1px, transparent 1px 13px);
      opacity: 0.62;
    }
    .mono {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, monospace;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0;
    }
    h1 {
      color: var(--text);
      font-size: clamp(1.75rem, 4vw, 2.5rem);
      line-height: 1.05;
      margin-bottom: 0.4rem;
      font-weight: 700;
      letter-spacing: 0;
    }
    /* Brand wordmark: Inter Black, lowercase, with a blue signal period. */
    h1.brand {
      font-family: 'Inter', sans-serif;
      font-size: clamp(2.75rem, 5.2vw, 3.2rem);
      font-weight: 900;
      letter-spacing: 0;
      line-height: 0.95;
      text-transform: lowercase;
      margin: 0;
      text-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
    }
    h1.brand .accent {
      color: var(--accent);
      text-shadow: 0 0 18px rgba(107, 184, 255, 0.24);
    }
    .brand-lockup {
      display: flex;
      flex-direction: column;
      gap: 0;
      margin-bottom: 0.4rem;
    }
    .brand-eyebrow {
      font-family: 'Inter', sans-serif;
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-top: 0.55rem;
    }
    h2 {
      color: var(--text);
      font-size: 1rem;
      font-weight: 600;
      letter-spacing: 0;
    }
    .updated {
      color: var(--text-muted);
      font-size: 0.88rem;
      line-height: 1.5;
      max-width: 58ch;
      overflow-wrap: break-word;
      word-break: normal;
      text-wrap: pretty;
    }
    .action-version-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
      margin-top: 0.95rem;
      align-items: center;
    }
    .action-version-badge {
      display: inline-flex;
      align-items: stretch;
      overflow: hidden;
      border: 1px solid rgba(214, 168, 75, 0.20);
      border-radius: 8px;
      color: #ffffff;
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 0.74rem;
      line-height: 1;
      text-decoration: none;
      box-shadow: 0 1px 0 var(--inset-highlight) inset, 0 8px 18px rgba(0, 0, 0, 0.14);
      white-space: nowrap;
    }
    .action-version-badge:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .action-version-badge .badge-label {
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10), transparent),
        #2a313b;
      color: rgba(255, 255, 255, 0.86);
      padding: 0.32rem 0.5rem;
    }
    .action-version-badge .badge-value {
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), transparent),
        #137d68;
      color: #ffffff;
      font-weight: 700;
      padding: 0.32rem 0.5rem;
    }
    .action-version-badge.latest .badge-value { background: #137d68; }
    .action-version-badge.latest.different .badge-value { background: #1267ad; }
    .action-version-badge.latest.unknown .badge-value { background: #6d7786; }
    .action-version-link {
      color: var(--accent);
      font-size: 0.82rem;
      font-weight: 600;
      text-decoration: none;
      border-bottom: 1px dotted currentColor;
    }
    .action-version-link:hover {
      color: var(--text);
      border-bottom-color: currentColor;
    }
    .action-version-link:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .managed-docs-status {
      flex-basis: 100%;
      color: var(--text-muted);
      font-size: 0.8rem;
      line-height: 1.45;
    }
    .managed-docs-status strong {
      color: var(--text);
    }
    .tagline {
      color: var(--accent-2);
      font-size: 0.83rem;
      margin-bottom: 0.7rem;
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 0.32rem 0.58rem;
      border: 1px solid rgba(214, 168, 75, 0.22);
      border-radius: 999px;
      background: rgba(214, 168, 75, 0.085);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .pulse-dot {
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--accent-3);
      box-shadow: 0 0 0 0 rgba(79, 200, 165, 0.55);
      animation: pulse 2.2s ease-out infinite;
    }
    @keyframes pulse {
      0% { box-shadow: 0 0 0 0 rgba(79, 200, 165, 0.50); }
      80% { box-shadow: 0 0 0 10px rgba(79, 200, 165, 0); }
      100% { box-shadow: 0 0 0 0 rgba(79, 200, 165, 0); }
    }
    .hero {
      position: relative;
      overflow: hidden;
      display: flex;
      gap: 1.5rem;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 1.35rem;
      padding: clamp(1.1rem, 2.2vw, 1.7rem);
      border: 1px solid rgba(149, 166, 188, 0.18);
      border-radius: var(--radius-lg);
      background:
        linear-gradient(110deg, rgba(214, 168, 75, 0.13), transparent 26%),
        linear-gradient(290deg, rgba(107, 184, 255, 0.11), transparent 34%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.024) 0 1px, transparent 1px 12px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.004)),
        var(--bg-card);
      box-shadow: 0 1px 0 var(--inset-highlight) inset, var(--card-shadow);
    }
    .hero::before {
      content: "";
      position: absolute;
      inset: 0 0 auto;
      height: 3px;
      background: linear-gradient(90deg, var(--accent-2), var(--accent), var(--accent-3), var(--accent-4));
      opacity: 0.88;
    }
    .hero::after {
      content: "";
      position: absolute;
      right: 0;
      top: 0;
      width: min(28rem, 42%);
      height: 100%;
      pointer-events: none;
      background:
        repeating-linear-gradient(90deg, transparent 0 17px, rgba(255, 255, 255, 0.026) 17px 18px),
        linear-gradient(90deg, transparent, rgba(214, 168, 75, 0.08));
      clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
      opacity: 0.58;
    }
    .hero-copy {
      position: relative;
      z-index: 1;
      min-width: 0;
      flex: 1 1 32rem;
      min-width: min(100%, 20rem);
      max-width: min(62ch, 100%);
    }
    .hero-toolbar {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 0.15rem;
      flex: 1 1 26rem;
      min-width: 0;
      max-width: 100%;
    }
    .hero-toolbar-controls {
      display: flex;
      gap: 0.5rem;
      flex-wrap: nowrap;
      justify-content: flex-end;
      align-items: center;
      max-width: 100%;
      padding: 0.45rem;
      border: 1px solid var(--border-soft);
      border-radius: 999px;
      background: rgba(5, 8, 12, 0.34);
      box-shadow: 0 1px 0 var(--inset-highlight) inset;
    }
    [data-theme="light"] .hero-toolbar-controls {
      background: rgba(255, 255, 255, 0.72);
      border-color: rgba(74, 90, 110, 0.18);
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.86) inset, 0 8px 22px rgba(37, 50, 66, 0.08);
    }
    #activeBadge, #compareBadge { order: 1; }
    #clearSelectionBtn { order: 2; }
    #export-button { order: 3; }
    #export-hash-button { order: 4; }
    .export-verify-tip { order: 5; }
    #themeToggle { order: 6; }
    .controls-card {
      display: grid;
      grid-template-columns: minmax(12rem, 0.58fr) 290px minmax(24rem, 1.52fr);
      gap: 1.1rem;
      justify-content: space-between;
      align-items: stretch;
      margin-bottom: 1.1rem;
      background:
        linear-gradient(90deg, rgba(107, 184, 255, 0.085), transparent 30%),
        linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
    }
    .controls-card::after {
      background:
        linear-gradient(115deg, transparent 0 51%, rgba(214, 168, 75, 0.055) 51.2% 51.55%, transparent 51.9% 100%),
        linear-gradient(78deg, transparent 0 64%, rgba(79, 200, 165, 0.060) 64.15% 64.45%, transparent 64.7% 100%),
        repeating-conic-gradient(from 45deg, rgba(107, 184, 255, 0.030) 0 25%, transparent 0 50%) 0 0 / 22px 22px,
        repeating-linear-gradient(90deg, transparent 0 30px, rgba(255, 255, 255, 0.018) 30px 31px);
      opacity: 0.58;
    }
    .controls-main {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1rem;
      justify-content: flex-start;
      padding-top: 0.28rem;
    }
    .controls-group {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 0.55rem;
    }
    .controls-label {
      color: var(--accent-2);
      font-size: 0.76rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .segmented-control {
      display: inline-flex;
      flex-wrap: wrap;
      gap: 0.5rem;
    }
    .segmented-button {
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.004)),
        var(--bg-raised);
      color: var(--text);
      border-radius: 999px;
      padding: 0.5rem 0.9rem;
      cursor: pointer;
      font-size: 0.88rem;
      font-weight: 500;
      transition: border-color 150ms ease, background 150ms ease, color 150ms ease, transform 120ms ease;
    }
    .segmented-button:hover {
      border-color: rgba(107, 184, 255, 0.58);
      color: var(--text);
      background:
        linear-gradient(180deg, rgba(107, 184, 255, 0.12), rgba(255, 255, 255, 0.004)),
        var(--bg-raised);
    }
    .segmented-button:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .segmented-button.active {
      color: var(--text);
      border-color: rgba(214, 168, 75, 0.62);
      background:
        linear-gradient(180deg, rgba(214, 168, 75, 0.20), rgba(214, 168, 75, 0.08)),
        var(--bg-raised);
      box-shadow: inset 0 0 0 1px rgba(214, 168, 75, 0.14), 0 0 18px rgba(214, 168, 75, 0.10);
    }
    .controls-hint {
      color: var(--text-muted);
      font-size: 0.88rem;
      line-height: 1.45;
      max-width: 62ch;
    }
    .calendar-panel {
      align-self: start;
      width: 290px;
      border: 1px solid rgba(214, 168, 75, 0.18);
      border-radius: var(--radius);
      padding: 0.72rem 0.78rem 0.75rem;
      background:
        linear-gradient(150deg, rgba(214, 168, 75, 0.10), transparent 45%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.022) 0 1px, transparent 1px 9px),
        var(--bg-card-2);
    }
    .trust-playbook {
      align-self: start;
      min-width: 0;
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(107, 184, 255, 0.18);
      border-radius: var(--radius);
      padding: 0.86rem;
      background:
        radial-gradient(circle at 12% 18%, rgba(79, 200, 165, 0.13), transparent 28%),
        linear-gradient(135deg, rgba(107, 184, 255, 0.10), rgba(214, 168, 75, 0.045) 55%, transparent),
        var(--bg-card-2);
      box-shadow: 0 1px 0 var(--inset-highlight) inset;
    }
    .trust-playbook-head {
      position: relative;
      z-index: 1;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 1rem;
      margin-bottom: 0.76rem;
    }
    .trust-playbook h2,
    .trust-item h3 {
      margin: 0;
      color: var(--text);
      letter-spacing: 0;
    }
    .trust-playbook h2 {
      font-size: 1.02rem;
      line-height: 1.15;
    }
    .trust-playbook-head p {
      margin: 0.24rem 0 0;
      color: var(--text-muted);
      font-size: 0.78rem;
      line-height: 1.38;
      max-width: 66ch;
    }
    .trust-playbook-pill {
      flex: 0 0 auto;
      border: 1px solid rgba(79, 200, 165, 0.28);
      border-radius: 999px;
      color: var(--accent-3);
      background: rgba(79, 200, 165, 0.075);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.68rem;
      font-weight: 700;
      padding: 0.26rem 0.48rem;
      white-space: nowrap;
    }
    .trust-playbook-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 0.58rem;
    }
    .trust-item {
      min-width: 0;
      display: grid;
      grid-template-rows: auto auto 1fr auto auto;
      gap: 0.42rem;
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      padding: 0.68rem;
      background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.045), transparent 58%),
        rgba(5, 8, 12, 0.24);
    }
    [data-theme="light"] .trust-item {
      background:
        linear-gradient(150deg, rgba(255, 255, 255, 0.82), transparent 58%),
        rgba(255, 255, 255, 0.48);
    }
    .trust-item-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 0.45rem;
      min-width: 0;
    }
    .trust-item-level,
    .trust-item-label,
    .trust-item-scope {
      min-width: 0;
      color: var(--accent-2);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.07em;
      line-height: 1.2;
      text-transform: uppercase;
    }
    .trust-item-level {
      justify-self: start;
      border: 1px solid rgba(214, 168, 75, 0.28);
      border-radius: 999px;
      background: rgba(214, 168, 75, 0.08);
      color: var(--accent-2);
      padding: 0.18rem 0.38rem;
    }
    .trust-item-label {
      color: var(--accent-3);
    }
    .trust-item-scope {
      color: var(--text-dim);
      text-align: right;
      text-transform: none;
      letter-spacing: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .trust-item h3 {
      font-size: 0.84rem;
      line-height: 1.22;
    }
    .trust-item p {
      margin: 0;
      color: var(--text-muted);
      font-size: 0.72rem;
      line-height: 1.34;
    }
    .trust-item code {
      display: block;
      min-width: 0;
      border: 1px solid rgba(107, 184, 255, 0.18);
      border-radius: 7px;
      padding: 0.38rem 0.44rem;
      background: rgba(1, 4, 9, 0.28);
      color: var(--text);
      font-size: 0.66rem;
      line-height: 1.3;
      overflow-wrap: anywhere;
    }
    [data-theme="light"] .trust-item code {
      background: rgba(22, 35, 50, 0.06);
    }
    .trust-links {
      display: flex;
      gap: 0.42rem;
      flex-wrap: wrap;
      align-items: center;
    }
    .trust-links a {
      color: var(--accent);
      font-size: 0.68rem;
      font-weight: 760;
      text-decoration: none;
      border-bottom: 1px dotted rgba(107, 184, 255, 0.50);
    }
    .trust-links a:hover,
    .trust-links a:focus-visible {
      color: var(--accent-3);
      border-bottom-color: var(--accent-3);
      outline: none;
    }
    .trust-item-github-native {
      grid-column: 1 / -1;
      grid-template-columns: minmax(5.6rem, auto) minmax(12rem, 0.32fr) minmax(0, 1fr) auto;
      grid-template-rows: auto auto;
      grid-template-areas:
        "level title copy links"
        "label title copy links";
      align-items: center;
      column-gap: 0.75rem;
      row-gap: 0.25rem;
    }
    .trust-item-github-native .trust-item-head { grid-area: level; }
    .trust-item-github-native .trust-item-label { grid-area: label; }
    .trust-item-github-native h3 { grid-area: title; }
    .trust-item-github-native p { grid-area: copy; }
    .trust-item-github-native .trust-links {
      grid-area: links;
      justify-content: flex-end;
      min-width: 8rem;
    }
    .calendar-head {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 0.45rem;
      margin-bottom: 0.45rem;
    }
    .calendar-month-label {
      text-align: center;
      font-size: 0.95rem;
      font-weight: 700;
      letter-spacing: 0.01em;
      color: var(--text);
    }
    .calendar-nav {
      width: 1.9rem;
      height: 1.9rem;
      border-radius: 8px;
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent),
        var(--bg-raised);
      color: var(--text);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.95rem;
      cursor: pointer;
    }
    .calendar-nav:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }
    .calendar-weekdays {
      display: grid;
      grid-template-columns: repeat(7, minmax(0, 1fr));
      gap: 0.24rem;
      margin-bottom: 0.28rem;
      color: var(--text-dim);
      font-size: 0.68rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
    .calendar-weekday {
      text-align: center;
      font-weight: 700;
      padding: 0.15rem 0;
    }
    .calendar-grid {
      display: grid;
      grid-template-columns: repeat(7, minmax(0, 1fr));
      gap: 0.24rem;
      margin-bottom: 0.4rem;
    }
    .calendar-day {
      min-height: 1.78rem;
      border-radius: 6px;
      border: 1px solid var(--border-soft);
      background: var(--bg-card);
      color: var(--text-muted);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.76rem;
      font-variant-numeric: tabular-nums;
      position: relative;
      transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
    }
    .calendar-day.blank {
      border: none;
      background: transparent;
    }
    .calendar-day:not(.blank) {
      cursor: help;
    }
    .calendar-day:not(.blank):hover {
      transform: translateY(-1px);
      box-shadow: 0 2px 10px rgba(1, 4, 9, 0.22);
    }
    .calendar-day:not(.blank):focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 1px;
    }
    .calendar-day.no-run {
      color: var(--text-dim);
      background:
        repeating-linear-gradient(
          135deg,
          rgba(148, 163, 184, 0.11) 0 3px,
          rgba(148, 163, 184, 0.02) 3px 6px
        ),
        var(--bg-card);
      border-color: rgba(148, 163, 184, 0.34);
    }
    .calendar-day.ok {
      color: var(--text);
      background: rgba(79, 200, 165, 0.12);
      border-color: rgba(79, 200, 165, 0.52);
    }
    .calendar-day.zero {
      color: var(--text);
      background: rgba(214, 168, 75, 0.14);
      border-color: rgba(214, 168, 75, 0.62);
    }
    .calendar-day.lag {
      color: var(--text);
      background:
        repeating-linear-gradient(
          135deg,
          rgba(107, 184, 255, 0.20) 0 3px,
          rgba(107, 184, 255, 0.06) 3px 6px
        ),
        rgba(107, 184, 255, 0.08);
      border-color: rgba(107, 184, 255, 0.72);
    }
    .calendar-day.gap {
      color: var(--text);
      background:
        repeating-linear-gradient(
          45deg,
          rgba(255, 107, 107, 0.22) 0 3px,
          rgba(255, 107, 107, 0.06) 3px 6px
        ),
        repeating-linear-gradient(
          -45deg,
          rgba(255, 107, 107, 0.16) 0 2px,
          transparent 2px 5px
        ),
        rgba(255, 107, 107, 0.06);
      border-color: rgba(255, 107, 107, 0.78);
    }
    .calendar-day.gap::after {
      position: absolute;
      top: 1px;
      right: 2px;
      font-size: 0.5rem;
      font-weight: 700;
      line-height: 1;
      opacity: 0.95;
    }
    .calendar-day.gap::after {
      content: '▲';
      color: var(--c-negative);
    }
    .calendar-day.lag::before {
      content: '•';
      position: absolute;
      top: 0;
      left: 3px;
      color: var(--accent);
      font-size: 0.78rem;
      line-height: 1;
      opacity: 0.95;
    }
    .calendar-hint {
      margin: 0;
      color: var(--text-muted);
      font-size: 0.79rem;
      line-height: 1.35;
    }
    .calendar-day-detail {
      margin: 0.33rem 0 0;
      color: var(--text-dim);
      font-size: 0.73rem;
      line-height: 1.35;
      min-height: 2.05em;
    }
    .toolbar-button {
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.005)),
        var(--bg-raised);
      color: var(--text);
      border-radius: 999px;
      padding: 0.55rem 0.9rem;
      cursor: pointer;
      font-size: 0.86rem;
      font-weight: 500;
      display: none;
      align-items: center;
      justify-content: center;
      line-height: 1.2;
      white-space: nowrap;
      box-shadow: 0 1px 0 var(--inset-highlight) inset;
      transition: border-color 150ms ease, color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .toolbar-button.visible { display: inline-flex; }
    .toolbar-button:hover {
      border-color: rgba(107, 184, 255, 0.58);
      color: var(--accent);
      background: rgba(107, 184, 255, 0.10);
      transform: translateY(-1px);
    }
    .toolbar-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .toolbar-button:disabled {
      cursor: not-allowed;
      color: var(--text-dim);
      border-color: var(--border-soft);
      background: var(--bg-raised);
    }
    .export-verify-tip {
      position: relative;
      display: inline-flex;
      align-items: center;
    }
    .export-verify-tip > summary {
      list-style: none;
      margin: 0;
    }
    .export-verify-tip > summary::-webkit-details-marker {
      display: none;
    }
    .export-verify-tip[open] > summary {
      border-color: rgba(214, 168, 75, 0.62);
      color: var(--accent-2);
      background: rgba(214, 168, 75, 0.13);
    }
    .dashboard-notice-region[hidden] {
      display: none;
    }
    .dashboard-notice {
      border: 1px solid var(--border);
      border-left: 4px solid var(--c-negative);
      border-radius: var(--radius);
      background:
        linear-gradient(90deg, rgba(255, 107, 107, 0.08), transparent 28%),
        var(--bg-card);
      box-shadow: 0 1px 0 var(--inset-highlight) inset, var(--card-shadow);
      color: var(--text);
      display: grid;
      gap: 0.75rem;
      margin: -0.25rem 0 1.2rem;
      padding: 0.95rem 1rem;
    }
    .dashboard-notice.warning {
      border-left-color: var(--accent-2);
    }
    .dashboard-notice-main {
      align-items: flex-start;
      display: flex;
      gap: 0.85rem;
      justify-content: space-between;
      min-width: 0;
    }
    .dashboard-notice-copy {
      display: grid;
      gap: 0.25rem;
      min-width: 0;
    }
    .dashboard-notice-title {
      color: var(--text);
      font-size: 0.92rem;
      font-weight: 700;
      line-height: 1.25;
    }
    .dashboard-notice-message {
      color: var(--text-muted);
      font-size: 0.84rem;
      line-height: 1.4;
    }
    .dashboard-notice-actions {
      display: flex;
      flex: 0 0 auto;
      flex-wrap: wrap;
      gap: 0.45rem;
      justify-content: flex-end;
    }
    .dashboard-notice-actions .toolbar-button {
      padding: 0.45rem 0.72rem;
    }
    .dashboard-notice-details {
      border-top: 1px solid var(--border-soft);
      color: var(--text-muted);
      font-size: 0.8rem;
      min-width: 0;
      padding-top: 0.65rem;
    }
    .dashboard-notice-details > summary {
      color: var(--text);
      cursor: pointer;
      font-weight: 600;
      list-style-position: inside;
    }
    .dashboard-notice-diagnostics {
      background: var(--bg-card-2);
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      color: var(--text-muted);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, monospace;
      font-size: 0.74rem;
      line-height: 1.45;
      margin-top: 0.65rem;
      max-height: 18rem;
      overflow: auto;
      padding: 0.75rem;
      white-space: pre-wrap;
      word-break: break-word;
    }
    .export-verify-popover {
      position: absolute;
      top: calc(100% + 0.45rem);
      right: 0;
      width: min(35rem, 92vw);
      padding: 0.75rem 0.85rem;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--bg-card);
      color: var(--text-muted);
      font-size: 0.82rem;
      line-height: 1.4;
      box-shadow: var(--card-shadow);
      z-index: 20;
    }
    .export-verify-tip:not([open]) .export-verify-popover {
      display: none;
    }
    .export-verify-popover p + p {
      margin-top: 0.5rem;
    }
    .export-verify-popover code {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 0.8rem;
      color: var(--text);
      background: var(--bg-raised);
      border: 1px solid var(--border-soft);
      border-radius: 6px;
      padding: 0.1rem 0.35rem;
      white-space: nowrap;
    }
    .theme-toggle { gap: 0.4rem; }
    .theme-toggle .theme-icon { font-size: 1rem; line-height: 1; }
    #export-status {
      margin: 0.15rem 0 0;
      min-height: 0;
      font-size: 0.82rem;
      line-height: 1.35;
      padding: 0.32rem 0.65rem;
      border-radius: 999px;
      border: 1px solid transparent;
      background: transparent;
      color: var(--text-muted);
      align-self: flex-end;
      max-width: min(40rem, 100%);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      display: none;
    }
    #export-status.visible { display: inline-flex; align-items: center; }
    #export-status.visible.multiline {
      display: inline-flex;
      align-items: flex-start;
      white-space: pre-line;
      overflow: visible;
      text-overflow: clip;
      border-radius: 12px;
      line-height: 1.3;
    }
    #export-status.pending {
      color: #d29922;
      border-color: rgba(210, 153, 34, 0.34);
      background: rgba(210, 153, 34, 0.12);
    }
    #export-status.success {
      color: var(--c-positive);
      border-color: rgba(79, 200, 165, 0.34);
      background: rgba(79, 200, 165, 0.12);
    }
    #export-status.error {
      color: var(--c-negative);
      border-color: rgba(255, 107, 107, 0.34);
      background: rgba(255, 107, 107, 0.12);
    }
    .status-badge {
      display: none;
      border-radius: 999px;
      padding: 0.55rem 0.9rem;
      font-size: 0.86rem;
      font-weight: 500;
      letter-spacing: 0.01em;
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.050), rgba(255, 255, 255, 0.006)),
        var(--bg-raised);
      color: var(--text-muted);
      line-height: 1.2;
      white-space: nowrap;
    }
    .status-badge.visible { display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem; }
    .status-badge.active { color: var(--text); border-color: rgba(107, 184, 255, 0.36); background: rgba(107, 184, 255, 0.10); }
    .status-badge.compare { color: var(--text); border-color: rgba(79, 200, 165, 0.32); background: rgba(79, 200, 165, 0.10); }
    .card {
      position: relative;
      overflow: hidden;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.038), rgba(255, 255, 255, 0.004)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.014) 0 1px, transparent 1px 11px),
        linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      padding: 1.15rem;
      margin-bottom: 1.1rem;
      box-shadow: 0 1px 0 var(--inset-highlight) inset, var(--card-shadow);
      min-width: 0;
    }
    .card > * {
      position: relative;
      z-index: 1;
    }
    .card::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        linear-gradient(90deg, transparent, rgba(214, 168, 75, 0.035), transparent),
        linear-gradient(180deg, rgba(107, 184, 255, 0.028), transparent 8rem);
      opacity: 0.62;
    }
    .chart-grid > *, .section-grid > * { min-width: 0; }
    .stats-grid {
      display: grid;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      gap: 1rem;
      margin-bottom: 1.3rem;
    }
    .stat-card {
      position: relative;
      overflow: hidden;
      min-height: 168px;
      padding: 1.1rem 1.1rem 1rem;
      display: grid;
      grid-template-rows: auto 1fr auto;
      gap: 0.62rem;
      background:
        linear-gradient(160deg, var(--metric-wash, rgba(107, 184, 255, 0.13)), transparent 48%),
        var(--metric-texture, repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.016) 0 1px, transparent 1px 12px)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.050), rgba(255, 255, 255, 0.004)),
        var(--bg-card);
      transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
    }
    .stat-card:hover {
      transform: translateY(-1px);
      border-color: var(--metric-color, var(--accent));
      box-shadow: 0 1px 0 var(--inset-highlight) inset, var(--card-shadow-hover);
    }
    @keyframes spark-draw {
      from { stroke-dashoffset: 1; }
      to { stroke-dashoffset: 0; }
    }
    .stat-spark path.line {
      stroke-dasharray: 1;
      animation: spark-draw 900ms ease-out 80ms both;
    }
    .stat-card::after {
      background:
        linear-gradient(var(--metric-rail-angle, 118deg), transparent 0 45%, var(--metric-glow, rgba(107, 184, 255, 0.14)) 45.15% 45.45%, transparent 45.8% 100%),
        linear-gradient(90deg, transparent 0 58%, rgba(255, 255, 255, 0.028) 58% 59%, transparent 68%),
        repeating-linear-gradient(0deg, transparent 0 23px, rgba(255, 255, 255, 0.012) 23px 24px);
      opacity: 0.76;
    }
    .stat-card::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 3px;
      background: linear-gradient(180deg, var(--metric-color, var(--accent)), transparent);
      opacity: 0.95;
    }
    .stat-card[data-metric="repos"] {
      --metric-color: var(--accent);
      --metric-wash: rgba(107, 184, 255, 0.13);
      --metric-glow: rgba(107, 184, 255, 0.18);
      --metric-rail-angle: 112deg;
      --metric-texture:
        repeating-linear-gradient(90deg, rgba(107, 184, 255, 0.040) 0 1px, transparent 1px 18px),
        repeating-linear-gradient(0deg, rgba(107, 184, 255, 0.024) 0 1px, transparent 1px 18px);
    }
    .stat-card[data-metric="views"] {
      --metric-color: var(--c-views);
      --metric-wash: rgba(107, 184, 255, 0.18);
      --metric-glow: rgba(107, 184, 255, 0.24);
      --metric-rail-angle: 122deg;
      --metric-texture:
        linear-gradient(115deg, transparent 0 38%, rgba(107, 184, 255, 0.045) 38.2% 38.8%, transparent 39.2% 100%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.017) 0 1px, transparent 1px 10px);
    }
    .stat-card[data-metric="uniques"] {
      --metric-color: var(--c-uniques);
      --metric-wash: rgba(79, 200, 165, 0.16);
      --metric-glow: rgba(79, 200, 165, 0.20);
      --metric-rail-angle: 64deg;
      --metric-texture:
        repeating-linear-gradient(45deg, rgba(79, 200, 165, 0.040) 0 1px, transparent 1px 14px),
        repeating-linear-gradient(-45deg, rgba(79, 200, 165, 0.022) 0 1px, transparent 1px 18px);
    }
    .stat-card[data-metric="clones"] {
      --metric-color: var(--c-clones);
      --metric-wash: rgba(217, 126, 183, 0.16);
      --metric-glow: rgba(217, 126, 183, 0.20);
      --metric-rail-angle: 136deg;
      --metric-texture:
        repeating-linear-gradient(90deg, rgba(217, 126, 183, 0.040) 0 7px, transparent 7px 14px),
        repeating-linear-gradient(0deg, rgba(217, 126, 183, 0.020) 0 7px, transparent 7px 14px);
    }
    .stat-card[data-metric="cloners"] {
      --metric-color: var(--c-cloners);
      --metric-wash: rgba(240, 183, 90, 0.15);
      --metric-glow: rgba(240, 183, 90, 0.20);
      --metric-rail-angle: 48deg;
      --metric-texture:
        repeating-conic-gradient(from 45deg, rgba(240, 183, 90, 0.046) 0 25%, transparent 0 50%) 0 0 / 18px 18px,
        linear-gradient(100deg, transparent 0 28%, rgba(240, 183, 90, 0.034) 28.2% 28.7%, transparent 29% 100%);
    }
    .stat-card[data-metric="stars"] { --metric-color: var(--accent-2); }
    .stat-card[data-metric="repos"] { grid-column: span 2; }
    .stat-card[data-metric="views"] { grid-column: span 4; }
    .stat-card[data-metric="uniques"] { grid-column: span 2; }
    .stat-card[data-metric="clones"] { grid-column: span 2; }
    .stat-card[data-metric="cloners"] { grid-column: span 2; }
    .growth-model-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.85rem;
      margin-bottom: 1.2rem;
    }
    .growth-stage {
      min-height: 118px;
      display: grid;
      gap: 0.5rem;
      align-content: start;
      border-color: rgba(214, 168, 75, 0.18);
      background:
        linear-gradient(130deg, var(--growth-wash, rgba(107, 184, 255, 0.11)), transparent 58%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 16px),
        linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
    }
    .growth-stage:nth-child(1) { --growth-wash: rgba(107, 184, 255, 0.15); --growth-stage-color: var(--c-views); }
    .growth-stage:nth-child(2) { --growth-wash: rgba(214, 168, 75, 0.15); --growth-stage-color: var(--accent-2); }
    .growth-stage:nth-child(3) { --growth-wash: rgba(79, 200, 165, 0.14); --growth-stage-color: var(--accent-3); }
    .growth-stage::before {
      content: "";
      position: absolute;
      left: 1.05rem;
      right: 1.05rem;
      top: 0;
      height: 2px;
      background: linear-gradient(90deg, var(--growth-stage-color, var(--accent)), transparent);
      opacity: 0.88;
    }
    .growth-stage-title {
      color: var(--text-muted);
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }
    .growth-stage-value {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, monospace;
      font-size: clamp(1.35rem, 2vw, 1.9rem);
      font-weight: 650;
      line-height: 1.1;
      text-shadow: 0 12px 24px rgba(0, 0, 0, 0.24);
    }
    .growth-stage-context {
      color: var(--text-muted);
      font-size: 0.82rem;
      line-height: 1.35;
    }
    .opportunity-section {
      margin-bottom: 1.1rem;
    }
    .opportunity-card {
      border-color: rgba(107, 184, 255, 0.18);
      background:
        linear-gradient(135deg, rgba(107, 184, 255, 0.08), transparent 42%, rgba(79, 200, 165, 0.06)),
        var(--bg-card);
    }
    .opportunity-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.36fr);
      gap: 1rem;
      align-items: stretch;
    }
    .opportunity-map {
      height: clamp(18rem, 32vw, 25rem);
      min-height: 18rem;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        radial-gradient(circle at 78% 20%, rgba(79, 200, 165, 0.10), transparent 28%),
        radial-gradient(circle at 82% 78%, rgba(214, 168, 75, 0.10), transparent 30%),
        var(--bg-card-2);
      overflow: hidden;
    }
    .opportunity-map svg {
      display: block;
      width: 100%;
      height: 100%;
      min-height: 0;
    }
    .map-frame {
      fill: rgba(255, 255, 255, 0.018);
      stroke: var(--border);
      stroke-width: 0.45;
    }
    .map-grid {
      fill: url(#opportunity-grid);
      opacity: 0.35;
    }
    #opportunity-grid path {
      stroke: rgba(255, 255, 255, 0.16);
      stroke-width: 0.25;
    }
    .map-midline {
      stroke: var(--border);
      stroke-dasharray: 1.6 1.4;
      stroke-width: 0.45;
      opacity: 0.85;
    }
    .map-zone {
      fill: var(--text-dim);
      font-size: 2.05px;
      font-weight: 800;
      letter-spacing: 0.09em;
      text-transform: uppercase;
    }
    .zone-amplify { fill: var(--c-positive); }
    .zone-clarify { fill: var(--accent-2); }
    .zone-niche { fill: var(--accent); }
    .map-axis {
      fill: var(--text-muted);
      font-size: 2.25px;
      font-weight: 700;
      letter-spacing: 0.04em;
    }
    .opportunity-point {
      cursor: pointer;
      outline: none;
    }
    .opportunity-point .point-halo {
      fill: var(--point-color, var(--accent));
      opacity: 0.10;
    }
    .opportunity-point .point-dot {
      fill: var(--point-color, var(--accent));
      stroke: rgba(255, 255, 255, 0.58);
      stroke-width: 0.36;
      filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.22));
    }
    .opportunity-point text {
      fill: var(--text);
      paint-order: stroke;
      stroke: var(--bg-card-2);
      stroke-width: 0.48px;
      stroke-linejoin: round;
      font-size: 1.48px;
      font-weight: 700;
      text-anchor: middle;
      pointer-events: none;
    }
    .opportunity-point:hover .point-dot,
    .opportunity-point:focus-visible .point-dot {
      stroke: var(--text);
      stroke-width: 0.75;
    }
    .opportunity-notes {
      display: grid;
      align-content: start;
      gap: 0.6rem;
      min-width: 0;
    }
    .opportunity-note {
      display: grid;
      gap: 0.24rem;
      width: 100%;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.035), transparent),
        var(--bg-card-2);
      color: var(--text);
      cursor: pointer;
      padding: 0.72rem 0.82rem;
      text-align: left;
      transition: border-color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .opportunity-note:hover {
      border-color: rgba(107, 184, 255, 0.45);
      background: rgba(107, 184, 255, 0.055);
    }
    .opportunity-note:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .note-repo {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.82rem;
      font-weight: 700;
      overflow-wrap: anywhere;
    }
    .note-label {
      color: var(--accent-2);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .note-meta {
      color: var(--text-muted);
      font-size: 0.78rem;
      font-variant-numeric: tabular-nums;
    }
    .event-graph-section {
      margin-bottom: 1.1rem;
    }
    .event-graph-card {
      border-color: rgba(79, 200, 165, 0.18);
      background:
        linear-gradient(125deg, rgba(79, 200, 165, 0.075), transparent 44%, rgba(217, 126, 183, 0.055)),
        var(--bg-card);
    }
    .event-graph-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.42fr);
      gap: 1rem;
      align-items: stretch;
    }
    .event-graph-canvas {
      height: clamp(11rem, 18vw, 15rem);
      min-height: 10rem;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.020), transparent),
        radial-gradient(circle at 18% 24%, rgba(79, 200, 165, 0.10), transparent 24%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 24px),
        linear-gradient(180deg, var(--bg-card-2), var(--bg-card));
      overflow: hidden;
    }
    .event-graph-canvas svg {
      display: block;
      width: 100%;
      height: 100%;
      min-height: 0;
    }
    .git-lane-label {
      fill: var(--text-muted);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 2.1px;
      font-weight: 700;
    }
    .git-rail {
      stroke: var(--event-color, var(--accent));
      stroke-width: 0.8;
      stroke-linecap: round;
      opacity: 0.62;
    }
    .git-branch-link {
      fill: none;
      stroke: var(--event-color, var(--accent));
      stroke-width: 0.55;
      stroke-linecap: round;
      opacity: 0.46;
    }
    .git-event-node {
      cursor: pointer;
      outline: none;
    }
    .git-event-dot,
    .git-event-tag {
      fill: var(--event-color, var(--accent));
      stroke: rgba(255, 255, 255, 0.72);
      stroke-width: 0.55;
      filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.28));
    }
    .git-event-node.type-release .git-event-tag {
      fill: var(--accent-2);
      stroke: rgba(255, 255, 255, 0.78);
    }
    .git-event-node.class-docs .git-event-dot {
      fill: var(--accent);
    }
    .git-event-kicker,
    .git-axis {
      fill: var(--text-dim);
      font-size: 1.9px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .git-axis-end {
      text-anchor: end;
    }
    .event-ribbon-axis {
      stroke: rgba(164, 177, 193, 0.42);
      stroke-dasharray: 1.4 2.2;
      stroke-linecap: round;
      stroke-width: 0.65;
    }
    .event-ribbon-label {
      fill: var(--accent-2);
      font-size: 2.1px;
      font-weight: 850;
      letter-spacing: 0.09em;
      text-transform: uppercase;
    }
    .event-cluster {
      --event-color: var(--accent);
      cursor: default;
      outline: none;
    }
    .event-cluster[data-repo] {
      cursor: pointer;
    }
    .event-cluster-stem {
      stroke: var(--event-color, var(--accent));
      stroke-linecap: round;
      stroke-width: 1.05;
      opacity: 0.62;
    }
    .event-cluster-dot {
      fill: color-mix(in srgb, var(--event-color, var(--accent)) 88%, var(--bg-card));
      stroke: rgba(255, 255, 255, 0.72);
      stroke-width: 0.55;
      filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.30));
    }
    .event-cluster-release {
      fill: var(--accent-2);
      stroke: rgba(255, 255, 255, 0.84);
      stroke-width: 0.58;
      filter: drop-shadow(0 3px 7px rgba(0, 0, 0, 0.30));
    }
    .event-cluster:hover .event-cluster-dot,
    .event-cluster:focus-visible .event-cluster-dot,
    .event-cluster:hover .event-cluster-release,
    .event-cluster:focus-visible .event-cluster-release {
      stroke: var(--text);
      stroke-width: 0.82;
    }
    .git-event-node:hover .git-event-dot,
    .git-event-node:focus-visible .git-event-dot,
    .git-event-node:hover .git-event-tag,
    .git-event-node:focus-visible .git-event-tag {
      stroke: var(--text);
      stroke-width: 0.82;
    }
    .event-log {
      display: grid;
      align-content: start;
      gap: 0.55rem;
      min-width: 0;
    }
    .event-log-item {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 0.28rem 0.5rem;
      width: 100%;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        linear-gradient(90deg, color-mix(in srgb, var(--event-color, var(--accent)) 12%, transparent), transparent 62%),
        var(--bg-card-2);
      color: var(--text);
      cursor: pointer;
      padding: 0.68rem 0.76rem;
      text-align: left;
      transition: border-color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .event-log-item:hover {
      border-color: var(--event-color, var(--accent));
      transform: translateY(-1px);
    }
    .event-log-item:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .event-log-kind {
      align-self: start;
      border: 1px solid color-mix(in srgb, var(--event-color, var(--accent)) 52%, transparent);
      border-radius: 999px;
      color: var(--text);
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 0.07em;
      line-height: 1.1;
      padding: 0.2rem 0.4rem;
      text-transform: uppercase;
    }
    .event-log-kind.type-release {
      border-color: rgba(214, 168, 75, 0.52);
      color: var(--accent-2);
    }
    .event-log-title {
      font-size: 0.82rem;
      font-weight: 650;
      line-height: 1.25;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .event-log-meta {
      grid-column: 2 / 3;
      color: var(--text-muted);
      font-size: 0.74rem;
      font-variant-numeric: tabular-nums;
      line-height: 1.25;
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .event-graph-empty {
      align-items: center;
      display: flex;
      justify-content: center;
      min-height: 17rem;
      padding: 1rem;
      text-align: center;
    }
    .readiness-section {
      margin-bottom: 1.1rem;
    }
    .readiness-card {
      border-color: rgba(214, 168, 75, 0.18);
      background:
        linear-gradient(120deg, rgba(214, 168, 75, 0.085), transparent 38%, rgba(107, 184, 255, 0.055)),
        var(--bg-card);
    }
    .readiness-layout {
      display: grid;
      grid-template-columns: minmax(16rem, 0.42fr) minmax(0, 1fr);
      gap: 1rem;
      align-items: start;
    }
    .readiness-summary {
      display: grid;
      gap: 0.75rem;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background: var(--bg-card-2);
      padding: 0.85rem;
    }
    .readiness-score {
      display: grid;
      gap: 0.24rem;
      min-width: 0;
    }
    .readiness-score-value {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: clamp(1.55rem, 2vw, 2.05rem);
      font-weight: 700;
      line-height: 1;
    }
    .readiness-score-meta {
      color: var(--text-muted);
      font-size: 0.78rem;
      line-height: 1.35;
    }
    .readiness-bars {
      display: grid;
      gap: 0.45rem;
    }
    .readiness-row {
      display: grid;
      grid-template-columns: minmax(5.8rem, 0.9fr) minmax(4rem, 1fr) auto;
      gap: 0.5rem;
      align-items: center;
      color: var(--text-muted);
      font-size: 0.76rem;
      min-width: 0;
    }
    .readiness-track {
      height: 0.48rem;
      border: 1px solid var(--border-soft);
      border-radius: 999px;
      background: rgba(148, 163, 184, 0.10);
      overflow: hidden;
    }
    .readiness-track span {
      display: block;
      width: var(--readiness-pct, 0%);
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--accent-2), var(--accent-3));
    }
    .readiness-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.65rem;
      min-width: 0;
    }
    .readiness-fix {
      display: grid;
      gap: 0.42rem;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        linear-gradient(110deg, rgba(255, 255, 255, 0.035), transparent 60%),
        var(--bg-card-2);
      color: var(--text);
      cursor: pointer;
      padding: 0.78rem 0.84rem;
      text-align: left;
      transition: border-color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .readiness-fix:hover {
      border-color: rgba(214, 168, 75, 0.52);
      background: rgba(214, 168, 75, 0.055);
      transform: translateY(-1px);
    }
    .readiness-fix:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }
    .readiness-fix-head {
      display: flex;
      justify-content: space-between;
      gap: 0.5rem;
      min-width: 0;
    }
    .readiness-repo {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.82rem;
      font-weight: 700;
      overflow-wrap: anywhere;
    }
    .readiness-meta {
      color: var(--text-muted);
      flex: 0 0 auto;
      font-size: 0.72rem;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }
    .readiness-file {
      justify-self: start;
      border: 1px solid rgba(214, 168, 75, 0.34);
      border-radius: 999px;
      color: var(--accent-2);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.68rem;
      font-weight: 700;
      line-height: 1.2;
      max-width: 100%;
      overflow-wrap: anywhere;
      padding: 0.22rem 0.46rem;
    }
    .readiness-action {
      color: var(--text-muted);
      font-size: 0.78rem;
      line-height: 1.35;
    }
    .readiness-learn {
      align-self: end;
      justify-self: start;
      min-width: 0;
    }
    .readiness-learn a {
      color: var(--accent);
      font-size: 0.72rem;
      font-weight: 750;
      text-decoration: none;
      border-bottom: 1px dotted rgba(107, 184, 255, 0.48);
    }
    .readiness-learn a:hover,
    .readiness-learn a:focus-visible {
      color: var(--accent-3);
      border-bottom-color: var(--accent-3);
      outline: none;
    }
    .growth-cell {
      display: inline-grid;
      gap: 0.2rem;
      min-width: 180px;
      justify-content: end;
    }
    .growth-row {
      display: grid;
      grid-template-columns: minmax(3.25rem, max-content) minmax(4.5rem, max-content) minmax(4rem, max-content);
      align-items: baseline;
      column-gap: 0.45rem;
      white-space: nowrap;
    }
    .growth-label,
    .growth-total {
      color: var(--text-muted);
    }
    .growth-label {
      text-align: left;
    }
    .growth-total {
      text-align: right;
    }
    .community-cell {
      display: inline-grid;
      gap: 0.2rem;
      min-width: 150px;
    }
    .community-health {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.94rem;
      font-weight: 700;
      font-variant-numeric: tabular-nums;
      color: var(--text);
    }
    .community-meta {
      color: var(--text-muted);
      font-size: 0.77rem;
      line-height: 1.25;
      white-space: nowrap;
    }
    .community-cell.excellent .community-health {
      color: var(--c-positive);
    }
    .community-cell.moderate .community-health {
      color: var(--accent);
    }
    .community-cell.needs-work .community-health {
      color: var(--c-negative);
    }
    .stat-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.5rem;
    }
    .stat-value {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, Consolas, monospace;
      font-variant-numeric: tabular-nums;
      font-size: clamp(1.7rem, 2.4vw, 2.3rem);
      line-height: 1;
      font-weight: 600;
      letter-spacing: 0;
      align-self: end;
    }
    .stat-card[data-metric="views"] .stat-value {
      font-size: clamp(2.05rem, 3vw, 2.7rem);
    }
    .stat-label {
      color: var(--text-muted);
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
    }
    .stat-delta {
      display: inline-flex;
      align-items: center;
      gap: 0.25rem;
      font-size: 0.74rem;
      font-weight: 600;
      padding: 0.2rem 0.45rem;
      border-radius: 999px;
      border: 1px solid transparent;
      font-variant-numeric: tabular-nums;
      white-space: nowrap;
    }
    .stat-delta.up { color: var(--c-positive); background: rgba(79, 200, 165, 0.10); border-color: rgba(79, 200, 165, 0.28); }
    .stat-delta.down { color: var(--c-negative); background: rgba(255, 107, 107, 0.10); border-color: rgba(255, 107, 107, 0.28); }
    .stat-delta.flat { color: var(--text-muted); background: rgba(139, 148, 158, 0.08); border-color: rgba(139, 148, 158, 0.22); }
    .stat-delta.hidden { display: none; }
    .stat-spark {
      height: 46px;
      width: 100%;
      display: block;
      opacity: 1;
      filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.20));
    }
    .stat-spark path.line {
      fill: none;
      stroke-width: 2.15;
      stroke-linejoin: round;
      stroke-linecap: round;
    }
    .stat-spark path.spark-glow {
      fill: none;
      stroke-width: 5.2;
      stroke-linejoin: round;
      stroke-linecap: round;
      opacity: 0.18;
      filter: blur(1.5px);
    }
    .stat-spark path.area {
      stroke: none;
      opacity: 1;
    }
    .stat-spark path.spark-pattern {
      stroke: none;
      opacity: 0.55;
      mix-blend-mode: screen;
    }
    .stat-spark .spark-terminal {
      stroke: var(--bg-card);
      stroke-width: 1.25;
      filter: drop-shadow(0 0 6px currentColor);
    }
    .dashboard-hidden { display: none; }
    .compare-summary {
      display: none;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 0.85rem;
      margin-bottom: 1.2rem;
    }
    .compare-summary.visible { display: grid; }
    .compare-card {
      position: relative;
      overflow: hidden;
      border-radius: var(--radius-lg);
      padding: 1rem 1.05rem 0.95rem;
      background: linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
      border: 1px solid var(--border);
      box-shadow: var(--card-shadow);
    }
    .compare-card::before {
      content: '';
      position: absolute;
      inset: 0 0 auto 0;
      height: 2px;
      background: var(--repo-color, var(--accent));
    }
    .compare-header {
      display: flex;
      align-items: center;
      gap: 0.55rem;
      margin-bottom: 0.6rem;
      color: var(--text);
      font-weight: 600;
      letter-spacing: 0;
    }
    .color-dot {
      width: 10px;
      height: 10px;
      border-radius: 999px;
      flex: 0 0 auto;
      background: var(--repo-color, var(--accent));
    }
    .compare-metric-row {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: 0.6rem;
      margin-top: 0.25rem;
    }
    .compare-metric-row.primary .compare-metric-value {
      font-size: 1.5rem;
      color: var(--text);
    }
    .compare-metric-value {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-variant-numeric: tabular-nums;
      font-size: 1rem;
      font-weight: 600;
    }
    .compare-metric-value.muted { color: var(--text-muted); font-weight: 500; }
    .compare-metric-label {
      color: var(--text-muted);
      font-size: 0.74rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .chart-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.65fr) minmax(19rem, 0.95fr);
      gap: 1.1rem;
      margin-bottom: 1.1rem;
    }
    .chart-grid > .card:first-child {
      border-color: rgba(107, 184, 255, 0.26);
      background:
        linear-gradient(105deg, rgba(107, 184, 255, 0.12), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.044), rgba(255, 255, 255, 0.004)),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.014) 0 1px, transparent 1px 11px),
        var(--bg-card);
    }
    .chart-grid > .card:first-child .chart-container {
      height: 380px;
    }
    #weekday-card {
      align-self: stretch;
      border-color: rgba(214, 168, 75, 0.20);
      background:
        linear-gradient(140deg, rgba(214, 168, 75, 0.11), transparent 44%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.040), rgba(255, 255, 255, 0.004)),
        var(--bg-card);
    }
    .section-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 0.8rem;
      margin-bottom: 0.8rem;
      flex-wrap: wrap;
    }
    .section-copy { min-width: 0; }
    .section-actions {
      display: inline-flex;
      gap: 0.4rem;
      flex-wrap: wrap;
      align-items: center;
    }
    .click-hint { color: var(--text-muted); font-size: 0.83rem; line-height: 1.45; }
    .chart-container {
      position: relative;
      height: 320px;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      padding: 0.45rem;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.020), transparent),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.014) 0 1px, transparent 1px 28px),
        var(--bg-card-2);
    }
    .chart-container.tall { height: 360px; }
    .metric-tabs {
      display: inline-flex;
      flex-wrap: wrap;
      gap: 0.3rem;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent),
        var(--bg-card-2);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 0.25rem;
    }
    .metric-tab {
      border: 1px solid transparent;
      background: transparent;
      color: var(--text-muted);
      border-radius: 9px;
      padding: 0.4rem 0.7rem;
      font-size: 0.82rem;
      font-weight: 600;
      letter-spacing: 0.01em;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
    }
    .metric-tab .swatch {
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--metric-color, var(--text-muted));
    }
    .metric-tab[data-metric="views"] { --metric-color: var(--c-views); }
    .metric-tab[data-metric="uniques"] { --metric-color: var(--c-uniques); }
    .metric-tab[data-metric="clones"] { --metric-color: var(--c-clones); }
    .metric-tab[data-metric="cloners"] { --metric-color: var(--c-cloners); }
    .metric-tab[data-metric="stars"] { --metric-color: var(--accent-2); }
    .metric-tab[data-metric="subscribers"] { --metric-color: var(--accent); }
    .metric-tab[data-metric="forks"] { --metric-color: var(--c-uniques); }
    .metric-tab:hover { color: var(--text); }
    .metric-tab.active {
      color: var(--text);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.075), transparent),
        var(--bg-raised);
      border-color: var(--metric-color, var(--border));
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035), 0 0 16px rgba(107, 184, 255, 0.08);
    }
    .metric-tab.primary {
      box-shadow:
        inset 0 -2px 0 var(--metric-color, var(--accent)),
        inset 0 0 0 1px rgba(255, 255, 255, 0.035),
        0 0 16px rgba(107, 184, 255, 0.08);
    }
    .metric-tab:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .section-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1.1rem;
      margin-bottom: 1.1rem;
    }
    .section-grid.full { grid-template-columns: 1fr; }
    .insight-section {
      margin-top: 0.9rem;
    }
    .dashboard-summary {
      margin-bottom: 1rem;
    }
    .dashboard-summary .stat-card {
      min-height: 144px;
    }
    .story-board {
      display: grid;
      grid-template-columns: minmax(0, 1.48fr) minmax(320px, 0.92fr);
      gap: 1.1rem;
      align-items: stretch;
      margin-bottom: 1.1rem;
    }
    .insight-card {
      border-color: rgba(214, 168, 75, 0.20);
      background:
        linear-gradient(135deg, rgba(214, 168, 75, 0.075), transparent 34%, rgba(107, 184, 255, 0.055)),
        var(--bg-card);
    }
    .lead-story-card {
      display: grid;
      grid-template-rows: auto auto 1fr;
      min-height: 27rem;
      border-color: rgba(214, 168, 75, 0.30);
      background:
        linear-gradient(118deg, rgba(214, 168, 75, 0.13), transparent 34%),
        linear-gradient(150deg, transparent 0 56%, rgba(79, 200, 165, 0.08) 56.3% 100%),
        linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
    }
    .lead-story-card::before {
      content: "";
      position: absolute;
      left: 1.15rem;
      right: 1.15rem;
      top: 0;
      height: 2px;
      background: linear-gradient(90deg, var(--accent-2), var(--accent), transparent);
      opacity: 0.95;
    }
    .next-move-queue-card {
      min-height: 27rem;
      border-color: rgba(107, 184, 255, 0.22);
      background:
        linear-gradient(145deg, rgba(107, 184, 255, 0.09), transparent 42%, rgba(217, 126, 183, 0.045)),
        var(--bg-card);
    }
    .portfolio-guide-section {
      margin-bottom: 1.1rem;
    }
    .portfolio-guide-card {
      border-color: rgba(79, 200, 165, 0.20);
      background:
        linear-gradient(115deg, rgba(79, 200, 165, 0.085), transparent 42%, rgba(214, 168, 75, 0.055)),
        var(--bg-card);
    }
    .portfolio-guide {
      display: grid;
      gap: 0.85rem;
      min-width: 0;
    }
    .profile-overview {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(17rem, 0.64fr);
      gap: 1rem;
      align-items: stretch;
    }
    .profile-copy {
      display: grid;
      gap: 0.55rem;
      min-width: 0;
    }
    .profile-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
      align-items: center;
      min-width: 0;
    }
    .profile-pill,
    .profile-bucket,
    .profile-note {
      border: 1px solid var(--border-soft);
      border-radius: 999px;
      font-size: 0.7rem;
      font-weight: 800;
      letter-spacing: 0.08em;
      line-height: 1.1;
      padding: 0.28rem 0.52rem;
      text-transform: uppercase;
    }
    .profile-pill {
      border-color: rgba(79, 200, 165, 0.44);
      color: var(--accent-3);
      background: rgba(79, 200, 165, 0.095);
    }
    .profile-bucket,
    .profile-note {
      color: var(--text-muted);
      background: rgba(148, 163, 184, 0.06);
    }
    .profile-copy p {
      color: var(--text-muted);
      font-size: 0.9rem;
      line-height: 1.5;
      margin: 0;
      max-width: 78ch;
    }
    .profile-copy strong {
      color: var(--text);
      font-size: 0.95rem;
      line-height: 1.35;
    }
    .profile-signal-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.5rem;
      min-width: 0;
    }
    .profile-signal {
      display: grid;
      gap: 0.2rem;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius-sm);
      background: var(--bg-card-2);
      padding: 0.58rem 0.62rem;
    }
    .profile-signal span,
    .profile-signal em {
      color: var(--text-muted);
      font-size: 0.68rem;
      font-style: normal;
      line-height: 1.1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .profile-signal strong {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 1.05rem;
      line-height: 1;
    }
    .profile-guidance {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.65rem;
      list-style: none;
      margin: 0;
      padding: 0;
    }
    .profile-guidance li {
      display: grid;
      grid-template-columns: minmax(4.2rem, auto) minmax(0, 1fr);
      gap: 0.65rem;
      align-items: start;
      min-width: 0;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.035), transparent 60%),
        var(--bg-card-2);
      padding: 0.72rem 0.78rem;
    }
    .profile-guidance span {
      color: var(--accent-3);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      white-space: nowrap;
    }
    .profile-guidance p {
      color: var(--text-muted);
      font-size: 0.78rem;
      line-height: 1.38;
      margin: 0;
      min-width: 0;
    }
    .section-kicker {
      color: var(--accent-2);
      font-size: 0.7rem;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      margin-bottom: 0.25rem;
    }
    .story-stepper {
      display: inline-flex;
      gap: 0.35rem;
      align-items: center;
      flex: 0 0 auto;
    }
    .story-step {
      width: 2.1rem;
      height: 2.1rem;
      border-radius: 999px;
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent),
        var(--bg-raised);
      color: var(--text);
      font-weight: 800;
      cursor: pointer;
      transition: border-color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .story-step:hover {
      border-color: rgba(214, 168, 75, 0.55);
      background: rgba(214, 168, 75, 0.11);
    }
    .story-step:disabled {
      cursor: default;
      opacity: 0.45;
      border-color: var(--border-soft);
    }
    .story-step:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .story-tabs {
      display: flex;
      gap: 0.45rem;
      overflow-x: auto;
      scrollbar-width: thin;
      scrollbar-color: var(--border) transparent;
      padding: 0.1rem 0 0.45rem;
      margin-bottom: 0.7rem;
    }
    .story-tabs::-webkit-scrollbar { height: 4px; }
    .story-tabs::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
    .story-tab {
      flex: 0 0 auto;
      min-width: 7.2rem;
      max-width: 10rem;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      padding: 0.48rem 0.62rem;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.032), transparent),
        var(--bg-card-2);
      color: var(--text-muted);
      text-align: left;
      cursor: pointer;
      display: grid;
      gap: 0.12rem;
      transition: border-color 150ms ease, color 150ms ease, background 150ms ease;
    }
    .story-tab span {
      color: var(--text-dim);
      font-size: 0.62rem;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    .story-tab strong {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      color: inherit;
      font-size: 0.78rem;
      font-weight: 700;
    }
    .story-tab:hover {
      color: var(--text);
      border-color: rgba(107, 184, 255, 0.42);
    }
    .story-tab.is-active {
      color: var(--text);
      border-color: rgba(214, 168, 75, 0.62);
      background:
        linear-gradient(135deg, rgba(214, 168, 75, 0.16), rgba(107, 184, 255, 0.075)),
        var(--bg-raised);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035), 0 0 22px rgba(214, 168, 75, 0.08);
    }
    .story-tab:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .lead-story-carousel {
      min-height: 0;
      display: grid;
    }
    .lead-story-slide {
      min-height: 19.5rem;
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      padding: clamp(1rem, 2.4vw, 1.55rem);
      display: grid;
      align-content: start;
      gap: 0.85rem;
      background:
        linear-gradient(105deg, var(--lead-wash, rgba(107, 184, 255, 0.10)), transparent 48%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.030), transparent),
        var(--bg-card-2);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.024);
    }
    .lead-story-slide.up { --lead-wash: rgba(79, 200, 165, 0.12); }
    .lead-story-slide.down { --lead-wash: rgba(255, 107, 107, 0.10); }
    .lead-story-slide.neutral { --lead-wash: rgba(107, 184, 255, 0.11); }
    .lead-story-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 0.45rem;
      align-items: center;
    }
    .lead-story-tag,
    .lead-story-repo,
    .lead-story-score {
      display: inline-flex;
      align-items: center;
      border: 1px solid var(--border-soft);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.040);
      color: var(--text-muted);
      font-size: 0.72rem;
      font-weight: 750;
      line-height: 1;
      padding: 0.32rem 0.52rem;
      white-space: nowrap;
    }
    .lead-story-tag {
      color: var(--accent-2);
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .lead-story-repo {
      color: var(--text);
      background: var(--bg-raised);
    }
    .lead-story-score {
      color: var(--accent-3);
    }
    .lead-story-slide h3 {
      max-width: 24ch;
      color: var(--text);
      font-size: clamp(1.35rem, 2.35vw, 2.25rem);
      line-height: 1.05;
      font-weight: 760;
      letter-spacing: 0;
    }
    .lead-story-slide h3 .repo {
      display: inline-block;
      margin-right: 0.15rem;
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.58em;
      color: var(--text);
      background: var(--bg-raised);
      border: 1px solid var(--border-soft);
      border-radius: 7px;
      padding: 0.12rem 0.38rem;
      vertical-align: 0.12em;
    }
    .lead-story-summary {
      max-width: 68ch;
      color: var(--text-muted);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.88rem;
      line-height: 1.5;
      font-variant-numeric: tabular-nums;
    }
    .lead-story-action {
      margin-top: 0.15rem;
      padding: 0.75rem 0.85rem;
      border: 1px solid rgba(214, 168, 75, 0.20);
      border-radius: var(--radius);
      background:
        linear-gradient(90deg, rgba(214, 168, 75, 0.085), transparent 42%),
        rgba(255, 255, 255, 0.026);
      color: var(--text-muted);
      line-height: 1.45;
      font-size: 0.88rem;
    }
    .lead-story-action span {
      color: var(--accent-2);
      display: inline-block;
      font-weight: 800;
      margin-right: 0.45rem;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      font-size: 0.72rem;
    }
    .lead-story-footer {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      margin-top: 0.1rem;
    }
    .lead-story-focus {
      border-color: rgba(214, 168, 75, 0.42);
      background: rgba(214, 168, 75, 0.10);
    }
    .next-move-queue-card .insights-list {
      max-height: 30.25rem;
      overflow: auto;
      padding-right: 0.25rem;
      scrollbar-width: thin;
      scrollbar-color: var(--border) transparent;
    }
    .next-move-queue-card .insights-list::-webkit-scrollbar { width: 4px; }
    .next-move-queue-card .insights-list::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
    .next-move-queue-card .insight-item {
      padding: 0.72rem 0.78rem;
      gap: 0.65rem;
      border-radius: var(--radius);
    }
    .next-move-queue-card .insight-icon {
      width: 26px;
      height: 26px;
      border-radius: 8px;
      font-size: 0.82rem;
    }
    .next-move-queue-card .insight-headline {
      font-size: 0.86rem;
    }
    .next-move-queue-card .insight-meta,
    .next-move-queue-card .insight-context,
    .next-move-queue-card .insight-action {
      font-size: 0.74rem;
    }
    .next-move-queue-card .insight-evidence {
      gap: 0.3rem;
      margin-top: 0.5rem;
    }
    .next-move-queue-card .evidence-chip {
      padding: 0.24rem 0.36rem;
      font-size: 0.68rem;
    }
    .insight-item.active-story {
      border-color: rgba(214, 168, 75, 0.52);
      box-shadow: inset 3px 0 0 rgba(214, 168, 75, 0.78);
    }
    .repo-strip-card {
      padding: 0.75rem 0.9rem;
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 0.85rem;
      align-items: center;
      position: sticky;
      top: 0.7rem;
      z-index: 10;
      backdrop-filter: blur(14px);
      background:
        linear-gradient(90deg, rgba(214, 168, 75, 0.08), transparent 18%, rgba(107, 184, 255, 0.08)),
        rgba(15, 20, 27, 0.88);
    }
    [data-theme="light"] .repo-strip-card {
      background:
        linear-gradient(90deg, rgba(138, 91, 18, 0.08), transparent 18%, rgba(18, 103, 173, 0.08)),
        rgba(255, 255, 255, 0.88);
    }
    .repo-strip-label {
      color: var(--text-muted);
      font-size: 0.72rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      white-space: nowrap;
    }
    .repo-strip {
      display: flex;
      gap: 0.45rem;
      overflow-x: auto;
      min-width: 0;
      scrollbar-width: thin;
      scrollbar-color: var(--border) transparent;
      padding-bottom: 2px;
      mask-image: linear-gradient(90deg, transparent 0, black 12px, black calc(100% - 12px), transparent 100%);
      -webkit-mask-image: linear-gradient(90deg, transparent 0, black 12px, black calc(100% - 12px), transparent 100%);
    }
    .repo-strip::-webkit-scrollbar { height: 4px; }
    .repo-strip::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
    .repo-strip-hint {
      color: var(--text-dim);
      font-size: 0.74rem;
      white-space: nowrap;
    }
    .repo-chip {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      flex: 0 0 auto;
      padding: 0.4rem 0.75rem;
      border-radius: 999px;
      border: 1px solid var(--border);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
        var(--bg-raised);
      color: var(--text);
      font-size: 0.85rem;
      font-weight: 500;
      cursor: pointer;
      transition: border-color 150ms ease, background 150ms ease, color 150ms ease, transform 120ms ease;
      white-space: nowrap;
    }
    .repo-chip:hover {
      border-color: rgba(107, 184, 255, 0.48);
      background: rgba(107, 184, 255, 0.09);
    }
    .repo-chip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .repo-chip .chip-dot {
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--chip-color, var(--text-muted));
      box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.04);
      flex: 0 0 auto;
    }
    .repo-chip .chip-mark {
      display: none;
      width: 14px;
      height: 14px;
      border-radius: 999px;
      background: var(--chip-color);
      color: var(--bg);
      font-size: 0.65rem;
      font-weight: 800;
      text-align: center;
      line-height: 14px;
    }
    .repo-chip.selected {
      background: var(--bg-raised);
      border-color: var(--chip-color);
      box-shadow: 0 0 0 1px var(--chip-color), 0 0 18px rgba(107, 184, 255, 0.18);
    }
    .repo-chip.selected .chip-mark { display: inline-block; }
    .repo-chip.compared {
      background: rgba(79, 200, 165, 0.10);
      border-color: rgba(79, 200, 165, 0.45);
    }
    .repo-chip.compared .chip-mark {
      display: inline-block;
      background: var(--c-positive);
    }
    .repo-chip .chip-meta {
      color: var(--text-muted);
      font-weight: 500;
      font-size: 0.78rem;
      font-variant-numeric: tabular-nums;
    }
    .repo-name-meta {
      display: block;
      color: var(--text-muted);
      font-size: 0.74rem;
      font-weight: 500;
      margin-top: 0.15rem;
      font-variant-numeric: tabular-nums;
    }
    .momentum-card {
      padding: 0.95rem 1.05rem;
      border-color: rgba(79, 200, 165, 0.18);
      background:
        linear-gradient(90deg, rgba(79, 200, 165, 0.10), transparent 34%, rgba(214, 168, 75, 0.075)),
        linear-gradient(180deg, var(--bg-card), var(--bg-card-2));
    }
    .momentum-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 1rem;
    }
    .momentum-cell {
      display: grid;
      gap: 0.25rem;
      padding: 0 1rem;
      border-left: 1px solid var(--border-soft);
    }
    .momentum-cell:first-child { padding-left: 0; border-left: none; }
    .momentum-label {
      color: var(--text-muted);
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
    }
    .momentum-label .moji { font-size: 0.95rem; }
    .momentum-value {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-variant-numeric: tabular-nums;
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--text);
      letter-spacing: 0;
      line-height: 1.1;
    }
    .momentum-value.muted { color: var(--text-muted); }
    .momentum-meta {
      color: var(--text-muted);
      font-size: 0.78rem;
      font-variant-numeric: tabular-nums;
    }
    .momentum-value .repo-tag {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.8rem;
      padding: 0.05rem 0.35rem;
      border-radius: 6px;
      background: var(--bg-card-2);
      border: 1px solid var(--border-soft);
      color: var(--text);
      margin-right: 0.4rem;
    }
    .repo-table-wrap, .table-wrap {
      overflow-x: auto;
      margin-top: 0.5rem;
      max-width: 100%;
    }
    .table-wrap td { vertical-align: top; }
    .table-wrap td:first-child {
      max-width: 0;
      width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .insights-list {
      list-style: none;
      display: grid;
      gap: 0.7rem;
      margin: 0;
      padding: 0;
    }
    .insight-item {
      border-radius: var(--radius);
      border: 1px solid var(--border-soft);
      background:
        linear-gradient(90deg, var(--insight-wash, rgba(107, 184, 255, 0.06)), transparent 38%),
        var(--bg-card-2);
      padding: 0.85rem 0.95rem;
      color: var(--text);
      line-height: 1.5;
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 0.85rem;
      align-items: center;
      cursor: pointer;
      transition: border-color 150ms ease, background 150ms ease, transform 120ms ease;
    }
    .insight-item:hover {
      border-color: rgba(107, 184, 255, 0.55);
      background:
        linear-gradient(90deg, var(--insight-wash, rgba(107, 184, 255, 0.10)), transparent 44%),
        rgba(107, 184, 255, 0.06);
    }
    .insight-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
    .insight-icon {
      width: 32px;
      height: 32px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      font-size: 1rem;
      font-weight: 700;
      color: var(--icon-color, var(--text-muted));
      background: var(--icon-bg, rgba(139, 148, 158, 0.10));
      border: 1px solid var(--icon-border, rgba(139, 148, 158, 0.25));
    }
    .insight-item.up { --icon-color: var(--c-positive); --icon-bg: rgba(79, 200, 165, 0.12); --icon-border: rgba(79, 200, 165, 0.32); --insight-wash: rgba(79, 200, 165, 0.08); }
    .insight-item.down { --icon-color: var(--c-negative); --icon-bg: rgba(255, 107, 107, 0.12); --icon-border: rgba(255, 107, 107, 0.32); --insight-wash: rgba(255, 107, 107, 0.08); }
    .insight-item.neutral { --icon-color: var(--accent); --icon-bg: rgba(107, 184, 255, 0.12); --icon-border: rgba(107, 184, 255, 0.32); --insight-wash: rgba(107, 184, 255, 0.08); }
    .insight-item.narrative {
      align-items: start;
    }
    .insight-body { min-width: 0; }
    .insight-headline {
      font-size: 0.95rem;
      font-weight: 600;
      color: var(--text);
      letter-spacing: 0;
    }
    .insight-headline .repo {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, monospace;
      font-size: 0.85em;
      color: var(--text);
      background: var(--bg-raised);
      padding: 0.05rem 0.35rem;
      border-radius: 6px;
      border: 1px solid var(--border-soft);
    }
    .insight-meta {
      color: var(--text-muted);
      font-size: 0.82rem;
      margin-top: 0.2rem;
      font-variant-numeric: tabular-nums;
    }
    .insight-evidence {
      display: flex;
      flex-wrap: wrap;
      gap: 0.4rem;
      margin-top: 0.65rem;
    }
    .evidence-chip {
      display: inline-flex;
      align-items: baseline;
      gap: 0.35rem;
      min-width: 0;
      max-width: 100%;
      border: 1px solid var(--border-soft);
      border-radius: 8px;
      background: rgba(255, 255, 255, 0.035);
      padding: 0.32rem 0.45rem;
      font-size: 0.76rem;
      line-height: 1.25;
    }
    .evidence-label {
      color: var(--text-dim);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      white-space: nowrap;
    }
    .evidence-value {
      color: var(--text);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-variant-numeric: tabular-nums;
      overflow-wrap: anywhere;
    }
    .evidence-detail {
      color: var(--text-muted);
      overflow-wrap: anywhere;
    }
    .insight-context {
      display: grid;
      gap: 0.35rem;
      margin-top: 0.65rem;
      color: var(--text-muted);
      font-size: 0.78rem;
    }
    .context-row {
      display: grid;
      grid-template-columns: minmax(5.5rem, auto) minmax(0, 1fr);
      gap: 0.55rem;
      align-items: baseline;
    }
    .context-date {
      color: var(--text-dim);
      white-space: nowrap;
    }
    .context-label {
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .context-label a {
      color: var(--text);
      text-decoration: none;
      border-bottom: 1px dotted var(--border);
    }
    .context-detail {
      display: block;
      color: var(--text-dim);
    }
    .insight-action {
      margin-top: 0.65rem;
      color: var(--text-muted);
      font-size: 0.8rem;
      line-height: 1.45;
    }
    .insight-action span {
      color: var(--accent-2);
      display: inline-block;
      font-weight: 700;
      margin-right: 0.4rem;
      text-transform: uppercase;
      letter-spacing: 0.06em;
    }
    .insight-pct {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-size: 0.92rem;
      font-weight: 700;
      font-variant-numeric: tabular-nums;
      color: var(--icon-color, var(--text-muted));
      white-space: nowrap;
    }
    table { width: 100%; border-collapse: collapse; }
    thead {
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
        var(--bg-card-2);
    }
    th {
      text-align: left;
      color: var(--accent-2);
      font-size: 0.76rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      padding: 0.7rem 0.75rem;
      border-bottom: 1px solid var(--border);
      white-space: nowrap;
    }
    th:first-child { border-top-left-radius: var(--radius); }
    th:last-child { border-top-right-radius: var(--radius); }
    th.num, td.num { text-align: right; }
    td {
      padding: 0.8rem 0.75rem;
      border-bottom: 1px solid var(--border-soft);
      font-size: 0.92rem;
      vertical-align: middle;
    }
    tbody tr:nth-child(even) td {
      background: rgba(255, 255, 255, 0.012);
    }
    tr:last-child td { border-bottom: none; }
    .checkbox-col { width: 48px; text-align: center; }
    .repo-row {
      transition: background 120ms ease, opacity 120ms ease, transform 120ms ease;
      cursor: pointer;
    }
    .repo-row:hover { background: var(--row-hover, rgba(107, 184, 255, 0.07)); }
    .repo-row.selected {
      background: var(--row-selected, rgba(107, 184, 255, 0.11));
      box-shadow: inset 0 0 0 1px rgba(107, 184, 255, 0.35);
    }
    .repo-row.dimmed { opacity: 0.45; }
    .repo-row.compared { background: var(--row-compared, rgba(79, 200, 165, 0.09)); }
    .repo-name {
      font-weight: 600;
      color: var(--text);
      white-space: nowrap;
    }
    .repo-share {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }
    .repo-bar-track {
      width: 110px;
      height: 6px;
      border-radius: 999px;
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.025), transparent),
        var(--bg-card-2);
      overflow: hidden;
      border: 1px solid var(--border-soft);
    }
    .repo-bar {
      position: relative;
      height: 100%;
      border-radius: 999px;
      background: var(--bar-color, linear-gradient(90deg, var(--c-views), var(--accent)));
      overflow: hidden;
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.20) inset;
      transition: width 240ms ease;
    }
    .repo-bar::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.20), transparent 48%),
        repeating-linear-gradient(135deg, var(--bar-pattern-color, rgba(255, 255, 255, 0.16)) 0 1px, transparent 1px 7px);
      opacity: 0.72;
      pointer-events: none;
    }
    .repo-share-pct {
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
      font-variant-numeric: tabular-nums;
      font-size: 0.8rem;
      color: var(--text-muted);
      min-width: 3.4ch;
      text-align: right;
    }
    .repo-spark {
      width: 92px;
      height: 26px;
      display: block;
    }
    .repo-spark path.line { fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
    .repo-spark path.area { stroke: none; opacity: 0.18; }
    .repo-name-wrap {
      display: flex;
      align-items: center;
      gap: 0.55rem;
    }
    .repo-color-dot {
      width: 8px;
      height: 8px;
      border-radius: 999px;
      flex: 0 0 auto;
      background: var(--repo-color, var(--accent));
      box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.04);
    }
    .repo-row:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: -2px;
    }
    .sortable {
      cursor: pointer;
      user-select: none;
      position: relative;
    }
    .sortable .arrow { opacity: 0.45; margin-left: 0.25rem; font-size: 0.7em; }
    .sortable.active .arrow { opacity: 1; color: var(--accent); }
    .empty-msg {
      color: var(--text-muted);
      font-style: italic;
      padding: 1rem 0;
    }
    body.auth-locked {
      --bg: #010203;
      --bg-raised: #05070a;
      --bg-card: #080a0d;
      --bg-card-2: #030406;
      --border: rgba(120, 136, 158, 0.20);
      --border-soft: rgba(120, 136, 158, 0.10);
      --text: #edf4fb;
      --text-muted: #9aa7b8;
      --text-dim: #667284;
      --accent: #2f81f7;
      --c-positive: #3fb950;
      --c-negative: #f85149;
      --vault-black: #010203;
      --vault-950: #030507;
      --vault-900: #06090d;
      --vault-850: #0d1218;
      --vault-800: #141a23;
      --vault-700: #222b38;
      --vault-gold: #c3943d;
      --vault-gold-bright: #e6c36b;
      --vault-gold-soft: rgba(195, 148, 61, 0.16);
      --secure-led: #2f81f7;
      --secure-led-bright: #68b5ff;
      --secure-led-soft: rgba(47, 129, 247, 0.22);
      --secure-edge: rgba(145, 162, 186, 0.16);
      display: flex;
      flex-direction: column;
      min-height: 100vh;
      max-width: none;
      margin: 0;
      padding: 0;
      overflow-x: hidden;
      color-scheme: dark;
      background:
        radial-gradient(900px 520px at 50% -14%, rgba(195, 148, 61, 0.064), transparent 64%),
        radial-gradient(760px 620px at -16% 52%, rgba(47, 129, 247, 0.038), transparent 70%),
        radial-gradient(720px 620px at 116% 58%, rgba(104, 181, 255, 0.026), transparent 72%),
        linear-gradient(180deg, #020303 0%, #010203 56%, #010101 100%);
    }
    body.auth-locked > footer {
      display: none;
    }
    #auth-shell {
      --bg: #010203;
      --bg-raised: #05070a;
      --bg-card: #080a0d;
      --bg-card-2: #030406;
      --border: rgba(120, 136, 158, 0.20);
      --border-soft: rgba(120, 136, 158, 0.10);
      --text: #edf4fb;
      --text-muted: #9aa7b8;
      --text-dim: #667284;
      --accent: #2f81f7;
      --c-positive: #3fb950;
      --c-negative: #f85149;
      --vault-black: #010203;
      --vault-950: #030507;
      --vault-900: #06090d;
      --vault-850: #0d1218;
      --vault-800: #141a23;
      --vault-700: #222b38;
      --vault-gold: #c3943d;
      --vault-gold-bright: #e6c36b;
      --vault-gold-soft: rgba(195, 148, 61, 0.16);
      --secure-led: #2f81f7;
      --secure-led-bright: #68b5ff;
      --secure-led-soft: rgba(47, 129, 247, 0.22);
      --secure-edge: rgba(145, 162, 186, 0.16);
      position: relative;
      isolation: isolate;
      overflow: hidden;
      width: 100%;
      min-height: 100vh;
      min-height: 100svh;
      display: flex;
      flex-direction: column;
    }
    #auth-shell::before,
    #auth-shell::after {
      content: "";
      position: fixed;
      pointer-events: none;
      transition: opacity 900ms ease, transform 1200ms cubic-bezier(.18, .92, .2, 1);
    }
    #auth-shell::before {
      z-index: 0;
      left: 50%;
      top: 52%;
      width: 940px;
      aspect-ratio: 1;
      border-radius: 50%;
      opacity: 0.46;
      transform: translate(-50%, -50%) rotate(-4deg);
      background:
        conic-gradient(from -24deg,
          transparent 0deg 32deg,
          rgba(255, 255, 255, 0.030) 32deg 37deg,
          transparent 37deg 69deg,
          rgba(195, 148, 61, 0.044) 69deg 75deg,
          transparent 75deg 137deg,
          rgba(104, 181, 255, 0.030) 137deg 141deg,
          transparent 141deg 226deg,
          rgba(255, 255, 255, 0.020) 226deg 231deg,
          transparent 231deg 360deg),
        repeating-conic-gradient(from 9deg, rgba(255, 255, 255, 0.009) 0deg 0.55deg, transparent 0.7deg 10deg),
        radial-gradient(circle at 49% 52%, transparent 0 34.7%, rgba(145, 162, 186, 0.105) 35% 35.45%, transparent 35.8% 51.6%, rgba(195, 148, 61, 0.060) 51.9% 52.25%, transparent 52.6% 68.5%, rgba(145, 162, 186, 0.075) 68.9% 69.25%, transparent 69.7%),
        radial-gradient(ellipse at 44% 38%, rgba(255, 255, 255, 0.050), transparent 28%),
        radial-gradient(ellipse at 62% 72%, rgba(0, 0, 0, 0.34), transparent 36%),
        linear-gradient(145deg, #18202a 0%, #0c1118 35%, #020304 82%);
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.032),
        inset 0 0 0 24px rgba(0, 0, 0, 0.28),
        inset 38px 30px 86px rgba(255, 255, 255, 0.026),
        inset -72px -72px 136px rgba(0, 0, 0, 0.82),
        0 34px 118px rgba(0, 0, 0, 0.68);
    }
    #auth-shell::after {
      z-index: 0;
      inset: 0;
      opacity: 0.86;
      background:
        radial-gradient(760px 520px at 50% 54%, transparent 45%, rgba(0, 0, 0, 0.52) 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 18%, rgba(0, 0, 0, 0.20) 100%),
        linear-gradient(90deg, transparent calc(50% - 500px), rgba(255, 255, 255, 0.016) calc(50% - 498px), transparent calc(50% - 472px), transparent calc(50% + 472px), rgba(255, 255, 255, 0.014) calc(50% + 498px), transparent calc(50% + 500px));
    }
    #auth-shell.is-opening::before {
      opacity: 0.58;
      transform: translate(-50%, -50%) rotate(-12deg) scale(1.035);
    }
    #auth-shell.is-opening::after {
      opacity: 0.88;
    }
    .auth-page {
      position: relative;
      z-index: 2;
      flex: 1;
      display: grid;
      place-items: center;
      padding: 1.5rem 0;
      width: 100%;
    }
    .auth-wrap {
      position: absolute;
      left: 50%;
      top: 50%;
      display: grid;
      justify-items: center;
      width: 760px;
      max-width: none;
      transform: translate(-50%, -50%);
    }
    .auth-page .hero {
      display: block;
      margin-bottom: 0;
    }
    .auth-page .hero-copy {
      max-width: 100%;
    }
    .auth-hero {
      position: absolute;
      z-index: 3;
      left: 50%;
      top: 13.6%;
      width: min(40rem, calc(100vw - 2rem));
      margin: 0;
      text-align: center;
      transform: translateX(-50%);
    }
    .auth-hero-head {
      display: block;
    }
    .auth-hero .brand-lockup {
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 0.35rem;
      max-width: none;
      margin-bottom: 0;
    }
    .auth-hero h1 {
      color: #f3f7fb;
      font-size: 4.55rem;
      line-height: 0.9;
      letter-spacing: 0;
      margin: 0;
      text-shadow:
        0 18px 36px rgba(0, 0, 0, 0.46),
        0 0 34px rgba(47, 129, 247, 0.11);
    }
    .auth-hero .auth-brand-line {
      font-family: 'Inter', sans-serif;
      font-size: 3.95rem;
      font-weight: 850;
      letter-spacing: 0;
      line-height: 0.9;
      margin: 0;
      text-transform: uppercase;
      text-shadow: 0 18px 36px rgba(0, 0, 0, 0.42);
    }
    .auth-hero .auth-brand-line-dashboard {
      color: #8a96a6;
      font-size: 4rem;
      font-weight: 500;
      letter-spacing: 0.04em;
    }
    .auth-hero .sub {
      color: var(--text-muted);
      font-size: 1.02rem;
      line-height: 1.5;
      max-width: 100%;
    }
    .auth-card {
      position: relative;
      isolation: isolate;
      overflow: hidden;
      display: block;
      width: 760px;
      max-width: none;
      min-width: 0;
      aspect-ratio: 1;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background:
        radial-gradient(circle at 51% 51%, rgba(104, 181, 255, 0.055) 0 1px, transparent 2px),
        radial-gradient(circle at 52% 49%, rgba(195, 148, 61, 0.050), transparent 17%),
        radial-gradient(ellipse at 45% 38%, rgba(255, 255, 255, 0.060), transparent 27%),
        radial-gradient(circle at 50% 52%, transparent 0 26.7%, rgba(145, 162, 186, 0.130) 27.1% 27.9%, transparent 28.3% 44.5%, rgba(195, 148, 61, 0.090) 45% 45.55%, transparent 46.1% 60.4%, rgba(145, 162, 186, 0.095) 61% 61.55%, transparent 62.1%),
        repeating-conic-gradient(from 17deg, rgba(255, 255, 255, 0.012) 0deg 0.45deg, transparent 0.65deg 8.5deg),
        conic-gradient(from 19deg,
          transparent 0deg 43deg,
          rgba(255, 255, 255, 0.022) 43deg 47deg,
          transparent 47deg 92deg,
          rgba(195, 148, 61, 0.038) 92deg 97deg,
          transparent 97deg 171deg,
          rgba(104, 181, 255, 0.026) 171deg 175deg,
          transparent 175deg 271deg,
          rgba(255, 255, 255, 0.016) 271deg 276deg,
          transparent 276deg 360deg),
        linear-gradient(145deg, var(--vault-800) 0%, var(--vault-900) 44%, var(--vault-black) 100%);
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.038),
        inset 0 0 0 18px rgba(0, 0, 0, 0.28),
        inset 32px 26px 80px rgba(255, 255, 255, 0.028),
        inset -62px -64px 124px rgba(0, 0, 0, 0.84),
        0 34px 96px rgba(0, 0, 0, 0.62);
      transform-origin: center;
      transition: transform 1100ms cubic-bezier(.18, .92, .2, 1);
    }
    .auth-card::before {
      content: "";
      position: absolute;
      inset: 6.4%;
      z-index: 0;
      border: 1px solid rgba(255, 255, 255, 0.070);
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, transparent 0 38.5%, rgba(0, 0, 0, 0.46) 39.1% 41.1%, transparent 41.8%),
        conic-gradient(from -31deg, transparent 0deg 35deg, rgba(195, 148, 61, 0.050) 35deg 42deg, transparent 42deg 137deg, rgba(255, 255, 255, 0.026) 137deg 145deg, transparent 145deg 262deg, rgba(104, 181, 255, 0.018) 262deg 267deg, transparent 267deg 360deg);
      box-shadow:
        inset 0 0 0 12px rgba(0, 0, 0, 0.22),
        inset 0 24px 46px rgba(255, 255, 255, 0.018),
        inset 0 -44px 62px rgba(0, 0, 0, 0.56);
      pointer-events: none;
    }
    .auth-card::after {
      content: "";
      position: absolute;
      z-index: 0;
      inset: 33.5%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 41% 35%, rgba(255, 255, 255, 0.055), transparent 27%),
        radial-gradient(circle, rgba(195, 148, 61, 0.045), transparent 65%),
        radial-gradient(circle at 54% 52%, rgba(47, 129, 247, 0.035), transparent 44%),
        linear-gradient(145deg, rgba(17, 23, 31, 0.76), rgba(1, 2, 3, 0.88));
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.040),
        inset 0 -24px 38px rgba(0, 0, 0, 0.58),
        0 22px 42px rgba(0, 0, 0, 0.40);
      pointer-events: none;
    }
    .auth-vault-face {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
    }
    .auth-vault-face::before,
    .auth-vault-face::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 50%;
      pointer-events: none;
    }
    .auth-vault-face::before {
      opacity: 0.48;
      background:
        linear-gradient(101deg, transparent 0 27%, rgba(255, 255, 255, 0.026) 27.2% 27.45%, transparent 27.8% 100%),
        linear-gradient(76deg, transparent 0 62%, rgba(195, 148, 61, 0.024) 62.1% 62.36%, transparent 62.75% 100%),
        radial-gradient(circle at 23% 50%, rgba(255, 255, 255, 0.030) 0 0.7px, transparent 1.5px),
        radial-gradient(circle at 72% 25%, rgba(255, 255, 255, 0.026) 0 0.65px, transparent 1.45px),
        radial-gradient(circle at 61% 83%, rgba(145, 162, 186, 0.025) 0 0.75px, transparent 1.6px);
      background-size: auto, auto, 17px 13px, 23px 19px, 29px 21px;
      mask-image: radial-gradient(circle, black 0 67%, transparent 82%);
      -webkit-mask-image: radial-gradient(circle, black 0 67%, transparent 82%);
    }
    .auth-vault-face::after {
      opacity: 0.52;
      background:
        radial-gradient(ellipse at 42% 36%, rgba(255, 255, 255, 0.028), transparent 22%),
        radial-gradient(ellipse at 67% 64%, rgba(0, 0, 0, 0.26), transparent 30%),
        linear-gradient(172deg, transparent 0 45%, rgba(0, 0, 0, 0.18) 45.2% 46.8%, transparent 47.2% 100%);
      mask-image: radial-gradient(circle, transparent 0 19%, black 25% 70%, transparent 82%);
      -webkit-mask-image: radial-gradient(circle, transparent 0 19%, black 25% 70%, transparent 82%);
    }
    .auth-vault-ring {
      position: absolute;
      border-radius: 50%;
      pointer-events: none;
    }
    .auth-vault-ring-outer {
      inset: 4.4%;
      border: 1px solid rgba(195, 148, 61, 0.095);
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.018),
        0 0 22px rgba(195, 148, 61, 0.035);
    }
    .auth-vault-ring-inner {
      inset: 21.8% 22.4% 22.2% 21.7%;
      border: 1px solid rgba(104, 181, 255, 0.088);
      transform: translate(-1.4%, 1.2%) rotate(5deg);
      box-shadow: 0 0 24px rgba(47, 129, 247, 0.036);
    }
    .auth-vault-bolt {
      position: absolute;
      width: clamp(0.46rem, 1.35vmin, 0.78rem);
      aspect-ratio: 1;
      border-radius: 50%;
      background:
        radial-gradient(circle at 32% 25%, rgba(255, 255, 255, 0.32), transparent 24%),
        radial-gradient(circle at 62% 68%, rgba(0, 0, 0, 0.46), transparent 42%),
        linear-gradient(145deg, #2a3545, #05070b 70%);
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.055),
        0 1px 0 rgba(255, 255, 255, 0.040),
        0 8px 14px rgba(0, 0, 0, 0.42);
    }
    .auth-vault-bolt-one { top: 8.4%; left: 48.7%; transform: scale(0.92); }
    .auth-vault-bolt-two { top: 18.9%; right: 24.1%; transform: scale(1.08); }
    .auth-vault-bolt-three { top: 43.2%; right: 9.8%; transform: scale(0.86); }
    .auth-vault-bolt-four { right: 20.2%; bottom: 22.8%; transform: scale(1.03); }
    .auth-vault-bolt-five { left: 51.2%; bottom: 9.7%; transform: scale(0.94); }
    .auth-vault-bolt-six { left: 20.9%; bottom: 19.6%; transform: scale(1.1); }
    .auth-vault-bolt-seven { left: 9.5%; top: 46.8%; transform: scale(0.9); }
    .auth-vault-bolt-eight { left: 23.1%; top: 16.8%; transform: scale(1.02); }
    .auth-vault-wheel {
      position: absolute;
      left: 50%;
      top: 50%;
      width: clamp(10rem, 31%, 15rem);
      aspect-ratio: 1;
      border: 1px solid rgba(195, 148, 61, 0.16);
      border-radius: 50%;
      isolation: isolate;
      background:
        radial-gradient(circle at 41% 34%, rgba(255, 255, 255, 0.092), transparent 24%),
        radial-gradient(circle, var(--vault-800) 0 27%, transparent 28%),
        radial-gradient(circle, transparent 0 57%, rgba(195, 148, 61, 0.070) 58.3% 59.2%, transparent 60.3%),
        repeating-conic-gradient(from 6deg, rgba(255, 255, 255, 0.014) 0deg 0.7deg, transparent 0.9deg 18deg),
        linear-gradient(145deg, #151d28, #05070a 78%);
      box-shadow:
        inset 0 0 0 10px rgba(0, 0, 0, 0.30),
        inset 0 18px 30px rgba(255, 255, 255, 0.022),
        inset 0 -30px 44px rgba(0, 0, 0, 0.60),
        0 20px 42px rgba(0, 0, 0, 0.48);
      transform: translate(-50%, -50%) rotate(-8deg);
      transform-origin: center;
      transition:
        transform 3400ms cubic-bezier(.62, .03, .2, 1),
        border-color 1500ms ease,
        box-shadow 1500ms ease;
    }
    .auth-vault-wheel::before {
      content: "";
      position: absolute;
      inset: -17%;
      z-index: -1;
      border-radius: 50%;
      opacity: 0;
      background:
        radial-gradient(circle, transparent 0 48%, rgba(230, 195, 107, 0.42) 57%, rgba(195, 148, 61, 0.18) 63%, transparent 72%),
        conic-gradient(from 12deg, transparent 0deg 56deg, rgba(230, 195, 107, 0.22) 56deg 94deg, transparent 94deg 190deg, rgba(195, 148, 61, 0.14) 190deg 232deg, transparent 232deg 360deg);
      filter: blur(12px);
      transform: scale(0.86);
      transition:
        opacity 2400ms ease-in,
        transform 3400ms cubic-bezier(.62, .03, .2, 1);
    }
    .auth-vault-wheel::after {
      content: "";
      position: absolute;
      inset: -3.5%;
      border-radius: 50%;
      opacity: 0;
      background: radial-gradient(circle, transparent 0 56%, rgba(230, 195, 107, 0.38) 58%, rgba(230, 195, 107, 0.14) 61%, transparent 65%);
      filter: blur(4px);
      transition: opacity 2200ms ease-in;
    }
    .auth-vault-spoke {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 43%;
      height: clamp(0.42rem, 1.1vmin, 0.68rem);
      border-radius: 999px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.010)),
        linear-gradient(90deg, #2e3a4b, #0c121a);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.070),
        inset 0 -6px 8px rgba(0, 0, 0, 0.42),
        0 8px 16px rgba(0, 0, 0, 0.34);
      transform-origin: 0 50%;
    }
    .auth-vault-spoke-a { width: 42%; transform: rotate(-3deg); }
    .auth-vault-spoke-b { width: 44%; transform: rotate(91deg); }
    .auth-vault-spoke-c { width: 41%; transform: rotate(181deg); }
    .auth-vault-spoke-d { width: 43.5%; transform: rotate(269deg); }
    .auth-vault-hub {
      position: absolute;
      inset: 34%;
      border: 1px solid rgba(195, 148, 61, 0.17);
      border-radius: 50%;
      background:
        radial-gradient(circle at 38% 31%, rgba(255, 255, 255, 0.16), transparent 30%),
        linear-gradient(145deg, #26313f, #05070a 74%);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        inset 0 -13px 22px rgba(0, 0, 0, 0.52),
        0 12px 28px rgba(0, 0, 0, 0.42);
    }
    .auth-card.is-opening {
      transform: translateY(-3px) scale(0.992);
    }
    #auth-shell.is-revealing {
      position: fixed;
      inset: 0;
      z-index: 20;
      opacity: 0;
      transition: opacity 680ms ease;
    }
    #auth-shell.is-revealing .auth-card {
      opacity: 0.88;
      transform: translate(-18px, -6px) rotate(-4deg) scale(0.986);
      transition:
        opacity 680ms ease,
        transform 680ms cubic-bezier(.18, .92, .2, 1);
    }
    .auth-card.is-opening .auth-vault-wheel {
      border-color: rgba(230, 195, 107, 0.44);
      box-shadow:
        inset 0 0 0 10px rgba(0, 0, 0, 0.24),
        inset 0 18px 30px rgba(255, 255, 255, 0.034),
        inset 0 -28px 42px rgba(0, 0, 0, 0.52),
        0 20px 42px rgba(0, 0, 0, 0.38),
        0 0 48px rgba(195, 148, 61, 0.16),
        0 0 42px rgba(47, 129, 247, 0.055);
      transform: translate(-50%, -50%) rotate(-72deg) scale(1.025);
    }
    .auth-card.is-opening .auth-vault-wheel::before {
      opacity: 0.58;
      transform: scale(1);
    }
    .auth-card.is-opening .auth-vault-wheel::after {
      opacity: 0.76;
    }
    .auth-card > * {
      z-index: 1;
    }
    .auth-card > .hero {
      position: absolute;
      inset: 0;
      z-index: 3;
      pointer-events: none;
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      overflow: visible;
      padding: 0;
    }
    .auth-card > .hero::before,
    .auth-card > .hero::after {
      display: none;
    }
    .auth-hidden-username {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    .auth-form {
      position: absolute;
      isolation: isolate;
      overflow: hidden;
      z-index: 3;
      left: 50%;
      top: 64%;
      display: flex;
      gap: 0.55rem;
      flex-wrap: nowrap;
      align-items: stretch;
      width: min(35.5rem, calc(100vw - 2rem));
      padding: 0.55rem;
      border: 1px solid rgba(195, 148, 61, 0.18);
      border-radius: 16px;
      transform: translate(-50%, -50%);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.042), rgba(255, 255, 255, 0.006) 44%, rgba(0, 0, 0, 0.56)),
        linear-gradient(90deg, rgba(195, 148, 61, 0.075), rgba(104, 181, 255, 0.045) 52%, rgba(195, 148, 61, 0.055)),
        rgba(1, 3, 5, 0.92);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.052),
        inset 0 18px 28px rgba(0, 0, 0, 0.60),
        inset 0 -18px 28px rgba(0, 0, 0, 0.62),
        0 10px 0 rgba(0, 0, 0, 0.20),
        0 18px 38px rgba(0, 0, 0, 0.42),
        0 0 22px rgba(195, 148, 61, 0.032);
    }
    .auth-form::before {
      content: "";
      position: absolute;
      inset: 1px;
      z-index: 0;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, 0.036);
      opacity: 0.74;
      pointer-events: none;
    }
    .auth-form::after {
      content: "";
      position: absolute;
      left: 0.8rem;
      right: 0.8rem;
      bottom: 0.35rem;
      z-index: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(195, 148, 61, 0.22), rgba(104, 181, 255, 0.12), transparent);
      opacity: 0.58;
      pointer-events: none;
    }
    .auth-form > * {
      position: relative;
      z-index: 1;
    }
    .auth-input-wrap {
      flex: 1 1 260px;
      min-width: 0;
      position: relative;
      display: flex;
      align-items: center;
    }
    .auth-input {
      flex: 1;
      min-width: 0;
      min-height: 50px;
      background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.40), rgba(255, 255, 255, 0.010)),
        rgba(0, 2, 5, 0.90);
      border: 1px solid rgba(104, 181, 255, 0.19);
      border-radius: 10px;
      color: var(--secure-led-bright);
      padding: 0.86rem 1rem;
      caret-color: var(--secure-led-bright);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 1rem;
      letter-spacing: 0.045em;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.028),
        inset 0 14px 22px rgba(0, 0, 0, 0.52),
        inset 0 -1px 0 rgba(104, 181, 255, 0.050);
      transition: border-color 150ms ease, box-shadow 150ms ease;
    }
    .auth-input:focus {
      outline: none;
      border-color: rgba(104, 181, 255, 0.82);
      box-shadow:
        0 0 0 3px rgba(47, 129, 247, 0.18),
        inset 0 13px 24px rgba(0, 0, 0, 0.42),
        inset 0 0 22px rgba(47, 129, 247, 0.10);
    }
    .auth-input::placeholder {
      color: var(--text-dim);
      font-family: 'Inter', sans-serif;
      letter-spacing: 0;
    }
    .auth-button {
      position: relative;
      isolation: isolate;
      overflow: hidden;
      border: 1px solid rgba(230, 195, 107, 0.34);
      border-radius: 10px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.025) 45%, rgba(0, 0, 0, 0.30)),
        linear-gradient(135deg, #33250d 0%, #171006 52%, #070502 100%);
      color: #f3dfad;
      padding: 0 1.55rem;
      min-height: 50px;
      font-family: 'Inter', sans-serif;
      font-size: 0.95rem;
      font-weight: 850;
      letter-spacing: 0;
      text-transform: uppercase;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.62rem;
      text-shadow: 0 1px 0 rgba(0, 0, 0, 0.52);
      box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        inset 0 -12px 20px rgba(0, 0, 0, 0.34);
      transition: border-color 220ms ease, box-shadow 240ms ease, color 220ms ease, transform 160ms ease;
    }
    .auth-button::before {
      content: "";
      position: absolute;
      inset: 1px;
      z-index: -1;
      border-radius: 8px;
      border: 1px solid rgba(255, 255, 255, 0.052);
      opacity: 0.62;
      transition: opacity 220ms ease;
    }
    .auth-button:not(:disabled):hover {
      border-color: rgba(241, 207, 122, 0.84);
      color: #ffffff;
      box-shadow:
        0 14px 30px rgba(195, 148, 61, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.17),
        inset 0 -12px 20px rgba(0, 0, 0, 0.26);
      transform: translateY(-1px);
    }
    .auth-button:not(:disabled):hover::before {
      opacity: 1;
    }
    .auth-button:active {
      transform: translateY(1px);
    }
    .auth-button:disabled:not(.is-unlocked):not(.is-unlocking) {
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.050), rgba(0, 0, 0, 0.18)),
        #15120b;
      color: var(--text-muted);
      cursor: not-allowed;
      transform: none;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -10px 18px rgba(0, 0, 0, 0.18);
    }
    .auth-button .lock-svg,
    .auth-button .btn-label-default,
    .auth-button .btn-label-success {
      transition: transform 220ms ease, opacity 220ms ease;
    }
    .auth-button:not(:disabled):hover .lock-svg,
    .auth-button:not(:disabled):hover .btn-label-default {
      transform: scale(1.04);
    }
    .auth-button .lock-shackle {
      transform-box: fill-box;
      transform-origin: 76% 100%;
      stroke-width: 2.05;
      transition: transform 260ms cubic-bezier(.2, .8, .2, 1);
    }
    .auth-button .lock-shackle-glint,
    .auth-button .lock-hairline {
      opacity: 0.58;
      stroke-width: 1;
    }
    .auth-button .lock-body {
      fill: rgba(255, 255, 255, 0.035);
      stroke-width: 1.9;
    }
    .auth-button:not(:disabled):hover .lock-shackle {
      transform: translateY(-2.1px) scaleY(1.18);
    }
    .auth-button .lock-check {
      stroke-dasharray: 12;
      stroke-dashoffset: 12;
      stroke-width: 2.15;
    }
    .auth-button .btn-label-success {
      display: none;
    }
    .auth-button.is-unlocking {
      border-color: rgba(241, 207, 122, 0.84);
      color: #ffffff;
      cursor: wait;
      box-shadow:
        0 14px 30px rgba(195, 148, 61, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.17),
        inset 0 -12px 20px rgba(0, 0, 0, 0.26);
    }
    .auth-button.is-unlocking .lock-shackle {
      transform: translateY(-2.1px) scaleY(1.18);
    }
    .auth-button.is-unlocked {
      border-color: rgba(63, 185, 80, 0.74);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.018) 42%),
        linear-gradient(135deg, #12351f 0%, #0d2a19 48%, #07150d 100%);
      color: #ffffff;
      cursor: default;
      pointer-events: none;
      transform: none;
      box-shadow:
        0 16px 34px rgba(63, 185, 80, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        inset 0 -10px 18px rgba(0, 0, 0, 0.18);
    }
    .auth-button.is-unlocked .lock-shackle {
      animation: unlockButtonShackle 2100ms cubic-bezier(.18, .92, .2, 1) forwards;
    }
    .auth-button.is-unlocked .lock-check {
      animation: drawUnlockCheck 520ms 1400ms ease forwards;
    }
    .auth-button.is-rejected {
      border-color: rgba(248, 81, 73, 0.74);
      animation: authButtonReject 460ms cubic-bezier(.36, .07, .19, .97);
    }
    .auth-card.is-rejected {
      animation: authRejectShudder 460ms cubic-bezier(.36, .07, .19, .97);
    }
    .auth-button.is-unlocked .btn-label-default {
      display: none;
    }
    .auth-button.is-unlocked .btn-label-success {
      display: inline;
    }
    @keyframes drawUnlockCheck {
      to { stroke-dashoffset: 0; }
    }
    @keyframes unlockButtonShackle {
      0% { transform: translateY(-2.1px) scaleY(1.18); }
      24% { transform: translateY(-8px) scaleY(1.2); }
      44% { transform: translate(1.8px, -8.4px) rotate(-18deg) scaleY(1.04); }
      70% { transform: translate(3.4px, -6.8px) rotate(-34deg); }
      100% { transform: translate(3.6px, -6.4px) rotate(-38deg); }
    }
    @keyframes authRejectShudder {
      0%, 100% { transform: translateX(0); }
      16% { transform: translateX(-7px); }
      32% { transform: translateX(6px); }
      48% { transform: translateX(-4px); }
      64% { transform: translateX(3px); }
      80% { transform: translateX(-1.5px); }
    }
    @keyframes authButtonReject {
      0%, 100% { transform: translateX(0); }
      18% { transform: translateX(-4px); }
      36% { transform: translateX(3px); }
      54% { transform: translateX(-2px); }
      72% { transform: translateX(1px); }
    }
    .auth-card .auth-status {
      position: absolute;
      z-index: 3;
      left: 50%;
      top: calc(64% + 3.75rem);
      transform: translateX(-50%);
      min-height: 1.2rem;
      width: min(35.5rem, calc(100vw - 2rem));
      margin-top: 0.05rem;
      color: var(--text-muted);
      font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 0.92rem;
      text-align: center;
    }
    .auth-status.pending { color: #d29922; }
    .auth-status.error { color: var(--c-negative); }
    .auth-status.success,
    .auth-status.ok { color: var(--c-positive); }
    .auth-card .auth-status.pending { color: #d29922; }
    .auth-card .auth-status.error { color: var(--c-negative); }
    .auth-card .auth-status.success,
    .auth-card .auth-status.ok { color: var(--c-positive); }
    .auth-help-row {
      position: absolute;
      z-index: 3;
      left: 50%;
      top: calc(64% + 6.35rem);
      transform: translateX(-50%);
      display: flex;
      justify-content: center;
      width: min(35.5rem, calc(100vw - 2rem));
      margin-top: 0.08rem;
      padding-top: 0;
      border-top: 0;
      font-size: 1rem;
      line-height: 1.45;
      text-align: center;
    }
    .auth-help-row a {
      color: var(--text-muted);
      text-decoration: none;
      border-bottom: 1px dotted transparent;
      transition: color 150ms ease, border-color 150ms ease;
    }
    .auth-help-row a {
      color: rgba(104, 181, 255, 0.84);
      font-weight: 500;
      border-bottom-color: rgba(47, 129, 247, 0.28);
      overflow-wrap: anywhere;
    }
    .auth-help-row a:hover,
    .auth-help-row a:hover {
      color: var(--secure-led-bright);
      border-bottom-color: var(--secure-led-bright);
    }
    input[type="checkbox"] {
      width: 16px;
      height: 16px;
      accent-color: var(--c-positive);
      cursor: pointer;
    }
    footer {
      margin-top: 2.5rem;
      padding: 1.35rem 1rem 0;
      border-top: 1px solid var(--border-soft);
      color: var(--text-dim);
      font-size: 0.82rem;
      text-align: center;
      display: flex;
      flex-direction: column;
      gap: 0.4rem;
      align-items: center;
      background:
        linear-gradient(90deg, transparent, rgba(214, 168, 75, 0.045), transparent);
    }
    footer .footer-line {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      flex-wrap: wrap;
      justify-content: center;
    }
    footer .dot { color: var(--border); }
    footer .footer-promises {
      font-size: 0.88rem;
      color: var(--text-muted);
    }
    footer .footer-promises b {
      color: var(--text);
      font-weight: 600;
    }
    footer a {
      color: var(--text-muted);
      text-decoration: none;
      border-bottom: 1px dotted transparent;
      transition: color 150ms ease, border-color 150ms ease;
    }
    footer a:hover { color: var(--accent); border-bottom-color: var(--accent); }
    @media (max-width: 980px) {
      .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .stat-card[data-metric="repos"],
      .stat-card[data-metric="views"],
      .stat-card[data-metric="uniques"],
      .stat-card[data-metric="clones"],
      .stat-card[data-metric="cloners"] {
        grid-column: span 1;
      }
      .opportunity-layout {
        grid-template-columns: 1fr;
      }
      .opportunity-notes {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      .event-graph-layout {
        grid-template-columns: 1fr;
      }
      .event-log {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .readiness-layout {
        grid-template-columns: 1fr;
      }
      .repo-table-wrap {
        overflow-x: visible;
      }
      #repo-table table,
      #repo-table tbody,
      #repo-table tr,
      #repo-table td {
        display: block;
        width: 100%;
      }
      #repo-table thead {
        display: none;
      }
      #repo-table tbody {
        display: grid;
        gap: 0.75rem;
      }
      #repo-table tr.repo-row {
        border: 1px solid var(--border-soft);
        border-radius: var(--radius);
        background:
          linear-gradient(90deg, rgba(255, 255, 255, 0.018), transparent),
          var(--bg-card-2);
        overflow: hidden;
      }
      #repo-table tr.repo-row.selected {
        box-shadow: inset 0 0 0 1px rgba(107, 184, 255, 0.35);
      }
      #repo-table td {
        border-bottom: 1px solid var(--border-soft);
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.85rem;
        text-align: right;
      }
      #repo-table td:last-child {
        border-bottom: none;
      }
      #repo-table td::before {
        content: attr(data-label);
        color: var(--text-dim);
        flex: 0 0 auto;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
      #repo-table td.checkbox-col {
        justify-content: flex-start;
      }
      #repo-table td.checkbox-col::before {
        content: "";
      }
      #repo-table td.repo-name {
        align-items: flex-start;
        text-align: left;
        white-space: normal;
      }
      #repo-table td.repo-name::before {
        padding-top: 0.08rem;
      }
      #repo-table .repo-name-wrap {
        justify-content: flex-end;
        min-width: 0;
        text-align: right;
        overflow-wrap: anywhere;
      }
      #repo-table .growth-cell {
        align-items: end;
        min-width: 0;
      }
      #repo-table .community-cell {
        align-items: end;
        min-width: 0;
      }
      #repo-table .repo-share {
        min-width: min(13rem, 62%);
        justify-content: flex-end;
      }
    }
    @media (max-width: 1240px) {
      .hero {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.7rem;
      }
      .hero-toolbar {
        align-items: stretch;
        width: 100%;
        gap: 0.2rem;
        flex: 0 1 auto;
      }
      .hero-copy {
        flex: 0 1 auto;
        max-width: 100%;
      }
      .hero-toolbar-controls {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: flex-start;
        gap: 0.48rem;
        border-radius: var(--radius);
      }
      .hero-toolbar-controls > .status-badge,
      .hero-toolbar-controls > .toolbar-button,
      .hero-toolbar-controls > .export-verify-tip {
        width: 100%;
      }
      .hero-toolbar-controls > .status-badge,
      .hero-toolbar-controls > .toolbar-button {
        justify-content: center;
      }
      .hero-toolbar-controls > .export-verify-tip > summary {
        width: 100%;
        justify-content: center;
      }
      #export-status {
        align-self: flex-start;
        max-width: 100%;
        width: 100%;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: anywhere;
      }
      #export-status.visible.multiline {
        width: 100%;
        max-width: 100%;
      }
      #export-status.visible {
        display: block;
      }
      .export-verify-popover {
        position: fixed;
        top: 6.75rem;
        left: max(1rem, calc((100vw - 42rem) / 2));
        right: max(1rem, calc((100vw - 42rem) / 2));
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: min(60vh, 24rem);
        overflow: auto;
      }
      .chart-grid, .section-grid { grid-template-columns: 1fr; }
      .section-grid.full { grid-template-columns: 1fr; }
      .story-board {
        grid-template-columns: 1fr;
      }
      .profile-overview,
      .profile-guidance {
        grid-template-columns: 1fr;
      }
      .profile-signal-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      .lead-story-card,
      .next-move-queue-card {
        min-height: auto;
      }
      .next-move-queue-card .insights-list {
        max-height: none;
        overflow: visible;
        padding-right: 0;
      }
      .chart-grid > .card:first-child .chart-container {
        height: 340px;
      }
      .chart-container.tall { height: 320px; }
      .controls-card {
        grid-template-columns: minmax(13rem, 0.62fr) minmax(20rem, 1fr);
      }
      .calendar-panel {
        grid-row: span 2;
      }
      .trust-playbook {
        grid-column: 1 / -1;
      }
      .trust-playbook-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }
    @media (max-width: 720px) {
      body { padding: 1rem; }
      .profile-signal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .profile-guidance li {
        grid-template-columns: 1fr;
        gap: 0.35rem;
      }
      body.auth-locked {
        min-height: 100svh;
        padding: 0;
      }
      #auth-shell {
        min-height: 100svh;
      }
      #auth-shell::before {
        top: 54%;
      }
      .auth-page {
        place-items: center;
        padding: 1.25rem 0;
      }
      .auth-wrap {
        width: 760px;
      }
      .auth-hero {
        top: 14.6%;
      }
      .auth-hero .brand-lockup {
        gap: 0.25rem;
      }
      .auth-hero h1 {
        font-size: 2.78rem;
      }
      .auth-hero .auth-brand-line-dashboard {
        font-size: 2.3rem;
      }
      .hero-toolbar-controls {
        gap: 0.42rem;
      }
      .toolbar-button {
        padding: 0.5rem 0.75rem;
        font-size: 0.82rem;
      }
      .status-badge {
        max-width: none;
        font-size: 0.82rem;
        padding: 0.5rem 0.75rem;
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
      }
      .controls-card {
        grid-template-columns: 1fr;
        gap: 0.75rem;
      }
      .controls-main {
        width: 100%;
        gap: 0.8rem;
      }
      .controls-group { gap: 0.48rem; }
      .calendar-panel {
        grid-row: auto;
        width: min(100%, 360px);
      }
      .trust-playbook {
        grid-column: auto;
      }
      .trust-playbook-grid {
        grid-template-columns: 1fr;
      }
      .trust-item-github-native {
        grid-template-columns: none;
        grid-template-rows: auto auto auto 1fr auto;
        grid-template-areas: none;
        align-items: stretch;
      }
      .trust-item-github-native .trust-item-head,
      .trust-item-github-native .trust-item-label,
      .trust-item-github-native h3,
      .trust-item-github-native p,
      .trust-item-github-native .trust-links {
        grid-area: auto;
      }
      .trust-item-github-native .trust-links {
        justify-content: flex-start;
        min-width: 0;
      }
      .trust-playbook-head {
        flex-direction: column;
        gap: 0.5rem;
      }
      .auth-card {
        width: 760px;
        gap: 0.56rem;
      }
      .auth-form {
        width: min(28rem, calc(100vw - 2rem));
        flex-direction: row;
        align-items: stretch;
        gap: 0.45rem;
      }
      .auth-input-wrap { flex-basis: auto; }
      .auth-button {
        width: auto;
        min-width: 8.2rem;
        padding-inline: 1.1rem;
      }
      .auth-card .auth-status,
      .auth-help-row {
        width: min(28rem, calc(100vw - 2rem));
      }
      .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .stat-card { min-height: 132px; }
      .stat-value { font-size: 1.5rem; }
      .growth-model-grid { grid-template-columns: 1fr; }
      .dashboard-notice-main {
        flex-direction: column;
      }
      .dashboard-notice-actions {
        justify-content: flex-start;
      }
      .dashboard-summary .stat-card {
        min-height: 132px;
      }
      .stats-grid.dashboard-summary {
        display: flex;
        gap: 0.75rem;
        overflow-x: auto;
        margin-inline: -1rem;
        padding: 0 1rem 0.2rem;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
        scrollbar-color: var(--border) transparent;
      }
      .stats-grid.dashboard-summary::-webkit-scrollbar { height: 4px; }
      .stats-grid.dashboard-summary::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
      .dashboard-summary .stat-card {
        flex: 0 0 min(17.5rem, 82vw);
        grid-column: auto;
        margin-bottom: 0;
        scroll-snap-align: start;
      }
      .lead-story-card {
        grid-template-rows: auto auto auto;
      }
      .story-stepper {
        justify-content: flex-start;
      }
      .story-tabs {
        margin-inline: -0.1rem;
        padding-inline: 0.1rem;
      }
      .story-tab {
        min-width: 6.7rem;
      }
      .lead-story-slide {
        min-height: 0;
      }
      .lead-story-slide h3 {
        max-width: 100%;
        font-size: 1.45rem;
      }
      .lead-story-summary {
        font-size: 0.8rem;
      }
      .insight-item { grid-template-columns: auto 1fr; }
      .insight-pct { grid-column: 2 / 3; justify-self: end; }
      .repo-spark { width: 64px; }
      .growth-cell { min-width: 150px; font-size: 0.82rem; }
      .growth-row {
        grid-template-columns: minmax(2.75rem, max-content) minmax(3.7rem, max-content) minmax(3.35rem, max-content);
        column-gap: 0.32rem;
      }
      .community-cell {
        min-width: 130px;
      }
      .community-meta {
        font-size: 0.72rem;
      }
      .repo-strip-card { grid-template-columns: 1fr; gap: 0.5rem; }
      .repo-strip-hint { display: none; }
      .section-header { flex-direction: column; align-items: stretch; }
      .section-copy,
      .section-actions {
        max-width: 100%;
        min-width: 0;
        width: 100%;
      }
      .section-actions {
        justify-content: flex-start;
        overflow: hidden;
      }
      .metric-tabs {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        max-width: 100%;
        min-width: 0;
        width: 100%;
        scrollbar-width: thin;
      }
      .metric-tab { flex: 0 0 auto; }
      .chart-container { height: 280px; }
      .chart-grid > .card:first-child .chart-container {
        height: 300px;
      }
      .opportunity-map,
      .opportunity-map svg {
        height: 15rem;
        min-height: 15rem;
      }
      .opportunity-notes {
        grid-template-columns: 1fr;
      }
      .opportunity-point text {
        display: none;
      }
      .event-graph-canvas,
      .event-graph-canvas svg {
        height: 15rem;
        min-height: 15rem;
      }
      .event-log {
        grid-template-columns: 1fr;
      }
      .event-log-title {
        white-space: normal;
      }
      .readiness-list {
        grid-template-columns: 1fr;
      }
      .readiness-fix-head {
        display: grid;
      }
      .readiness-meta {
        white-space: normal;
      }
      .momentum-cell { padding: 0.5rem 0; border-left: none; border-top: 1px solid var(--border-soft); }
      .momentum-cell:first-child { padding-top: 0; border-top: none; }
      .export-verify-popover {
        position: fixed;
        top: 7.25rem;
        left: 1rem;
        right: 1rem;
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: min(50vh, 20rem);
        overflow: auto;
      }
      .export-verify-popover code {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
      }
    }
    @media (max-width: 480px) {
      .auth-page {
        padding: 2.35rem 0.55rem 1rem;
      }
      .auth-wrap {
        width: 760px;
      }
      .auth-card {
        width: 760px;
        gap: 0.42rem;
      }
      .auth-form,
      .auth-card .auth-status,
      .auth-help-row {
        width: min(22rem, calc(100vw - 2rem));
      }
      .auth-form {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        top: 63.5%;
      }
      .auth-input-wrap {
        flex: 0 0 auto;
      }
      .auth-input {
        min-height: 46px;
        font-size: 0.95rem;
        padding: 0.78rem 0.82rem;
      }
      .auth-button {
        min-height: 46px;
        min-width: 0;
        width: 100%;
        padding-inline: 0.85rem;
      }
      .auth-card .auth-status {
        top: calc(63.5% + 6.65rem);
      }
      .auth-help-row {
        top: calc(63.5% + 8.75rem);
      }
      .auth-help-row {
        font-size: 0.92rem;
      }
      .auth-form { padding: 0.45rem; }
      .hero-toolbar-controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.36rem;
      }
      .toolbar-button {
        padding: 0.48rem 0.68rem;
        font-size: 0.8rem;
      }
      .status-badge {
        font-size: 0.8rem;
        padding: 0.48rem 0.68rem;
      }
      #dashboard-app .theme-toggle .theme-label { display: none; }
      .stats-grid { grid-template-columns: 1fr; }
      .stats-grid.dashboard-summary { display: flex; }
      .chart-grid > .card:first-child .chart-container,
      .chart-container,
      .chart-container.tall {
        height: 260px;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .stat-spark path.line { animation: none; }
      .pulse-dot { animation: none; }
      #auth-shell.is-opening::before,
      #auth-shell.is-opening::after,
      #auth-shell.is-revealing,
      #auth-shell.is-revealing .auth-card,
      .auth-card.is-opening {
        transform: none;
      }
      #auth-shell.is-revealing {
        opacity: 1;
      }
      #auth-shell.is-revealing .auth-card {
        opacity: 1;
      }
      #auth-shell.is-opening::before {
        transform: translate(-50%, -50%) rotate(-4deg);
      }
      #auth-shell.is-opening::after {
        opacity: 0.36;
      }
      .auth-card.is-opening .auth-vault-wheel {
        transform: translate(-50%, -50%) rotate(-8deg);
      }
      .auth-card.is-opening .auth-vault-wheel::before,
      .auth-card.is-opening .auth-vault-wheel::after {
        opacity: 0;
      }
      .auth-button.is-unlocked .lock-shackle,
      .auth-button.is-unlocked .lock-check {
        animation: none;
      }
      .auth-button.is-unlocked .lock-shackle {
        transform: translate(3.6px, -6.4px) rotate(-38deg);
      }
      .auth-button.is-unlocked .lock-check {
        stroke-dashoffset: 0;
      }
      .auth-button.is-rejected,
      .auth-card.is-rejected {
        animation: none;
      }
      * { transition-duration: 0.001ms !important; }
    }
