/* GENERATED — do not edit here. Source: byteflavour-design-system@6a306fa
   (forgejo/skin.css + tokens). Regenerate: bun run build in that repo,
   then copy dist/theme-neuromorph.css over this file. */
/* ============================================================
   theme-neuromorph — Forgejo theme for git.byteflavour.dev
   Part 2 of dist/theme-neuromorph.css (part 1 is the token :root).

   Strategy: inherit the entire builtin dark theme, then override
   the load-bearing variable set with Doom One. Anything we don't
   name keeps a sane dark default — upgrade-tolerant by design.

   Voice: this is the QUIET register of the Neuromorph language
   (rules.md §6 — a forge is a work tool; diffs need calm). Full
   Doom recolor, no atmosphere, no relief. Chrome layer comes
   later, if at all.

   Derived shades (palette discipline): ramps marked (d) are
   mixes of a canonical doom color toward bg/white.

   LICENSE CONFORMANCE: Forgejo's own CSS ships under Forgejo's
   licenses (see /assets/licenses.txt on the instance). This file
   deliberately @imports the builtin dark theme AT RUNTIME instead
   of embedding any of it — not one line of Forgejo-licensed CSS
   is redistributed inside this MIT-licensed file. Keep it that
   way: never inline/copy from theme-forgejo-*.css.
   ============================================================ */
@import url("theme-forgejo-dark.css");

:root {
  /* ---- canvas: ONE ground everywhere — #282c34, the same material the
         relief is carved from (rules.md §2). Content boxes sit slightly
         RECESSED rather than raised: chrome lifts, content lies. ---- */
  --color-body: #282c34;
  --color-box-body: #21252b;
  --color-box-body-highlight: #262a30;
  --color-box-header: #1e2126;
  --color-card: #21252b;
  --color-menu: #282c34;
  --color-nav-bg: #282c34;
  --color-nav-hover-bg: #2e3239;
  --color-secondary-nav-bg: #282c34;
  --color-header-wrapper: #282c34;
  --color-header-wrapper-transparent: rgba(40, 44, 52, 0);
  --color-footer: #282c34;
  --color-timeline: #3f444a;
  --color-project-board-bg: #21252b;
  --color-code-bg: #21252b;
  --color-markup-code-block: #21252b;
  --color-markup-code-inline: #21252b;
  --color-markup-table-row: rgba(187, 194, 207, 0.03);
  --color-editor-line-highlight: #262a30;
  --color-active: #2e3239;
  --color-hover: rgba(187, 194, 207, 0.05);
  --color-light: rgba(187, 194, 207, 0.05);
  --color-light-border: rgba(187, 194, 207, 0.12);
  --color-shadow: rgba(0, 0, 0, 0.5);
  --color-overlay-backdrop: rgba(0, 0, 0, 0.6);
  --color-expand-button: #2e3239;

  /* ---- text ---- */
  --color-text: #bbc2cf;
  --color-text-dark: #dfdfdf;
  --color-text-focus: #dfdfdf;
  --color-text-light: #9ca0a4;
  --color-text-light-1: #8a9099; /* (d) base7->base6 */
  --color-text-light-2: #8a9099;
  --color-text-light-3: #73797e;
  --color-placeholder-text: #5b6268;
  --color-caret: #51afef;
  --color-white: #dfdfdf;
  --color-pure-black: #1b2229;
  --color-black: #1e2126;
  --color-black-light: #23272e;
  --color-black-dark-1: #1b2229;
  --color-black-dark-2: #16181c;
  --color-grey: #5b6268;
  --color-grey-light: #73797e;
  --color-gold: #ecbe7b;

  /* ---- primary: doom blue ---- */
  --color-primary: #51afef;
  --color-primary-contrast: #282c34;
  --color-primary-hover: #7cc4f5;
  --color-primary-active: #2f86c7; /* (d) */
  --color-primary-dark-1: #3a9de0; /* (d) ramp blue->dark-blue */
  --color-primary-dark-2: #2f86c7;
  --color-primary-dark-3: #2257a0;
  --color-primary-dark-4: #1d4a88;
  --color-primary-dark-5: #173b6d;
  --color-primary-dark-6: #122e55;
  --color-primary-dark-7: #0d2140;
  --color-primary-light-1: #62b7f1; /* (d) ramp blue->white */
  --color-primary-light-2: #7cc4f5;
  --color-primary-light-3: #8fccf6;
  --color-primary-light-4: #a5d5f8;
  --color-primary-light-5: #badffa;
  --color-primary-light-6: #d0e9fb;
  --color-primary-light-7: #e5f4fd;
  --color-primary-alpha-10: rgba(81, 175, 239, 0.1);
  --color-primary-alpha-20: rgba(81, 175, 239, 0.2);
  --color-primary-alpha-30: rgba(81, 175, 239, 0.3);
  --color-primary-alpha-40: rgba(81, 175, 239, 0.4);
  --color-primary-alpha-50: rgba(81, 175, 239, 0.5);
  --color-primary-alpha-60: rgba(81, 175, 239, 0.6);
  --color-primary-alpha-70: rgba(81, 175, 239, 0.7);
  --color-primary-alpha-80: rgba(81, 175, 239, 0.8);
  --color-primary-alpha-90: rgba(81, 175, 239, 0.9);

  /* ---- secondary: the border/structure grays (doom base scale) ---- */
  --color-secondary: #3f444a;
  --color-secondary-bg: #2e3239;
  --color-secondary-hover: #4a5058; /* (d) */
  --color-secondary-active: #565c66; /* (d) */
  /* CAREFUL: in a DARK theme this ramp gets LIGHTER, not darker — these
     are TEXT colors (upstream maps them steel-550 -> steel-100). Getting
     it backwards buried .help text at #202328 on a #21252b box: legible
     to nobody. rules.md §6 — readability beats style. Ramp runs
     base5 -> base8 with derived steps. */
  --color-secondary-dark-1: #5b6268;
  --color-secondary-dark-2: #656c72;
  --color-secondary-dark-3: #6f767c;
  --color-secondary-dark-4: #73797e;
  --color-secondary-dark-5: #7f858a;
  --color-secondary-dark-6: #8a9099;
  --color-secondary-dark-7: #939aa0;
  --color-secondary-dark-8: #9ca0a4;
  --color-secondary-dark-9: #a8acb0;
  --color-secondary-dark-10: #b4b8bc;
  --color-secondary-dark-11: #bbc2cf;
  --color-secondary-dark-12: #cdd2da;
  --color-secondary-dark-13: #dfdfdf;
  --color-secondary-light-1: #4a5058;
  --color-secondary-light-2: #565c66;
  --color-secondary-light-3: #666c76;
  --color-secondary-light-4: #73797e;
  --color-secondary-alpha-10: rgba(63, 68, 74, 0.1);
  --color-secondary-alpha-20: rgba(63, 68, 74, 0.2);
  --color-secondary-alpha-30: rgba(63, 68, 74, 0.3);
  --color-secondary-alpha-40: rgba(63, 68, 74, 0.4);
  --color-secondary-alpha-50: rgba(63, 68, 74, 0.5);
  --color-secondary-alpha-60: rgba(63, 68, 74, 0.6);
  --color-secondary-alpha-70: rgba(63, 68, 74, 0.7);
  --color-secondary-alpha-80: rgba(63, 68, 74, 0.8);
  --color-secondary-alpha-90: rgba(63, 68, 74, 0.9);

  /* ---- accent: magenta = intent (rules.md §3) ---- */
  --color-accent: #c678dd;
  --color-small-accent: #c678dd;

  /* ---- the doom accent families (light/dark ramps derived) ---- */
  --color-blue: #51afef;   --color-blue-light: #7cc4f5;   --color-blue-dark-1: #2f86c7;   --color-blue-dark-2: #2257a0;
  --color-green: #98be65;  --color-green-light: #b3d18b;  --color-green-dark-1: #7fa34f;  --color-green-dark-2: #66843c;
  --color-red: #ff6c6b;    --color-red-light: #ff8f8e;    --color-red-dark-1: #e05555;    --color-red-dark-2: #b84444;
  --color-yellow: #ecbe7b; --color-yellow-light: #f2d09e; --color-yellow-dark-1: #d3a35c; --color-yellow-dark-2: #b18641;
  --color-purple: #c678dd; --color-purple-light: #d79ae7; --color-purple-dark-1: #a95cc4; --color-purple-dark-2: #9045a8;
  --color-orange: #da8548; --color-orange-light: #e59e6b; --color-orange-dark-1: #bf6f36; --color-orange-dark-2: #a05a28;
  --color-teal: #4db5bd;   --color-teal-light: #74c7cd;   --color-teal-dark-1: #3b959c;   --color-teal-dark-2: #2c757b;
  --color-violet: #a9a1e1; --color-violet-light: #beb8ea; --color-violet-dark-1: #8d84cf; --color-violet-dark-2: #7268bd;
  --color-pink: #e07398;   --color-pink-light: #ea94b1;   --color-pink-dark-1: #c55a7f;   --color-pink-dark-2: #a44667; /* (d) red/magenta mix */
  --color-olive: #8aa757;  --color-olive-light: #a5bd79;  --color-olive-dark-1: #718c45;  --color-olive-dark-2: #5a7136; /* (d) green shifted */
  --color-brown: #8a6b4d;  --color-brown-light: #a5876a;  --color-brown-dark-1: #71563c;  --color-brown-dark-2: #59432e; /* (d) */

  /* ---- controls ---- */
  --color-button: #2e3239;
  --color-input-background: #21252b;
  --color-input-border: #3f444a;
  --color-input-border-hover: #5b6268;
  --color-input-text: #bbc2cf;
  --color-input-toggle-background: #3f444a;
  /* NOT a filled red: Forgejo pairs this with thin-red TEXT for
     .button.danger (outline style) — a solid background here buried the
     label. Subtle wash, like upstream's error-bg. */
  --color-danger-bg: rgba(255, 108, 107, 0.12);
  --color-label-bg: #2e3239;
  --color-label-bg-alt: #262a30;
  --color-label-hover-bg: #3f444a;
  --color-label-active-bg: #23272e;
  --color-label-text: #bbc2cf;
  --color-reaction-bg: rgba(187, 194, 207, 0.07);
  --color-reaction-hover-bg: rgba(81, 175, 239, 0.15);
  --color-reaction-active-bg: rgba(81, 175, 239, 0.25);
  --color-tooltip-bg: #1e2126;
  --color-tooltip-text: #bbc2cf;
  --color-selection-bg: #2257a0;
  --color-selection-fg: #dfdfdf;
  --color-highlight-bg: rgba(236, 190, 123, 0.22);
  --color-highlight-fg: #dfdfdf;

  /* ---- states & messages ---- */
  --color-success-text: #98be65;
  --color-success-bg: rgba(152, 190, 101, 0.12);
  --color-success-border: rgba(152, 190, 101, 0.4);
  --color-warning-text: #ecbe7b;
  --color-warning-bg: rgba(236, 190, 123, 0.12);
  --color-warning-border: rgba(236, 190, 123, 0.4);
  --color-error-text: #ff6c6b;
  --color-error-bg: rgba(255, 108, 107, 0.12);
  --color-error-bg-active: rgba(255, 108, 107, 0.24);
  --color-error-bg-hover: rgba(255, 108, 107, 0.18);
  --color-error-border: rgba(255, 108, 107, 0.4);
  --color-info-text: #51afef;
  --color-info-bg: rgba(81, 175, 239, 0.12);
  --color-info-border: rgba(81, 175, 239, 0.4);

  /* ---- badges ---- */
  --color-green-badge: #98be65;  --color-green-badge-bg: rgba(152, 190, 101, 0.15);  --color-green-badge-hover-bg: rgba(152, 190, 101, 0.25);
  --color-red-badge: #ff6c6b;    --color-red-badge-bg: rgba(255, 108, 107, 0.15);    --color-red-badge-hover-bg: rgba(255, 108, 107, 0.25);
  --color-yellow-badge: #ecbe7b; --color-yellow-badge-bg: rgba(236, 190, 123, 0.15); --color-yellow-badge-hover-bg: rgba(236, 190, 123, 0.25);
  --color-orange-badge: #da8548; --color-orange-badge-bg: rgba(218, 133, 72, 0.15);  --color-orange-badge-hover-bg: rgba(218, 133, 72, 0.25);

  /* ---- diffs: doom green/red/yellow at rest ---- */
  --color-diff-added-row-bg: rgba(152, 190, 101, 0.09);
  --color-diff-added-row-border: rgba(152, 190, 101, 0.35);
  --color-diff-added-word-bg: rgba(152, 190, 101, 0.25);
  --color-diff-removed-row-bg: rgba(255, 108, 107, 0.09);
  --color-diff-removed-row-border: rgba(255, 108, 107, 0.35);
  --color-diff-removed-word-bg: rgba(255, 108, 107, 0.25);
  --color-diff-moved-row-bg: rgba(236, 190, 123, 0.09);
  --color-diff-moved-row-border: rgba(236, 190, 123, 0.35);
  --color-diff-inactive: #2e3239;
  /* thin-* are TEXT colors upstream (.text.red, .button.danger read
     from them), not the diff tints they look like — they must be
     opaque and legible on a dark ground. */
  --color-thin-green: #b3d18b;
  --color-thin-red: #ff8f8e;
  --color-thin-red-highlight: #ffb0af;
  --color-thin-orange: #e59e6b;
  --color-thin-purple: #d79ae7;

  /* ---- CI / presence indicators ---- */
  --color-indicator-active: #98be65;
  --color-indicator-active-20: rgba(152, 190, 101, 0.2);
  --color-indicator-idle: #ecbe7b;
  --color-indicator-idle-20: rgba(236, 190, 123, 0.2);
  --color-indicator-offline: #5b6268;
  --color-indicator-offline-20: rgba(91, 98, 104, 0.2);

  /* ---- console / actions logs ---- */
  --color-console-bg: #1b2229;
  --color-console-fg: #bbc2cf;
  --color-console-fg-subtle: #73797e;
  --color-console-border: #3f444a;
  --color-console-hover-bg: #202328;
  --color-console-active-bg: #23272e;
  --color-console-menu-bg: #1e2126;
  --color-console-menu-border: #3f444a;

  /* ---- ANSI: the doom terminal, verbatim ---- */
  --color-ansi-black: #1b2229;
  --color-ansi-red: #ff6c6b;
  --color-ansi-green: #98be65;
  --color-ansi-yellow: #ecbe7b;
  --color-ansi-blue: #51afef;
  --color-ansi-magenta: #c678dd;
  --color-ansi-cyan: #46d9ff;
  --color-ansi-white: #bbc2cf;
  --color-ansi-bright-black: #5b6268;
  --color-ansi-bright-red: #ff8f8e;
  --color-ansi-bright-green: #b3d18b;
  --color-ansi-bright-yellow: #f2d09e;
  --color-ansi-bright-blue: #7cc4f5;
  --color-ansi-bright-magenta: #d79ae7;
  --color-ansi-bright-cyan: #6fe2ff;
  --color-ansi-bright-white: #dfdfdf;
}

/* ============================================================
   HEADER TRANSFORMATION — the bar buttons at the forge door.
   CSS-only by design: no template override, therefore no drift.
   Anchors verified against the live instance (15.0.6): the bar is
   <nav id="navbar"> — an ID, NOT a .navbar class (cost one deploy to
   learn). If Forgejo
   ever renames one, the button simply disappears — loud, never
   silent, and the rest of the theme keeps working.

   Guest mark (rules.md §8): Forgejo's OWN logo file, served by
   Forgejo itself, used as a CSS mask and worn in doom green. We
   copy nothing and modify nothing — the recolor happens at render
   time. Half-strength relief: a pedestal, not the chrome voice.
   ============================================================ */

/* shared: the benchmark circle */
#navbar-logo,
#navbar a.item[href="/explore/repos"],
#navbar a.item[href^="https://forgejo.org/docs"],
#navbar a.item[href^="/user/login"],
#navbar a.item[href="/issues"],
#navbar a.item[href="/pulls"],
#navbar a.item[href="/milestones"] {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0 !important;
  margin: 0 6px;
  border-radius: 50%;
  font-size: 0 !important;          /* swallow the text labels */
  background: linear-gradient(145deg, #2e3239, #262a30);
  border: 1px solid rgba(81, 175, 239, 0.1);
  box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.5), -6px -6px 12px rgba(80, 90, 105, 0.4);
  transition: all 300ms ease;
}

/* the glyph layer */
#navbar-logo::after,
#navbar a.item[href="/explore/repos"]::after,
#navbar a.item[href^="https://forgejo.org/docs"]::after,
#navbar a.item[href^="/user/login"]::after,
#navbar a.item[href="/issues"]::after,
#navbar a.item[href="/pulls"]::after,
#navbar a.item[href="/milestones"]::after {
  content: "";
  width: 20px;
  height: 20px;
  background: #51afef;
  filter: drop-shadow(0 0 4px rgba(81, 175, 239, 0.5));
  transition: all 300ms ease;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center;   mask-position: center;
  -webkit-mask-size: contain;      mask-size: contain;
}

/* hover: surface tilts (gradient flips), glyph goes magenta */
#navbar a.item[href="/explore/repos"]:hover,
#navbar a.item[href^="https://forgejo.org/docs"]:hover,
#navbar a.item[href^="/user/login"]:hover,
#navbar a.item[href="/issues"]:hover,
#navbar a.item[href="/pulls"]:hover,
#navbar a.item[href="/milestones"]:hover {
  background: linear-gradient(145deg, #262a30, #2e3239);
  box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5), -4px -4px 8px rgba(60, 65, 75, 0.4),
              inset 2px 2px 4px rgba(0, 0, 0, 0.2);
}
#navbar a.item[href="/explore/repos"]:hover::after,
#navbar a.item[href^="https://forgejo.org/docs"]:hover::after,
#navbar a.item[href^="/user/login"]:hover::after,
#navbar a.item[href="/issues"]:hover::after,
#navbar a.item[href="/pulls"]:hover::after,
#navbar a.item[href="/milestones"]:hover::after {
  background: #c678dd;
  filter: drop-shadow(0 0 8px rgba(198, 120, 221, 0.8));
  transform: scale(1.1);
}

/* hide the originals that live inside the links */
#navbar-logo img,
#navbar a.item[href^="/user/login"] svg { display: none !important; }

/* — the glyphs — */
#navbar-logo::after {
  /* Forgejo's own logo, masked and worn in doom green (§8) */
  width: 26px; height: 26px;
  background: #98be65;
  filter: none;
  -webkit-mask-image: url('/assets/img/logo.svg');
  mask-image: url('/assets/img/logo.svg');
}
#navbar a.item[href="/explore/repos"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
}
#navbar a.item[href^="https://forgejo.org/docs"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 18h2v-2h-2v2zm1-16C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-2.21 0-4 1.79-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 18h2v-2h-2v2zm1-16C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-2.21 0-4 1.79-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4z'/%3E%3C/svg%3E");
}
#navbar a.item[href^="/user/login"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E");
}

/* the logo pedestal is quieter than the chrome (§8) */
#navbar-logo {
  border-radius: 8px;
  border-color: rgba(152, 190, 101, 0.12);
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.35), -3px -3px 6px rgba(80, 90, 105, 0.28);
}
#navbar-logo:hover {
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.35), -2px -2px 4px rgba(80, 90, 105, 0.24);
}

/* the bar itself: the benchmark's own ground (§2) */
#navbar {
  background-color: rgba(40, 44, 52, 0.9) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid #21252b !important;
  padding: 8px 0 !important;
}

/* ============================================================
   LANDING — hero + the four visitor boxes. Paired with the one
   template override we allow ourselves (custom/templates/home.tmpl),
   which is deliberately static: no AppDisplayName, no locale
   lookups, no Forgejo internals beyond base/head and base/footer.
   Minimal breakage surface by construction.
   ============================================================ */
.page-content.home { padding-top: 0 !important; }

.bf-hero { text-align: center; padding: 64px 16px 26px; }
.bf-hero .line { font-size: 42px; line-height: 1.2; letter-spacing: 0.01em; }
.bf-hero .hand {
  font-weight: 350; font-style: italic; color: #ecbe7b;
  text-shadow: 0 0 18px rgba(236, 190, 123, 0.25);
}
.bf-hero .tools {
  font-family: 'Fira Code', ui-monospace, monospace; font-weight: 600; color: #51afef;
  text-shadow: 0 0 6px rgba(81, 175, 239, 0.5), 0 0 20px rgba(81, 175, 239, 0.2);
}
.bf-hero .sub { margin-top: 16px; font-size: 15px; color: #9ca0a4; }

.bf-boxes {
  max-width: 1100px; margin: 0 auto; padding: 10px 16px 48px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 32px;
}
.bf-feature .ico { width: 26px; height: 26px; color: #51afef; margin-bottom: 10px; display: block; }
.bf-feature h3 { margin: 0 0 6px; font-size: 15px; font-weight: 600; color: #dfdfdf; }
.bf-feature p { margin: 0; font-size: 13.5px; line-height: 1.6; color: #9ca0a4; }
.bf-feature .links { margin-top: 8px; display: flex; flex-direction: column; gap: 3px; font-size: 13.5px; }
.bf-feature .links a { color: #c678dd; }


/* ---- logged-in navbar: the remaining text links become buttons ----
   Anchors: /issues, /pulls, /milestones (AppSubUrl is empty here).
   The label text stays in the DOM — font-size:0 hides it visually but
   screen readers still announce it; sighted users get the CSS tooltip
   below. Everything right of the notification bell is left alone. */
#navbar a.item[href="/issues"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm0-12a4 4 0 1 0 0 8 4 4 0 0 0 0-8z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm0-12a4 4 0 1 0 0 8 4 4 0 0 0 0-8z'/%3E%3C/svg%3E");
}
#navbar a.item[href="/pulls"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 3.4a3 3 0 00-1 5.83v5.54a3 3 0 101.9 0V9.23a3 3 0 00-.9-5.83zm0 1.9a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2zm0 11.1a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2zM17.4 3.4a3 3 0 00-.95 5.84v3.19a1.9 1.9 0 01-1.9 1.9H7.4v1.9h7.15a3.8 3.8 0 003.8-3.8V9.24a3 3 0 00-.95-5.84zm0 1.9a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 3.4a3 3 0 00-1 5.83v5.54a3 3 0 101.9 0V9.23a3 3 0 00-.9-5.83zm0 1.9a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2zm0 11.1a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2zM17.4 3.4a3 3 0 00-.95 5.84v3.19a1.9 1.9 0 01-1.9 1.9H7.4v1.9h7.15a3.8 3.8 0 003.8-3.8V9.24a3 3 0 00-.95-5.84zm0 1.9a1.1 1.1 0 110 2.2 1.1 1.1 0 010-2.2z'/%3E%3C/svg%3E");
}
#navbar a.item[href="/milestones"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 6L14 4H5v17h2v-7h5.6l.4 2h7V6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.4 6L14 4H5v17h2v-7h5.6l.4 2h7V6z'/%3E%3C/svg%3E");
}

/* Explore wears GLASSES once signed in: next to issues/PRs a magnifier
   reads as "search", which is a different promise — explore means
   LOOKING AROUND. The landing keeps its magnifier (there, searching is
   exactly what a visitor does). :has() tells the two states apart by
   the presence of the signed-in links. */
#navbar:has(a.item[href="/issues"]) a.item[href="/explore/repos"]::after {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 10.2a4.3 4.3 0 100 8.6 4.3 4.3 0 000-8.6zm0 1.8a2.5 2.5 0 110 5 2.5 2.5 0 010-5zM17.6 10.2a4.3 4.3 0 100 8.6 4.3 4.3 0 000-8.6zm0 1.8a2.5 2.5 0 110 5 2.5 2.5 0 010-5zM10.5 13.6h3v1.7h-3zM4.3 11.0L2.4 7.0 4.1 6.2 6.0 10.2zM19.7 11.0L21.6 7.0 19.9 6.2 18.0 10.2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 10.2a4.3 4.3 0 100 8.6 4.3 4.3 0 000-8.6zm0 1.8a2.5 2.5 0 110 5 2.5 2.5 0 010-5zM17.6 10.2a4.3 4.3 0 100 8.6 4.3 4.3 0 000-8.6zm0 1.8a2.5 2.5 0 110 5 2.5 2.5 0 010-5zM10.5 13.6h3v1.7h-3zM4.3 11.0L2.4 7.0 4.1 6.2 6.0 10.2zM19.7 11.0L21.6 7.0 19.9 6.2 18.0 10.2z'/%3E%3C/svg%3E");
}

/* ---- tooltips ----
   Handled by Forgejo's own tooltip attribute, applied in the
   custom/footer.tmpl hook (nixos-config: hosts/chiba/forgejo/) so our
   hints look exactly like the bell's. A pure-CSS ::before version was
   tried first and rendered but got clipped/stacked out of sight — not
   worth fighting when the host already has a working mechanism. */


/* ---- active state: the button you're standing on is carved in ----
   Forgejo marks the current page with class="item active" (plus
   aria-current) — the state grammar's third register: pressed relief,
   green glyph (rules.md §3). */
#navbar a.item.active[href="/explore/repos"],
#navbar a.item.active[href="/issues"],
#navbar a.item.active[href="/pulls"],
#navbar a.item.active[href="/milestones"] {
  background: linear-gradient(145deg, #1e2126, #24282e) !important;
  box-shadow: inset 4px 4px 8px rgba(0, 0, 0, 0.5),
              inset -4px -4px 8px rgba(40, 44, 52, 0.2) !important;
}
#navbar a.item.active[href="/explore/repos"]::after,
#navbar a.item.active[href="/issues"]::after,
#navbar a.item.active[href="/pulls"]::after,
#navbar a.item.active[href="/milestones"]::after {
  background: #98be65;
  filter: drop-shadow(0 0 10px rgba(152, 190, 101, 1));
}
/* hovering the page you're already on: stays carved, glyph stays green */
#navbar a.item.active[href="/explore/repos"]:hover::after,
#navbar a.item.active[href="/issues"]:hover::after,
#navbar a.item.active[href="/pulls"]:hover::after,
#navbar a.item.active[href="/milestones"]:hover::after {
  background: #98be65;
  filter: drop-shadow(0 0 10px rgba(152, 190, 101, 1));
  transform: none;
}

/* ---- let the tooltips escape the bar ----
   They sit below the 40px button and would be clipped by the navbar's
   own box; nothing else in here depends on that clipping. */
#navbar,
#navbar .navbar-left,
#navbar .navbar-right,
#navbar .ui.secondary.menu { overflow: visible !important; }

/* ---- critical buttons: dark text on a light accent ----
   Doom's red (#ff6c6b) is a LIGHT accent; Forgejo's own rules assume a
   dark red and pair it with white (2.4:1 here — the operator found red
   text on red buttons in repo settings, and white-on-red elsewhere is
   barely better). The language already answers this: text on any accent
   is on-accent, i.e. the background color (rules.md §3). Same treatment
   for the other filled accent buttons so the rule holds everywhere. */
.ui.red.button,
.ui.red.buttons .button,
.ui.red.button:hover,
.ui.red.buttons .button:hover,
.ui.red.button:focus,
.ui.red.button:active {
  color: #282c34 !important;
  text-shadow: none !important;
}
/* outline variant: transparent background, so the text must go LIGHT red */
.ui.basic.red.button,
.ui.basic.red.buttons .button {
  color: #ff8f8e !important;
  border-color: #ff6c6b !important;
}
.ui.basic.red.button:hover,
.ui.basic.red.buttons .button:hover {
  color: #ffb0af !important;
  border-color: #ff8f8e !important;
}
/* the same reasoning for the other filled accents */
.ui.green.button, .ui.green.buttons .button,
.ui.orange.button, .ui.orange.buttons .button,
.ui.yellow.button, .ui.yellow.buttons .button {
  color: #282c34 !important;
  text-shadow: none !important;
}

/* ============================================================
   MOBILE: hand the navbar back to Forgejo.
   Below 768px Forgejo hides every .item and re-shows them as
   full-width TEXT rows inside the hamburger menu. Our button
   selectors are more specific than its rules, so they kept the
   40px circles visible and tore the bar apart (reported from a
   phone screenshot, 2026-08-05).

   Round chrome is a pointer affordance anyway: on a narrow screen a
   labelled list beats a row of glyphs. So every override is undone
   here — display, size, shape, relief, and the font-size:0 that
   swallowed the labels — and Forgejo's own collapsing menu takes
   over untouched. The logo keeps its pedestal; it stays visible in
   both states by Forgejo's own rules.
   ============================================================ */
@media (max-width: 767.98px) {
  #navbar a.item[href="/explore/repos"],
  #navbar a.item[href^="https://forgejo.org/docs"],
  #navbar a.item[href^="/user/login"],
  #navbar a.item[href="/issues"],
  #navbar a.item[href="/pulls"],
  #navbar a.item[href="/milestones"] {
    display: none !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: revert !important;
    border: none !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    font-size: inherit !important;
    position: static !important;
  }
  /* menu open: Forgejo's full-width rows, labels and all */
  #navbar.navbar-menu-open a.item[href="/explore/repos"],
  #navbar.navbar-menu-open a.item[href^="https://forgejo.org/docs"],
  #navbar.navbar-menu-open a.item[href^="/user/login"],
  #navbar.navbar-menu-open a.item[href="/issues"],
  #navbar.navbar-menu-open a.item[href="/pulls"],
  #navbar.navbar-menu-open a.item[href="/milestones"] {
    display: flex !important;
    width: 100% !important;
  }
  /* no glyph layer in list mode — the text is back */
  #navbar a.item[href="/explore/repos"]::after,
  #navbar a.item[href^="https://forgejo.org/docs"]::after,
  #navbar a.item[href^="/user/login"]::after,
  #navbar a.item[href="/issues"]::after,
  #navbar a.item[href="/pulls"]::after,
  #navbar a.item[href="/milestones"]::after { display: none !important; }
}

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --color-base-bg: #282c34; /** Main background — Doom One / One Dark base */
  --color-base-bg-alt: #21252b; /** Darker surface: sidebars, cards, wells */
  --color-base-fg: #bbc2cf; /** Main foreground / body text */
  --color-accent-blue: #51afef; /** Primary accent — identity, idle interactive state */
  --color-accent-blue-dark: #2257a0;
  --color-accent-magenta: #c678dd; /** Secondary accent — links, hover intent */
  --color-accent-magenta-dark: #9045a8;
  --color-accent-green: #98be65; /** Active / confirmed state */
  --color-accent-yellow: #ecbe7b; /** Warnings */
  --color-accent-red: #ff6c6b; /** Errors */
  --color-surface-raised-hi: #2e3239; /** Neuromorph raised gradient, lit stop (toward the 145° light) */
  --color-surface-raised-lo: #262a30; /** Neuromorph raised gradient, shaded stop */
  --color-surface-pressed-hi: #1e2126; /** Neuromorph pressed gradient, deep stop */
  --color-surface-pressed-lo: #24282e; /** Neuromorph pressed gradient, shallow stop */
  --color-shadow-cast: rgba(0, 0, 0, 0.5); /** Dark half of every neuromorph shadow pair */
  --color-shadow-light: rgba(80, 90, 105, 0.4); /** Light half of every neuromorph shadow pair (cool gray, NOT white) */
  --color-shadow-light-dim: rgba(60, 65, 75, 0.4); /** Light half while hovering (surface sinking toward the ground) */
  --color-glow-blue: rgba(81, 175, 239, 0.5);
  --color-glow-magenta: rgba(198, 120, 221, 0.8);
  --color-glow-green: #98be65;
  --color-edge-accent-faint: rgba(81, 175, 239, 0.1); /** 1px border on raised chrome — a whisper of the primary accent */
  --color-edge-accent-soft: rgba(81, 175, 239, 0.2); /** 1px border on glass containers */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 1rem;
  --radius-full: 50%; /** Circular chrome — nav icons */
  --light-angle: 145deg; /** THE global light source. Every gradient and every shadow pair in the system agrees on this direction (from top-left). See rules.md invariant 1. */
  --motion-relief: 300ms; /** Transitions that move surfaces (raise/press/glow) */
  --motion-tint: 200ms; /** Color-only transitions (link hover) */
  --elevation-glass: 0px 8px 32px 0px rgba(0, 0, 0, 0.3), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.05); /** Glassmorphic content containers: one deep drop + a 1px top highlight */
  --font-family-sans: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; /** Body and UI text */
  --font-family-mono: 'Fira Code', monospace; /** Brand wordmark, code, terminal-flavored accents */
  --font-family-display: 'Train One', sans-serif; /** Neon-signage display face (JP foundry, Latin + kana — the Chatsubo lockup's two lines share it). Self-hosted from assets/fonts/, OFL — never the Google Fonts CDN (GDPR). */
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-line-height-body: 1.5;
  --font-line-height-heading: 1.2;
  --color-semantic-primary: var(--color-accent-blue);
  --color-semantic-primary-variant: var(--color-accent-blue-dark);
  --color-semantic-secondary: var(--color-accent-magenta);
  --color-semantic-secondary-variant: var(--color-accent-magenta-dark);
  --color-semantic-on-accent: var(--color-base-bg); /** Text placed on any accent color */
  --elevation-raised: 6px 6px 12px 0px var(--color-shadow-cast), -6px -6px 12px 0px var(--color-shadow-light); /** Resting state of neuromorph chrome: the dual pair, light from 145° */
  --elevation-hover: 4px 4px 8px 0px var(--color-shadow-cast), -4px -4px 8px 0px var(--color-shadow-light-dim), inset 2px 2px 4px 0px rgba(0, 0, 0, 0.2); /** Hover: the surface sinks halfway — shadows shrink, an inset hint appears */
  --elevation-pressed: inset 4px 4px 8px 0px var(--color-shadow-cast), inset -4px -4px 8px 0px rgba(40, 44, 52, 0.2); /** Active/current state: fully carved into the surface */
  --glow-idle: 0px 0px 4px var(--color-glow-blue); /** drop-shadow() filter values — glow marks interactivity, intensity rises with engagement */
  --glow-hover: 0px 0px 8px var(--color-glow-magenta);
  --glow-active: 0px 0px 10px var(--color-glow-green);
}
