/*
 * Numoteq v1 · theme for Redmine 7.
 *
 * The Redmine sibling of the Numoteq Forgejo theme (v3.5): same tokens, same rules.
 *
 *   1. Structure is quiet: panels are a hairline border on a card surface, no shadow.
 *   2. Neo-brutalism is reserved: only the primary (cyan) action is raised with a hard offset.
 *      Popovers and dialogs carry a soft offset in the border colour. Everything else is flat.
 *   3. One control geometry: 32px controls, 6px radius; 8px panels, 12px dialogs, pills for badges.
 *   4. The accent is a signal, not a surface: text in the accent uses --nq-accent-text.
 *   5. Content never sits on the grid; the grid lives in the margins and the header band.
 *
 * Redmine has one theme per instance, so both palettes are here. javascripts/theme.js sets
 * html[data-nq-scheme] before the page paints. Palette values only define --nq-*; the Open Color
 * variables Redmine uses (--oc-*) are mapped onto them, then the components are shaped.
 */
@import url("/assets/application-c183e617.css");

@font-face { font-family: "NQ Sora"; src: url("/assets/themes/numoteq/sora-variable-d2fba319.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }
@font-face { font-family: "NQ Inter"; src: url("/assets/themes/numoteq/inter-variable-d7247216.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "NQ JetBrains Mono"; src: url("/assets/themes/numoteq/jetbrains-mono-ed40b09e.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "NQ JetBrains Mono"; src: url("/assets/themes/numoteq/jetbrains-mono-500-1bc99771.woff2") format("woff2"); font-weight: 500 600; font-display: swap; }
@font-face { font-family: "NQ JetBrains Mono"; src: url("/assets/themes/numoteq/jetbrains-mono-700-1a8f0f6c.woff2") format("woff2"); font-weight: 700 800; font-display: swap; }

/* ───────────────────────── Palettes ───────────────────────── */

:root {
  color-scheme: light;

  --nq-canvas: #fbfbfa;
  --nq-chrome: #ffffff;
  --nq-card: #ffffff;
  --nq-raised: #ffffff;
  --nq-field: #ffffff;
  --nq-inset: #f2f2ec;
  --nq-hover: #f7f7f3;
  --nq-selected: #ecebe5;
  --nq-grid: rgb(27 29 34 / .05);
  --nq-grid-hero: rgb(27 29 34 / .07);

  --nq-border: #e3e4df;
  --nq-border-strong: #c7c9c4;
  --nq-extrude: #1b1d22;
  --nq-check-edge: #1b1d22;

  --nq-ink: #0a0b0e;
  --nq-muted: #545864;
  --nq-subtle: #696e7a;
  --nq-faint: #a9aeb8;

  --nq-primary: #73f4f6;
  --nq-primary-ink: #04131a;
  --nq-accent: #b5f9fa;
  --nq-accent-strong: #2bbdbf;
  --nq-accent-text: #137274;
  --nq-accent-wash: #e8fafb;
  --nq-accent-wash-strong: #d3f6f6;
  --nq-ring: #137274;

  --nq-danger: #d94a5c;
  --nq-danger-text: #b8293c;
  --nq-danger-wash: #ffe7ea;
  --nq-success: #1fa060;
  --nq-success-text: #17693f;
  --nq-success-wash: #e6f6ec;
  --nq-warning: #b87900;
  --nq-warning-text: #825200;
  --nq-warning-wash: #fff4db;
  --nq-violet: #7a4fd6;
  --nq-violet-text: #5b34b0;
  --nq-violet-wash: #f1ebff;

  --nq-depth: rgb(27 29 34 / .12);
  --nq-backdrop: rgb(10 11 14 / .42);
  --nq-code-bg: #fafaf5;
  --nq-diff-add: #e9f7ee;
  --nq-diff-add-word: #bfe8cf;
  --nq-diff-del: #fdecee;
  --nq-diff-del-word: #f6c3ca;

  /* Theme-drawn select chevron (a data URI cannot read a variable). */
  --nq-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23545864' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --nq-search-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23696e7a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
  --nq-rgb-ink: 10, 11, 14;
  --nq-rgb-card: 255, 255, 255;
}

:root[data-nq-scheme="dark"] {
  color-scheme: dark;

  --nq-canvas: #0b0c0f;
  --nq-chrome: #14161b;
  --nq-card: #1a1d24;
  --nq-raised: #22262f;
  --nq-field: #0b0c0f;
  --nq-inset: #0b0c0f;
  --nq-hover: #20242c;
  --nq-selected: #2a2e38;
  --nq-grid: rgb(255 255 255 / .045);
  --nq-grid-hero: rgb(255 255 255 / .07);

  --nq-border: #2a2e38;
  --nq-border-strong: #424855;
  --nq-extrude: #336d6e;
  --nq-check-edge: #8a90a2;

  --nq-ink: #f4f5f1;
  --nq-muted: #b7bcc6;
  --nq-subtle: #8a90a2;
  --nq-faint: #555b67;

  --nq-primary: #73f4f6;
  --nq-primary-ink: #04131a;
  --nq-accent: #b5f9fa;
  --nq-accent-strong: #73f4f6;
  --nq-accent-text: #73f4f6;
  --nq-accent-wash: rgb(115 244 246 / .09);
  --nq-accent-wash-strong: rgb(115 244 246 / .16);
  --nq-ring: #b5f9fa;

  --nq-danger: #ff6a55;
  --nq-danger-text: #ff8f7c;
  --nq-danger-wash: rgb(255 106 85 / .12);
  --nq-success: #2fbf71;
  --nq-success-text: #5fd897;
  --nq-success-wash: rgb(47 191 113 / .13);
  --nq-warning: #f5c542;
  --nq-warning-text: #f5c542;
  --nq-warning-wash: rgb(245 197 66 / .12);
  --nq-violet: #b48bff;
  --nq-violet-text: #c9adff;
  --nq-violet-wash: rgb(180 139 255 / .13);

  --nq-depth: rgb(0 0 0 / .5);
  --nq-backdrop: rgb(4 6 9 / .74);
  --nq-code-bg: #0e1014;
  --nq-diff-add: rgb(47 191 113 / .10);
  --nq-diff-add-word: rgb(47 191 113 / .30);
  --nq-diff-del: rgb(255 106 85 / .10);
  --nq-diff-del-word: rgb(255 106 85 / .30);

  --nq-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b7bcc6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --nq-search-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a90a2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
  --nq-rgb-ink: 244, 245, 241;
  --nq-rgb-card: 26, 29, 36;
}

/* ───────────────────────── System tokens and Open Color mapping ───────────────────────── */

:root {
  --nq-font-body: "NQ Inter", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --nq-font-head: "NQ Sora", "Sora", "NQ Inter", ui-sans-serif, system-ui, sans-serif;
  --nq-font-mono: "NQ JetBrains Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --nq-radius-xs: 4px;
  --nq-radius-sm: 6px;
  --nq-radius-md: 8px;
  --nq-radius-lg: 12px;
  --nq-radius-pill: 999px;
  --nq-control-h: 32px;
  --nq-control-h-lg: 36px;
  --nq-sheet: 1440px;
  --nq-gutter: 24px;
  --nq-grid-size: 56px;

  --nq-shadow-raised: 2px 2px 0 var(--nq-extrude);
  --nq-shadow-raised-hover: 3px 3px 0 var(--nq-extrude);
  --nq-shadow-raised-active: 1px 1px 0 var(--nq-extrude);
  --nq-shadow-pop: 4px 4px 0 var(--nq-border), 0 14px 36px -12px var(--nq-depth);
  --nq-shadow-dialog: 6px 6px 0 var(--nq-border-strong), 0 28px 70px -24px var(--nq-depth);
  --nq-focus-ring: 0 0 0 3px color-mix(in srgb, var(--nq-accent-strong) 28%, transparent);
  --nq-ease: cubic-bezier(.2, .7, .2, 1);
  --nq-fast: 120ms;

  --fonts-main: var(--nq-font-body);
  --color-current-marker: var(--nq-accent-strong);

  /* Neutrals: surfaces, lines, ink. */
  --oc-white: var(--nq-card);
  --oc-black: var(--nq-ink);
  --oc-white-rgb: var(--nq-rgb-card);
  --oc-black-rgb: var(--nq-rgb-ink);
  --oc-gray-0: var(--nq-hover);
  --oc-gray-1: var(--nq-inset);
  --oc-gray-2: var(--nq-selected);
  --oc-gray-3: var(--nq-border);
  --oc-gray-4: var(--nq-border);
  --oc-gray-5: var(--nq-subtle);
  --oc-gray-6: var(--nq-subtle);
  --oc-gray-7: var(--nq-muted);
  --oc-gray-8: var(--nq-ink);
  --oc-gray-9: var(--nq-ink);
  --oc-gray-9-rgb: var(--nq-rgb-ink);

  /* Links and selection: the accent. */
  --oc-blue-0: var(--nq-accent-wash);
  --oc-blue-1: var(--nq-accent-wash-strong);
  --oc-blue-2: var(--nq-accent-wash-strong);
  --oc-blue-5: var(--nq-accent-strong);
  --oc-blue-6: var(--nq-accent-text);
  --oc-blue-7: var(--nq-accent-strong);
  --oc-blue-8: var(--nq-accent-strong);
  --oc-blue-9: var(--nq-accent-text);
  --oc-indigo-0: var(--nq-chrome);
  --oc-indigo-1: var(--nq-hover);
  --oc-indigo-2: var(--nq-selected);
  --oc-indigo-5: var(--nq-accent-strong);
  --oc-indigo-7: var(--nq-accent-strong);
  --oc-indigo-9: var(--nq-accent-text);
  --oc-cyan-1: var(--nq-accent-wash-strong);
  --oc-cyan-6: var(--nq-accent-text);
  --oc-cyan-7: var(--nq-accent-text);
  --oc-pink-2: var(--nq-danger-wash);

  /* Signals. */
  --oc-red-1: var(--nq-danger-wash);
  --oc-red-2: var(--nq-danger-wash);
  --oc-red-3: color-mix(in srgb, var(--nq-danger) 45%, transparent);
  --oc-red-4: color-mix(in srgb, var(--nq-danger) 35%, var(--nq-card));
  --oc-red-5: var(--nq-danger);
  --oc-red-7: var(--nq-danger);
  --oc-red-8: var(--nq-danger);
  --oc-red-9: var(--nq-danger-text);
  --oc-pink-5: var(--nq-danger);
  --oc-pink-9: var(--nq-danger-text);
  --oc-green-1: var(--nq-success-wash);
  --oc-green-2: var(--nq-success-wash);
  --oc-green-3: color-mix(in srgb, var(--nq-success) 45%, transparent);
  --oc-green-4: color-mix(in srgb, var(--nq-success) 55%, var(--nq-card));
  --oc-green-7: var(--nq-success);
  --oc-green-8: var(--nq-success);
  --oc-green-9: var(--nq-success-text);
  --oc-lime-2: var(--nq-success-wash);
  --oc-yellow-0: var(--nq-hover);
  --oc-yellow-1: var(--nq-warning-wash);
  --oc-yellow-2: var(--nq-warning-wash);
  --oc-yellow-3: color-mix(in srgb, var(--nq-warning) 45%, transparent);
  --oc-yellow-4: var(--nq-warning);
  --oc-yellow-7: var(--nq-warning);
  --oc-yellow-8: var(--nq-warning-text);
  --oc-yellow-9: var(--nq-warning-text);
  --oc-orange-1: var(--nq-warning-wash);
  --oc-orange-2: var(--nq-warning-wash);
  --oc-orange-6: var(--nq-warning);
  --oc-orange-7: var(--nq-warning);
  --oc-orange-9: var(--nq-warning-text);
  --oc-grape-2: var(--nq-violet-wash);
  --oc-grape-7: var(--nq-violet);
  --oc-grape-9: var(--nq-violet-text);
  --oc-violet-0: var(--nq-violet-wash);
  --oc-violet-1: var(--nq-violet-wash);
  --oc-violet-3: var(--nq-violet-wash);
}

/* ───────────────────────── Base ───────────────────────── */

html, body { background: var(--nq-canvas); }
body {
  color: var(--nq-ink);
  font-family: var(--nq-font-body);
  font-size: 14px;
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
  line-height: 1.45;
}
::selection { background: var(--nq-primary); color: var(--nq-primary-ink); }

h1, h2, h3, h4, h5, h6 { font-family: var(--nq-font-body); }
#content h1, #content h2, #content h3, #content h4, #content h5, #content h6,
#content h2, h2, h3, h4 { color: var(--nq-ink); }
h2, #content > h2, .wiki h1 {
  font-family: var(--nq-font-head);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.25;
  padding: 0;
  margin-block: 0 16px;
}
h3 { font-family: var(--nq-font-head); font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
h4 { border-block-end-color: var(--nq-border); font-weight: 600; padding-block: 0 6px; }
hr { background: var(--nq-border); }
pre, code, kbd, samp, tt, .sample-data td,
body.textarea-monospace textarea.wiki-edit { font-family: var(--nq-font-mono); }

/* Every focusable control shows a ring when reached by keyboard. */
:focus-visible { outline: 2px solid var(--nq-ring); outline-offset: 2px; }
a:focus-visible { border-radius: 3px; outline-offset: 2px; }

/* ───────────────────────── Links and icons ───────────────────────── */

a, a:link, a:visited { color: var(--nq-accent-text); text-decoration: none; }
a:hover, a:active { color: var(--nq-accent-text); text-decoration: underline; text-underline-offset: 2px; }
a.issue.closed, a.issue.closed:link, a.issue.closed:visited { color: var(--nq-subtle); }
a.user.user-mention { background: var(--nq-accent-wash); border-radius: var(--nq-radius-xs); padding: 0 .2em; }

svg.icon-svg { stroke: currentColor; }
svg.icon-svg-filled { fill: currentColor; }
a.icon .icon-svg, a.icon-only .icon-svg, span.icon-actions .icon-svg,
a.icon:hover .icon-svg, a.icon-only:hover .icon-svg, span.icon-actions:hover .icon-svg { stroke: currentColor; }
a.icon .icon-svg-filled, a.icon-only .icon-svg-filled,
a.icon:hover .icon-svg-filled, a.icon-only:hover .icon-svg-filled { fill: currentColor; }
.icon-ok svg.icon-svg, span.icon-checked:has(:not(a svg.icon-svg)) svg.icon-svg { stroke: var(--nq-success); }
.icon-error svg.icon-svg { stroke: var(--nq-danger); }
.icon-warning svg.icon-svg { stroke: var(--nq-warning); }
a.icon-only { border-radius: var(--nq-radius-xs); color: var(--nq-subtle); }
a.icon-only:hover { color: var(--nq-ink); }

/* ───────────────────────── Page frame ───────────────────────── */

/* The grid frames the page in the margins; the sheet in the middle stays clean. */
#wrapper {
  background-color: var(--nq-canvas);
  background-image:
    linear-gradient(var(--nq-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--nq-grid) 1px, transparent 1px);
  background-size: var(--nq-grid-size) var(--nq-grid-size);
  background-position: center top;
}

/* Top menu: the application bar. */
nav.top-menu {
  background: var(--nq-chrome);
  border-block-end: 1px solid var(--nq-border);
  color: var(--nq-muted);
  font-size: 13px;
  gap: 16px;
  min-block-size: 52px;
  padding-inline: max(var(--nq-gutter), calc((100% - var(--nq-sheet)) / 2 + var(--nq-gutter)));
  position: relative;
  z-index: 60;
}
nav.top-menu .general-menu { align-items: center; display: flex; gap: 20px; min-inline-size: 0; }
.nq-brand, .nq-brand:link, .nq-brand:visited {
  align-items: center;
  color: var(--nq-ink);
  display: inline-flex;
  flex-shrink: 0;
  font-family: var(--nq-font-head);
  font-size: 16px;
  font-weight: 600;
  gap: 10px;
  letter-spacing: -.02em;
}
.nq-brand:hover { color: var(--nq-ink); text-decoration: none; }
.top-menu__links ul { gap: 2px; }
.top-menu__links a, .top-menu__links a:link, .top-menu__links a:visited, #account .dropdown-trigger {
  border-radius: var(--nq-radius-sm);
  color: var(--nq-muted);
  display: inline-flex;
  font-weight: 500;
  padding: 6px 10px;
}
.top-menu__links a:hover, #account .dropdown-trigger:hover { background: var(--nq-hover); color: var(--nq-ink); }
.top-menu__links svg.icon-svg, #account .dropdown-trigger .icon-svg,
.top-menu__links a:hover svg.icon-svg, #account .dropdown-trigger:hover .icon-svg { stroke: currentColor; }
nav.top-menu .profile-menu { align-items: center; display: flex; gap: 12px; }
#account .dropdown-trigger { gap: 6px; padding: 4px 8px 4px 4px; }
#account .dropdown-trigger .avatar { border-radius: var(--nq-radius-sm); }
#account .dropdown-content .user-info { color: var(--nq-ink); }
#account .dropdown-content .user-info .user-name { font-weight: 600; }
#account .dropdown-content .logout { border-block-start-color: var(--nq-border); }
#loggedas { color: var(--nq-subtle); }

/* Colour scheme switch (added by theme.js). */
.nq-scheme {
  background: var(--nq-inset);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-sm);
  display: inline-flex;
  gap: 2px;
  padding: 2px;
}
html .nq-scheme > button[value] {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: var(--nq-radius-xs);
  block-size: 26px;
  color: var(--nq-subtle);
  cursor: pointer;
  display: inline-flex;
  inline-size: 28px;
  justify-content: center;
  margin: 0;
  padding: 0;
}
html .nq-scheme > button[value]:hover { background: transparent; color: var(--nq-ink); }
html .nq-scheme > button[aria-checked="true"] { background: var(--nq-card); box-shadow: 0 0 0 1px var(--nq-border-strong); color: var(--nq-ink); }

/* Header band: project title, search, project tabs. The grid reaches into it and fades out. */
#header {
  background: var(--nq-chrome);
  border-block-end: 1px solid var(--nq-border);
  color: var(--nq-ink);
  isolation: isolate;
  padding-block: 18px 0;
  z-index: 50;
  padding-inline: max(var(--nq-gutter), calc((100% - var(--nq-sheet)) / 2 + var(--nq-gutter)));
}
#header::before {
  background-image:
    linear-gradient(var(--nq-grid-hero) 1px, transparent 1px),
    linear-gradient(90deg, var(--nq-grid-hero) 1px, transparent 1px);
  background-position: center top;
  background-size: var(--nq-grid-size) var(--nq-grid-size);
  content: "";
  inset: 0;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 85%);
  pointer-events: none;
  position: absolute;
  z-index: -1;
}
body.has-main-menu #header { padding-block-end: 46px; }
#header a, #header a:hover { color: inherit; }
#header h1 {
  font-family: var(--nq-font-head);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1.2;
  min-block-size: 40px;
}
#header h1 .breadcrumbs {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .06em;
  margin-block-end: 4px;
  text-transform: uppercase;
}
#header h1 .breadcrumbs a { color: var(--nq-subtle); }
#header h1 .breadcrumbs a:hover { color: var(--nq-ink); text-decoration: none; }
#quick-search { gap: 10px; min-block-size: 40px; }
#quick-search form label { color: var(--nq-subtle); font-size: 13px; }
#quick-search form label a { color: var(--nq-subtle); }
#quick-search #q {
  background: var(--nq-field) var(--nq-search-glyph) no-repeat 9px 50%;
  block-size: var(--nq-control-h);
  inline-size: 200px;
  padding-inline-start: 32px;
}

/* Project tabs. */
#main-menu {
  background: transparent;
  inset-inline: max(var(--nq-gutter), calc((100% - var(--nq-sheet)) / 2 + var(--nq-gutter)));
  padding: 0;
}
#main-menu ul { gap: 2px; min-block-size: 44px; }
#main-menu li a {
  border-radius: var(--nq-radius-sm) var(--nq-radius-sm) 0 0;
  color: var(--nq-muted);
  font-size: 13.5px;
  font-weight: 500;
  padding: 12px 12px 11px;
  position: relative;
}
#main-menu li a:hover { background: transparent; color: var(--nq-ink); }
#main-menu li a.selected, #main-menu li a.selected:hover {
  background: transparent;
  box-shadow: none;
  color: var(--nq-ink);
  font-weight: 600;
}
#main-menu li a.selected::after {
  background: var(--nq-accent-strong);
  border-radius: 2px 2px 0 0;
  block-size: 2px;
  content: "";
  inset-block-end: -1px;
  inset-inline: 10px;
  position: absolute;
}
#main-menu li:has(a#new-object) { padding-inline-end: 6px; }
#main-menu li a.new-object, #main-menu li a.new-object:hover {
  align-items: center;
  background: var(--nq-card);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  display: inline-flex;
  margin: 0;
  padding: 5px 7px;
}
#main-menu li a.new-object:hover { background: var(--nq-hover); border-color: var(--nq-subtle); }
#main-menu .menu-children {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  margin-block-start: 4px;
  padding: 4px;
}
#main-menu .menu-children li a { background: transparent; border-radius: var(--nq-radius-sm); color: var(--nq-ink); padding: 7px 10px; }
#main-menu .menu-children li a:hover { background: var(--nq-hover); color: var(--nq-ink); }
#main-menu .tabs-buttons { background: transparent; }
#main-menu .menu-children li a::after { display: none; }

/* The sheet: content and sidebar on the canvas, never on the grid. */
#main {
  background: var(--nq-canvas);
  box-sizing: border-box;
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: var(--nq-sheet);
}
#content {
  background: transparent;
  padding: 24px var(--nq-gutter) 32px;
}
#sidebar {
  background: transparent;
  border-inline-start: 1px solid var(--nq-border);
  color: var(--nq-muted);
  font-size: 13px;
  padding: 24px 20px 32px;
}
#sidebar h3 {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  margin-block: 22px 8px;
  text-transform: uppercase;
}
#sidebar h3:first-child { margin-block-start: 0; }
#sidebar ul li, #sidebar ul.flat li { margin: 0; }
#sidebar ul:not(.toc) > li > a, #sidebar #admin-menu a, #sidebar > div > a:not(.icon-only) {
  border-radius: var(--nq-radius-sm);
  display: inline-block;
  line-height: 1.5;
  margin-inline-start: -8px;
  padding: 3px 8px;
}
#sidebar a:hover { background: var(--nq-hover); color: var(--nq-ink); text-decoration: none; }
#sidebar a.selected, #sidebar a.selected:hover {
  background: transparent;
  box-shadow: none;
  color: var(--nq-ink);
  font-weight: 600;
  position: relative;
}
#sidebar a.selected::before {
  background: var(--nq-accent-strong);
  border-radius: 2px;
  content: "";
  inline-size: 2px;
  inset-block: 5px;
  inset-inline-start: -2px;
  position: absolute;
}
#sidebar a.selected svg.icon-svg { stroke: currentColor !important; }
#sidebar hr { background: var(--nq-border); margin-block: 16px; }
#sidebar-switch-button { border-radius: var(--nq-radius-sm); color: var(--nq-subtle); }
#sidebar-switch-button svg { stroke: currentColor; }
#sidebar-switch-button:hover { background: var(--nq-hover); color: var(--nq-ink); }
#sidebar-switch-panel { margin-block-start: -12px; margin-block-end: 8px; }
#main.collapsedsidebar #sidebar { border-inline-start-color: transparent; padding-inline: 8px; }
#admin-menu li { padding-block-end: 2px; }
#admin-menu a { align-items: center; display: inline-flex; gap: 4px; }

#footer {
  background: transparent;
  border-block-start: 1px solid var(--nq-border);
  color: var(--nq-subtle);
  font-size: 12px;
  padding: 14px;
}
#footer a { color: var(--nq-muted); }

/* ───────────────────────── Buttons ───────────────────────── */

input, select, textarea, button {
  background-color: var(--nq-field);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  font-family: var(--nq-font-body);
  font-size: 13.5px;
}
input[type="submit"], button[type="submit"], input[type="button"], input[type="reset"], button:not([class*="jstb_"], .tab-left, .tab-right, .ui-button, .ui-dialog-titlebar-close), a.button, .button {
  align-items: center;
  background: var(--nq-card);
  block-size: var(--nq-control-h);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  box-shadow: none;
  color: var(--nq-ink);
  cursor: pointer;
  font-weight: 500;
  justify-content: center;
  padding: 0 14px;
  transition: background-color var(--nq-fast) var(--nq-ease), border-color var(--nq-fast) var(--nq-ease), box-shadow var(--nq-fast) var(--nq-ease), transform var(--nq-fast) var(--nq-ease);
}
input[type="submit"]:hover, button[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, a.button:hover, .button:hover {
  background: var(--nq-hover);
  border-color: var(--nq-subtle);
  text-decoration: none;
}
/* The page's primary action: solid cyan with the hard offset. Redmine names the main submit "commit". */
#content form input[type="submit"][name="commit"],
#content form button[type="submit"][name="commit"],
#login-form input[type="submit"],
.ui-dialog-buttonset button:first-child {
  background: var(--nq-primary);
  border-color: var(--nq-extrude);
  box-shadow: var(--nq-shadow-raised);
  color: var(--nq-primary-ink);
  font-weight: 600;
}
#content form input[type="submit"][name="commit"]:hover,
#content form button[type="submit"][name="commit"]:hover,
#login-form input[type="submit"]:hover,
.ui-dialog-buttonset button:first-child:hover {
  background: var(--nq-primary);
  border-color: var(--nq-extrude);
  box-shadow: var(--nq-shadow-raised-hover);
  transform: translate(-1px, -1px);
}
#content form input[type="submit"][name="commit"]:active,
#login-form input[type="submit"]:active { box-shadow: var(--nq-shadow-raised-active); transform: translate(1px, 1px); }
/* Inline filters and small forms keep a quiet button: one raised action per view. "View differences"
 * (wiki history, repository revisions) navigates, it does not save. */
body:is(.action-history, .controller-repositories) #content form input[type="submit"][name="commit"],
#content :is(#query_form, .contextual, #sidebar, fieldset#filters, .add-filter, #watchers, #relations, .splitcontentright, table) form input[type="submit"][name="commit"],
#content :is(#query_form, .contextual, fieldset#filters, table, .ui-dialog) input[type="submit"][name="commit"],
#content form :is(.contextual, fieldset#filters, #filters, .filters) input[type="submit"][name="commit"] {
  background: var(--nq-card);
  border-color: var(--nq-border-strong);
  box-shadow: none;
  color: var(--nq-ink);
  font-weight: 500;
  transform: none;
}
input:disabled, select:disabled, textarea:disabled, button:disabled,
input[type="submit"]:disabled { background: var(--nq-inset); border-color: var(--nq-border); box-shadow: none !important; color: var(--nq-faint); cursor: not-allowed; transform: none !important; }

/* Contextual actions (Edit, Log time, Watch, Copy…): quiet text buttons; "New …" is the primary. */
.contextual { align-items: center; display: flex; flex-wrap: wrap; font-size: 13px; gap: 6px; justify-content: flex-end; line-height: 1.4; margin-block: 0 12px; }
.contextual > *:not(:first-child), .contextual .journal-actions > *:not(:first-child) { margin-inline-start: 0; }
#content > .contextual { float: inline-end; margin-block: 0; }
.contextual > a.icon, .contextual > span.icon, .contextual > .drdn > .drdn-trigger.icon-only, .contextual > a.icon-only {
  align-items: center;
  block-size: 30px;
  border: 1px solid transparent;
  border-radius: var(--nq-radius-sm);
  box-sizing: border-box;
  color: var(--nq-muted);
  display: inline-flex;
  font-weight: 500;
  gap: 2px;
  padding: 0 9px;
}
.contextual > a.icon:hover, .contextual > .drdn > .drdn-trigger.icon-only:hover, .contextual > a.icon-only:hover {
  background: var(--nq-hover);
  border-color: var(--nq-border);
  color: var(--nq-ink);
  text-decoration: none;
}
.contextual > .drdn.expanded > .drdn-trigger,
.journal-actions .drdn.expanded > .drdn-trigger { background: var(--nq-selected); border-radius: var(--nq-radius-xs); color: var(--nq-ink); }
.journal-actions .drdn-trigger:hover { background: var(--nq-hover); border-radius: var(--nq-radius-xs); }
#content > .contextual > a.icon-add, #content > .contextual > a.icon-add:hover {
  background: var(--nq-primary);
  border-color: var(--nq-extrude);
  box-shadow: var(--nq-shadow-raised);
  color: var(--nq-primary-ink);
  font-weight: 600;
  padding-inline: 12px 14px;
}
#content > .contextual > a.icon-add:hover { box-shadow: var(--nq-shadow-raised-hover); transform: translate(-1px, -1px); }
#content > .contextual > a.icon-add + a.icon-add { background: transparent; border-color: transparent; box-shadow: none; color: var(--nq-muted); font-weight: 500; transform: none; }
#content > .contextual > a.icon-add + a.icon-add:hover { background: var(--nq-hover); border-color: var(--nq-border); color: var(--nq-ink); }
.contextual .icon-del, .contextual .icon-del:hover, .contextual a.icon-lock { color: var(--nq-muted); }
.contextual > a.icon-del:hover { color: var(--nq-danger-text); }

/* ───────────────────────── Fields ───────────────────────── */

input:not([type]), input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="url"],
input[type="tel"], input[type="number"], input[type="date"], input[type="time"], input[type="datetime-local"], select, textarea {
  background-color: var(--nq-field);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  box-sizing: border-box;
  color: var(--nq-ink);
  font-size: 13.5px;
  min-block-size: var(--nq-control-h);
  padding: 5px 10px;
  transition: border-color var(--nq-fast) var(--nq-ease), box-shadow var(--nq-fast) var(--nq-ease);
}
textarea { line-height: 1.55; padding: 8px 10px; }
select { background: var(--nq-field) var(--nq-chevron) no-repeat calc(100% - 8px) 50%; padding-inline-end: 30px; }
[dir="rtl"] select { background-position: 8px 50%; }
select[multiple], select[multiple=multiple], select[size]:not([size="1"]) { background-image: none; padding: 4px; }
select option { background: var(--nq-raised); color: var(--nq-ink); }
:is(input, select, textarea):not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="file"]):hover:not(:focus, :disabled) { border-color: var(--nq-subtle); }
input:is([type="text"], [type="password"], [type="email"], [type="search"], [type="url"], [type="tel"], [type="number"], [type="date"], [type="time"], [type="datetime-local"], :not([type])):focus,
select:focus, select:active, textarea:focus, textarea:active,
input[type="text"]:focus, input[type="text"]:active, input[type="password"]:focus, input[type="date"]:focus {
  border-color: var(--nq-accent-strong);
  box-shadow: var(--nq-focus-ring);
  outline: none;
}
::placeholder { color: var(--nq-subtle); opacity: 1; }
input[type="file"] { background: transparent; border: 0; color: var(--nq-muted); min-block-size: 0; padding: 0; }
input[type="file"]::file-selector-button {
  background: var(--nq-card);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  cursor: pointer;
  font: 500 13px var(--nq-font-body);
  margin-inline-end: 10px;
  padding: 6px 12px;
}
input[type="file"]::file-selector-button:hover { background: var(--nq-hover); }
input.autocomplete, #principal_search, #user_search {
  background: var(--nq-field) var(--nq-search-glyph) no-repeat 9px 50%;
  padding-inline-start: 32px !important;
}
[dir="rtl"] input.autocomplete { background-position: calc(100% - 9px) 50%; }
input.autocomplete.ajax-loading { background-image: url("/assets/loading-5fb375e6.gif"); }
input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .7; }

/* Checkboxes and radios are theme-drawn: primary fill with a primary-ink mark. The mark is a
 * background, so the control never changes display (Redmine hides some with .hidden). */
input[type="checkbox"], input[type="radio"] {
  appearance: none;
  background: var(--nq-field) no-repeat center;
  block-size: 16px;
  border: 1px solid var(--nq-check-edge);
  border-radius: var(--nq-radius-xs);
  cursor: pointer;
  flex-shrink: 0;
  inline-size: 16px;
  margin: 0 5px 0 0;
  min-block-size: 0;
  padding: 0;
  vertical-align: -3px;
}
[dir="rtl"] input:is([type="checkbox"], [type="radio"]) { margin: 0 0 0 5px; }
input[type="radio"] { border-radius: 50%; }
input[type="checkbox"]:checked {
  background: var(--nq-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%2304131a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px;
  border-color: var(--nq-extrude);
}
input[type="checkbox"]:indeterminate {
  background: var(--nq-primary) linear-gradient(var(--nq-primary-ink), var(--nq-primary-ink)) no-repeat center / 8px 2px;
  border-color: var(--nq-extrude);
}
input[type="radio"]:checked { background: radial-gradient(circle, var(--nq-primary-ink) 0 3px, var(--nq-primary) 3.5px); border-color: var(--nq-extrude); }
input:is([type="checkbox"], [type="radio"]):hover:not(:disabled) { border-color: var(--nq-accent-strong); }
input:is([type="checkbox"], [type="radio"]):focus-visible { box-shadow: var(--nq-focus-ring); outline: none; }
input:is([type="checkbox"], [type="radio"]):disabled { background-color: var(--nq-inset); border-color: var(--nq-border-strong); opacity: .7; }
/* A label wrapping its checkbox is one unit: the box never ends a line without its text. */
label:has(> input:is([type="checkbox"], [type="radio"])) { align-items: baseline; display: inline-flex; gap: 0; margin-inline-end: 12px; }
label:has(> input:is([type="checkbox"], [type="radio"])) > input { align-self: center; flex-shrink: 0; }
:is(.check_box_group, .objects-selection, #users_for_watcher, .query-columns, fieldset.settings, #notified-projects, #tracker_project_ids, #custom_field_project_ids) label:has(> input),
label.block:has(> input) { display: flex; margin-inline-end: 0; }
table.list .checkbox input, #sidebar li input[type=checkbox] { block-size: 16px; }

/* Tabular forms: mono labels in the left column. */
.tabular p { min-block-size: 32px; padding-block: 5px; padding-inline-start: 200px; }
.tabular label {
  color: var(--nq-muted);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  inline-size: 186px;
  letter-spacing: .06em;
  line-height: 1.4;
  margin-inline-start: -200px;
  padding-block: 9px 4px; /* first line centred on a 32px control; wrapped lines stay together */
  text-transform: uppercase;
}
.tabular label.nq-label-long { font-family: var(--nq-font-body); font-size: 12.5px; letter-spacing: 0; line-height: 1.35; padding-block-start: 7px; text-transform: none; }
.tabular label.floating, .tabular label.block, .tabular label.inline, label.no-css, .check_box_group label,
.tabular p > label:has(> input[type="checkbox"], > input[type="radio"]) {
  color: var(--nq-ink);
  font-family: var(--nq-font-body);
  font-size: 13.5px;
  letter-spacing: 0;
  line-height: 1.6;
  text-transform: none;
}
.tabular.settings p { padding-inline-start: 320px; font-size: 13.5px; }
.tabular.settings label { inline-size: 306px; margin-inline-start: -320px; }
.tabular label.error { color: var(--nq-danger-text); }
.tabular label.error + *:not(#issue_description_and_toolbar), .tabular label.error + span#issue_description_and_toolbar div.jstBlock { border-color: var(--nq-danger); }
span.required { color: var(--nq-danger-text); }
em.info { color: var(--nq-subtle); font-size: 12.5px; margin-block-start: 4px; }
.check_box_group { background: var(--nq-field); border-color: var(--nq-border-strong); border-radius: var(--nq-radius-sm); padding: 6px 10px; }
.check_box_group.bool_cf { background: transparent; }

fieldset {
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md);
  padding: 12px 16px;
}
legend {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  padding-inline: 6px;
  text-transform: uppercase;
}
/* Fieldsets inside a panel (role permissions, settings groups) are sections, not boxes in a box. */
.box fieldset:not(.box, .collapsible), fieldset.box fieldset:not(.collapsible) { border: 0; border-block-start: 1px solid var(--nq-border); border-radius: 0; margin-block-start: 8px; padding: 10px 0 4px; }
.box fieldset:not(.box, .collapsible) > legend { margin-inline-start: -6px; }
fieldset.collapsible { border-radius: 0; border-width: 1px 0 0; padding-inline: 0; }
fieldset.collapsible > legend { align-items: center; color: var(--nq-muted); display: inline-flex; gap: 2px; margin-inline-start: -6px; }
fieldset.collapsible > legend:hover { color: var(--nq-ink); }
fieldset.collapsible > legend svg { stroke: currentColor; }

/* ───────────────────────── Panels ───────────────────────── */

.box, fieldset.box, .mypage-box, div.issue.details, .filecontent.wiki, #projects-index ul.projects li.root, div#version-summary fieldset {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md);
  box-shadow: none;
  color: var(--nq-ink);
}
.box { line-height: 1.5; padding: 16px; }
.box.tabular { padding-inline-end: 16px; }
.box > h3:first-child, .mypage-box > h3:first-child, .box > h4:first-child { margin-block-start: 0; }
.mypage-box { padding: 16px; position: relative; }
/* Its hover actions float over the box, so they never narrow the table beside them. */
.mypage-box > .contextual { inset-block-start: 12px; inset-inline-end: 12px; margin: 0; position: absolute; }
.mypage-box table.list :is(th, td) { padding-inline: 8px; }
.mypage-box table.list td.subject { min-inline-size: 8em; }
.mypage-box h3 { font-size: 15px; }
.splitcontent { gap: 16px; overflow: visible; }
.splitcontentleft, .splitcontentright { margin: 0; min-inline-size: 0; }

/* Project overview boxes (.box with an h3 + icon). */
.box h3 { align-items: center; display: flex; gap: 6px; font-size: 15px; margin-block-end: 12px; }
.box h3 svg.icon-svg { color: var(--nq-subtle); }

/* ───────────────────────── Tables ───────────────────────── */

table.list, .table-list {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-collapse: separate;
  border-radius: var(--nq-radius-md);
  border-spacing: 0;
  font-size: 13.5px;
  margin-block-end: 12px;
  overflow: visible;
}
table.list th, .table-list-header {
  background: var(--nq-inset);
  border-block-end: 1px solid var(--nq-border);
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .06em;
  padding: 9px 10px;
  text-transform: uppercase;
}
table.list th a, table.list th a:link, table.list th a:visited { color: var(--nq-subtle); }
table.list th a:hover { color: var(--nq-ink); text-decoration: none; }
table.list > thead > tr:first-child > th:first-child { border-start-start-radius: calc(var(--nq-radius-md) - 1px); }
table.list > thead > tr:first-child > th:last-child { border-start-end-radius: calc(var(--nq-radius-md) - 1px); }
table.list > tbody > tr:last-child > td:first-child { border-end-start-radius: calc(var(--nq-radius-md) - 1px); }
table.list > tbody > tr:last-child > td:last-child { border-end-end-radius: calc(var(--nq-radius-md) - 1px); }
table.list td { border-block-start: 1px solid var(--nq-border); padding: 8px 10px; }
table.list > tbody > tr:first-child > td { border-block-start: 0; }
table.list thead + tbody > tr:first-child > td { border-block-start: 0; }
table.list:not(.odd-even) tbody tr:nth-child(odd), table.list:not(.odd-even) tbody tr:nth-child(even),
.odd, .even, .box table.list:not(.odd-even) tbody tr:nth-child(even), .box .even { background-color: transparent; }
table.list:not(.odd-even) tbody tr:nth-child(odd):hover, table.list:not(.odd-even) tbody tr:nth-child(even):hover,
.odd:hover, .even:hover { background-color: var(--nq-hover); }
table.list tbody tr.group:hover { background-color: transparent; }
tr.group td { background: var(--nq-card); border-block-end: 1px solid var(--nq-border); padding: 14px 10px 8px; }
tr.group span.name { font-weight: 600; }
tr.group span.count { background: var(--nq-inset); border: 1px solid var(--nq-border); color: var(--nq-muted); }
tr.group span.totals, tr.group a.toggle-all { color: var(--nq-subtle); }
table.list td.subject a, table.list td.name a, table.list td.issue a, table.list td.parent a { color: var(--nq-ink); font-weight: 500; }
table.list td.subject a:hover, table.list td.name a:hover { color: var(--nq-accent-text); }
table.list td.id a { color: var(--nq-subtle); font-family: var(--nq-font-mono); font-size: 12.5px; }
table.list tr.overdue:not(.context-menu-selection) td.due_date { color: var(--nq-danger-text); }
table.list td.buttons a, div.buttons a { color: var(--nq-muted); }
table.list td.buttons a:hover, div.buttons a:hover { color: var(--nq-ink); text-decoration: none; }
tr.project.closed, tr.project.archived, tr.project.closed a, tr.project.archived a,
tr.user.locked, tr.user.registered, tr.user.locked a, tr.user.registered a, tr.version.closed, tr.version.closed a { color: var(--nq-subtle); }
table.list caption { color: var(--nq-muted); }
table.list thead.related-issues th { background: transparent; }
th[role=columnheader]:not(.no-sort):after { border-color: var(--nq-subtle) transparent; }
tr.idnt :is(td.subject, td.name) { background-image: none; position: relative; }
tr.idnt :is(td.subject, td.name)::before {
  border-block-end: 1px solid var(--nq-border-strong);
  border-inline-start: 1px solid var(--nq-border-strong);
  border-end-start-radius: 4px;
  block-size: 8px;
  content: "";
  inline-size: 8px;
  inset-block-start: calc(50% - 8px);
  position: absolute;
}
tr.idnt-1 :is(td.subject, td.name)::before { inset-inline-start: 8px; }
tr.idnt-2 :is(td.subject, td.name)::before { inset-inline-start: 24px; }
tr.idnt-3 :is(td.subject, td.name)::before { inset-inline-start: 40px; }
tr.idnt-4 :is(td.subject, td.name)::before { inset-inline-start: 56px; }
tr.idnt-5 :is(td.subject, td.name)::before { inset-inline-start: 72px; }
table.issues td.block_column { color: var(--nq-muted); }
table#time-report tbody tr.total { background: var(--nq-inset); border-block-start-color: var(--nq-border); }
table.list tfoot tr.total, table.issue-report tr.total, table.issue-report-detailed tr.total { border: 0; }
table.list tfoot tr.total td { background: var(--nq-inset); border-block-start: 1px solid var(--nq-border); font-weight: 600; }
table.list tfoot tr.total td:first-child { text-align: start; }
table.list > tfoot > tr:last-child > td:first-child { border-end-start-radius: calc(var(--nq-radius-md) - 1px); }
table.list > tfoot > tr:last-child > td:last-child { border-end-end-radius: calc(var(--nq-radius-md) - 1px); }
table.list:has(> tfoot) > tbody > tr:last-child > td { border-radius: 0; }
table.list.enumerations { margin-block-end: 24px; }
table.transitions td.enabled { background: var(--nq-success-wash); }
table.fields_permissions td.readonly { background: var(--nq-selected); }
table.fields_permissions td.required { background: var(--nq-danger-wash); }
.query-totals { color: var(--nq-muted); }
/* div-based lists (project forums settings) share the table rhythm. */
.table-list .table-list-cell { padding: 8px 10px; vertical-align: middle; }
.table-list > .table-list-header { display: table-row; padding: 0; }
.table-list .table-list-header .table-list-cell { background: var(--nq-inset); border-block-end: 1px solid var(--nq-border); padding-block: 9px; }
.table-list .table-list-row .table-list-cell.name { padding-inline-start: 10px !important; }
.table-list > .table-list-row + .table-list-row .table-list-cell, .table-list > div:not(.table-list-header) .table-list-cell { border-block-start: 1px solid var(--nq-border); }

/* Selected rows (context menu). */
html .context-menu-selection, html .context-menu-selection:hover,
table.list tbody tr.context-menu-selection, table.list tbody tr.context-menu-selection:hover { background-color: var(--nq-accent-wash-strong) !important; color: var(--nq-ink) !important; }
html .context-menu-selection a, html .context-menu-selection a:hover, .context-menu-selection td.subject a,
html table.list tr.context-menu-selection a, html table.list tr.context-menu-selection a:hover { color: var(--nq-ink) !important; }
html table.list tr.context-menu-selection td.id a { color: var(--nq-muted) !important; }
.context-menu-selection svg.icon-svg { stroke: currentColor !important; }

/* ───────────────────────── Query form (filters, options) ───────────────────────── */

#query_form_content { font-size: 13.5px; }
#query_form_with_buttons > p.contextual, #query_form p.buttons { font-size: 13px; }
p.buttons a.icon, #query_form p.buttons a.icon {
  align-items: center;
  block-size: 30px;
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  box-sizing: border-box;
  color: var(--nq-ink);
  display: inline-flex;
  font-weight: 500;
  gap: 2px;
  padding: 0 10px;
}
p.buttons a.icon:hover { background: var(--nq-hover); border-color: var(--nq-subtle); text-decoration: none; }
#query_form p.buttons a.icon-checked { background: var(--nq-card); }
#filters-table .filter { align-items: center; margin-block: 6px 0; }
#filters-table .filter .field { align-items: center; display: inline-flex; gap: 2px; }
#filters-table .filter label { color: var(--nq-ink); }
#filters-table .filter .values { align-items: center; display: inline-flex; flex-wrap: wrap; gap: 6px; }
.add-filter label { color: var(--nq-muted); }

/* ───────────────────────── Badges ───────────────────────── */

.badge {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--nq-radius-pill);
  display: inline-flex;
  font-family: var(--nq-font-mono);
  font-size: 10.5px;
  font-weight: 500;
  inset-block-end: 3px;
  letter-spacing: .06em;
  line-height: 1.5;
  padding: 0 8px;
}
.badge-status-open { background: var(--nq-success-wash); border-color: color-mix(in srgb, var(--nq-success) 50%, transparent); color: var(--nq-success-text); }
.badge-status-closed { background: var(--nq-violet-wash); border-color: color-mix(in srgb, var(--nq-violet) 50%, transparent); color: var(--nq-violet-text); }
.badge-status-locked { background: var(--nq-inset); border-color: var(--nq-border-strong); color: var(--nq-muted); }
.badge-private { background: var(--nq-danger-wash); border-color: color-mix(in srgb, var(--nq-danger) 55%, transparent); color: var(--nq-danger-text); }
.badge-count { background: var(--nq-inset); border-color: var(--nq-border); color: var(--nq-muted); font-family: var(--nq-font-mono); inset-block-end: 0; }
.badge-issues-count { background: var(--nq-inset); border: 1px solid var(--nq-border); color: var(--nq-muted); }

/* ───────────────────────── Messages ───────────────────────── */

#errorExplanation, div.flash, .nodata, .warning, .conflict {
  border-radius: var(--nq-radius-md);
  font-size: 13.5px;
  padding: 12px 16px 12px 40px;
}
div.flash.notice { background: var(--nq-success-wash); border-color: color-mix(in srgb, var(--nq-success) 45%, transparent); color: var(--nq-ink); }
div.flash.notice svg.icon-svg { stroke: var(--nq-success); }
div.flash.error, #errorExplanation { background: var(--nq-danger-wash); border-color: color-mix(in srgb, var(--nq-danger) 45%, transparent); color: var(--nq-ink); }
div.flash.error svg.icon-svg, #errorExplanation svg.icon-svg { stroke: var(--nq-danger); }
div.flash.warning, .conflict { background: var(--nq-warning-wash); border-color: color-mix(in srgb, var(--nq-warning) 45%, transparent); color: var(--nq-ink); }
div.flash.warning svg.icon-svg, .conflict svg.icon-svg { stroke: var(--nq-warning); }
div.flash svg.icon-svg, #errorExplanation svg.icon-svg, .conflict svg.icon-svg { margin-inline: -26px 8px; }
/* "No data" is an empty state, not a warning. */
.nodata {
  background: transparent;
  border: 1px dashed var(--nq-border-strong);
  color: var(--nq-subtle);
  padding: 28px 16px;
  text-align: center;
}
.warning { background: var(--nq-warning-wash); border-color: color-mix(in srgb, var(--nq-warning) 45%, transparent); color: var(--nq-ink); padding-inline-start: 16px; }

.markdown-alert { border-radius: 0 var(--nq-radius-sm) var(--nq-radius-sm) 0; padding: 8px 14px; }
.markdown-alert > :last-child { margin-block-end: 0; }
.markdown-alert-note { background: var(--nq-accent-wash); border-color: var(--nq-accent-strong); }
.markdown-alert-note .markdown-alert-title { color: var(--nq-accent-text); }
.markdown-alert-note .markdown-alert-title svg { stroke: currentColor; }
.markdown-alert-tip { background: var(--nq-success-wash); border-color: var(--nq-success); }
.markdown-alert-tip .markdown-alert-title, .markdown-alert-tip .markdown-alert-title svg { color: var(--nq-success-text); stroke: currentColor; }
.markdown-alert-important { background: var(--nq-violet-wash); border-color: var(--nq-violet); }
.markdown-alert-important .markdown-alert-title, .markdown-alert-important .markdown-alert-title svg { color: var(--nq-violet-text); stroke: currentColor; }
.markdown-alert-warning, .markdown-alert-caution { background: var(--nq-warning-wash); border-color: var(--nq-warning); }
.markdown-alert-warning .markdown-alert-title, .markdown-alert-caution .markdown-alert-title,
.markdown-alert-warning .markdown-alert-title svg, .markdown-alert-caution .markdown-alert-title svg { color: var(--nq-warning-text); stroke: currentColor; }
.markdown-alert-caution { background: var(--nq-danger-wash); border-color: var(--nq-danger); }
.markdown-alert-caution .markdown-alert-title, .markdown-alert-caution .markdown-alert-title svg { color: var(--nq-danger-text); }

#ajax-indicator {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  color: var(--nq-ink);
  font-weight: 500;
  inline-size: auto;
  opacity: 1;
  padding: 10px 18px;
}

/* ───────────────────────── Tabs ───────────────────────── */

#content .tabs { block-size: 42px; margin-block-end: 20px; }
#content .tabs ul { border-block-end: 1px solid var(--nq-border); padding-inline-start: 0; }
#content .tabs ul li { margin-inline-end: 2px; }
#content .tabs ul li a {
  background: transparent;
  border: 0;
  border-radius: var(--nq-radius-sm) var(--nq-radius-sm) 0 0;
  color: var(--nq-muted);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.3;
  padding: 10px 12px 11px;
  position: relative;
}
#content .tabs ul li a:hover { color: var(--nq-ink); }
#content .tabs ul li a.selected, #content .tabs ul li a.selected:hover {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--nq-ink);
  font-weight: 600;
}
#content .tabs ul li a.selected::after {
  background: var(--nq-accent-strong);
  border-radius: 2px 2px 0 0;
  block-size: 2px;
  content: "";
  inset-block-end: 0;
  inset-inline: 10px;
  position: absolute;
}
div.tabs-buttons { background: var(--nq-canvas); border-block-end-color: var(--nq-border); block-size: 100%; inline-size: 64px; }
/* Tabs scrolled under the arrows fade out instead of showing through between them. */
div.tabs-buttons::before { background: linear-gradient(to right, transparent, var(--nq-canvas)); content: ""; inline-size: 24px; inset-block: 0; inset-inline-end: 100%; pointer-events: none; position: absolute; }
[dir="rtl"] div.tabs-buttons::before { background: linear-gradient(to left, transparent, var(--nq-canvas)); }
button.tab-left, button.tab-right { inset-block-end: 6px; }
button.tab-left, button.tab-right { background: var(--nq-card); border-color: var(--nq-border); }
button.tab-left:hover, button.tab-right:hover { background: var(--nq-hover); }
button.tab-left svg.icon-svg, button.tab-right svg.icon-svg { stroke: var(--nq-muted); }
button.tab-left.disabled, button.tab-right.disabled { background: var(--nq-inset); }
#main-menu .tabs-buttons { border: 0; }

/* ───────────────────────── Dropdowns and popovers ───────────────────────── */

.drdn-content, .dropdown-content, #context-menu ul, .ui-autocomplete, .ui-menu, .tribute-container ul {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  color: var(--nq-ink);
}
.drdn-content { inset-block-start: calc(100% + 4px); }
.contextual .drdn-content, .journal-actions .drdn-content { inset-block-start: calc(100% + 4px); }
.drdn-items > *, .contextual .drdn-items > a, .journal-actions .drdn-items > a, .journals .journal-actions .drdn-items > a { border: 0; border-radius: var(--nq-radius-sm); color: var(--nq-ink); padding: 7px 10px; }
.drdn-items { padding: 4px; }
div + .drdn-items { border-block-start-color: var(--nq-border); }
.drdn-items > a:hover, .contextual .drdn-items > a:hover, .journal-actions .drdn-items > a:hover {
  background: var(--nq-hover);
  border: 0;
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  text-decoration: none;
}
.drdn-items > *:focus { border: 0; outline: 2px solid var(--nq-ring); outline-offset: -2px; }
.drdn-items > span { color: var(--nq-subtle); }
.drdn-items.selection > *.selected { font-weight: 600; }
.contextual .drdn-items > a, .journal-actions .drdn-items > a { align-items: center; gap: 6px; padding: 7px 10px; }
.contextual .drdn-items, .journal-actions .drdn-items { padding: 4px; }
.drdn-content .quick-search { margin: 8px; }
.drdn-content .quick-search input.autocomplete { padding-inline-start: 32px !important; }
.drdn-content .autocomplete { block-size: var(--nq-control-h); }

#project-jump.drdn { inline-size: 220px; }
#project-jump .drdn-trigger {
  background: var(--nq-field) var(--nq-chevron) no-repeat calc(100% - 8px) 50%;
  block-size: var(--nq-control-h);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  font-size: 13.5px;
  line-height: 20px;
  padding: 5px 30px 5px 10px;
}
#project-jump .drdn-trigger:hover { border-color: var(--nq-subtle); }
#project-jump.drdn.expanded .drdn-trigger { background-image: var(--nq-chevron); border-color: var(--nq-accent-strong); box-shadow: var(--nq-focus-ring); }
#project-jump .drdn-content { inline-size: 300px; }
#project-jump .drdn-items > * { color: var(--nq-ink) !important; }
#project-jump .drdn-items > a:hover { background: var(--nq-hover); color: var(--nq-ink) !important; }

html .dropdown-content { margin-block-start: 6px; padding: 4px; }
html .dropdown-content li a, html .dropdown-content .dropdown-items a { border-radius: var(--nq-radius-sm); color: var(--nq-ink); padding: 8px 12px; }
html .dropdown-content li a:hover, html .dropdown-content .dropdown-items a:hover { background: var(--nq-hover); color: var(--nq-ink); }
html .dropdown-divider { border-block-start-color: var(--nq-border); margin-block: 4px; }

html #context-menu ul {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  padding: 4px;
}
html #context-menu { z-index: 1010; }
html #context-menu li { border: 0; border-radius: var(--nq-radius-sm); padding: 0; }
html #context-menu li:hover { background: var(--nq-hover); border: 0; border-radius: var(--nq-radius-sm); }
html #context-menu a { align-items: center; border-radius: var(--nq-radius-sm); color: var(--nq-ink); display: flex; gap: 4px; padding: 6px 10px; }
html #context-menu a:hover { color: var(--nq-ink); }
html #context-menu a.disabled, html #context-menu a.disabled:hover { color: var(--nq-faint); }
html #context-menu li.folder ul { inset-block-start: -5px; }
html #context-menu li a.submenu { padding-inline-start: 30px; }
html #context-menu li.folder ul li a:not(.icon) { padding-inline-start: 30px; }

.tooltip span.tip a { color: var(--nq-accent-text) !important; }
div.tooltip:hover span.tip {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  color: var(--nq-muted);
  font-size: 12.5px;
  padding: 10px 12px;
}
.tooltip:hover { color: inherit; }
.ui-tooltip, .ui-widget.ui-tooltip {
  background: var(--nq-ink);
  border: 0;
  border-radius: var(--nq-radius-sm);
  box-shadow: none;
  color: var(--nq-canvas);
  font: 500 12px/1.4 var(--nq-font-body);
  padding: 6px 9px;
}

/* jQuery UI widgets */
.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: var(--nq-font-body); font-size: 13.5px; }
.ui-widget-content { background: var(--nq-raised); border-color: var(--nq-border-strong); color: var(--nq-ink); }
.ui-widget-content a { color: var(--nq-accent-text); }
.ui-widget-header { background: transparent; border: 0; color: var(--nq-ink); font-weight: 600; }
.ui-autocomplete, .ui-menu { padding: 4px; }
.ui-menu .ui-menu-item-wrapper, .ui-autocomplete .ui-menu-item > div { border: 0; border-radius: var(--nq-radius-sm); padding: 7px 10px; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active,
.ui-menu .ui-state-active, .ui-state-hover, .ui-widget-content .ui-state-hover {
  background: var(--nq-hover);
  border: 0;
  color: var(--nq-ink);
  margin: 0;
}
.ui-widget-overlay { background: var(--nq-backdrop); opacity: 1; }
.ui-dialog {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-lg);
  box-shadow: var(--nq-shadow-dialog);
  padding: 0;
}
.ui-dialog .ui-dialog-titlebar {
  border-block-end: 1px solid var(--nq-border);
  border-radius: 0;
  padding: 14px 18px;
}
.ui-dialog .ui-dialog-title { font-family: var(--nq-font-head); font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.ui-dialog .ui-dialog-titlebar-close {
  background: transparent;
  block-size: 28px;
  border: 0;
  border-radius: var(--nq-radius-sm);
  inline-size: 28px;
  inset-inline-end: 12px;
  margin-block-start: -14px;
}
.ui-dialog .ui-dialog-titlebar-close:hover { background: var(--nq-hover); }
.ui-dialog .ui-dialog-content { color: var(--nq-ink); padding: 16px 18px; }
/* Dialog forms: the submit is the primary action, Cancel a quiet button. */
.ui-dialog :is(p.buttons, .buttons) > input[type="submit"]:first-of-type {
  background: var(--nq-primary);
  border-color: var(--nq-extrude);
  box-shadow: var(--nq-shadow-raised);
  color: var(--nq-primary-ink);
  font-weight: 600;
}
.ui-dialog :is(p.buttons, .buttons) > input[type="submit"]:first-of-type:hover { box-shadow: var(--nq-shadow-raised-hover); transform: translate(-1px, -1px); }
.ui-dialog :is(p.buttons, .buttons) > a:not(.icon) {
  align-items: center;
  font-size: 13.5px;
  block-size: var(--nq-control-h);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  box-sizing: border-box;
  color: var(--nq-ink);
  display: inline-flex;
  font-weight: 500;
  margin-inline-start: 6px;
  padding: 0 14px;
  vertical-align: middle;
}
.ui-dialog :is(p.buttons, .buttons) > a:not(.icon):hover { background: var(--nq-hover); border-color: var(--nq-subtle); text-decoration: none; }
.ui-dialog .ui-dialog-buttonpane { background: transparent; border-block-start: 1px solid var(--nq-border); margin: 0; padding: 12px 18px; }
.ui-icon, .ui-widget-content .ui-icon, .ui-widget-header .ui-icon { filter: none; }
:root[data-nq-scheme="dark"] .ui-icon { filter: invert(1) brightness(1.4); }
div.modal:not(.ui-dialog) { background: transparent; border-radius: 0; padding: 0; }
div.modal .box { background: transparent; border: 0; padding: 0; }
div.modal p.buttons { margin-block-start: 16px; }
.ui-progressbar { background: var(--nq-inset); border: 1px solid var(--nq-border); border-radius: var(--nq-radius-pill); overflow: hidden; }
.ui-progressbar .ui-progressbar-value { background: var(--nq-accent-strong); border: 0; }
.tribute-container li { color: var(--nq-ink); padding: 6px 10px; }
.tribute-container li.highlight { background: var(--nq-hover); color: var(--nq-ink); }

/* ───────────────────────── Issue page ───────────────────────── */

div.issue.details {
  background: var(--nq-card);
  border-radius: var(--nq-radius-md);
  margin-block-end: 20px;
  padding: 20px 24px 20px 28px;
  position: relative;
}
/* State stripe: an inset pill, so the rounded corner never bends it. */
div.issue.details::before {
  background: var(--nq-state, var(--nq-success));
  border-radius: 2px;
  content: "";
  inline-size: 3px;
  inset-block: 14px;
  inset-inline-start: 10px;
  position: absolute;
}
div.issue.details.closed { --nq-state: var(--nq-violet); }
#content > h2.inline-block { margin-block-end: 14px; }
#content > h2.inline-block + .badge { inset-block-end: 4px; margin-inline-start: 8px; }
div.issue div.subject h3 {
  font-family: var(--nq-font-head);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.3;
}
div.issue div.subject p, div.issue p.author { color: var(--nq-subtle); font-size: 13px; }
div.issue p.author a { color: var(--nq-muted); }
div.issue .next-prev-links { color: var(--nq-subtle); font-size: 12.5px; }
div.issue .attributes { border-block-start: 1px solid var(--nq-border); margin-block-start: 18px; padding-block-start: 14px; }
div.issue .attributes .attribute { min-block-size: 30px; padding-inline-start: 170px; }
div.issue .attributes .attribute .label {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  inline-size: 160px;
  letter-spacing: .06em;
  line-height: 22px;
  margin-inline-start: -170px;
  text-transform: uppercase;
}
div.issue .attribute .value { line-height: 22px; }
div.issue.overdue .due-date .value { color: var(--nq-danger-text); }
div.issue.details > hr { background: var(--nq-border); margin-block: 18px; }
div.issue .description > p strong, div.issue p > strong:only-child { font-weight: 600; }
div.issue .description > .contextual { margin: 0; }
div.issue .description > p > strong, #issue_tree > p > strong, #relations > p > strong {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}
div.issue .avatar { border-radius: var(--nq-radius-md); }
div#sticky-issue-header {
  background: var(--nq-chrome);
  border-block-end: 1px solid var(--nq-border);
  box-shadow: 0 8px 24px -12px var(--nq-depth);
  color: var(--nq-ink);
  font-size: 13.5px;
  padding: 12px max(var(--nq-gutter), calc((100% - var(--nq-sheet)) / 2 + var(--nq-gutter)));
}
#issue_tree table.issues, #relations table.issues { background: transparent; border: 0; border-radius: 0; }
#issue_tree table.issues td, #relations table.issues td { border: 0; padding-block: 5px; }

/* Progress bars (issue % done, roadmap). */
table.progress { border-radius: var(--nq-radius-pill); border-spacing: 0; overflow: hidden; }
table.progress td { block-size: 8px; padding: 0; }
table.progress td.closed { background: var(--nq-success); }
table.progress td.done { background: color-mix(in srgb, var(--nq-success) 50%, var(--nq-card)); }
table.progress td.todo { background: var(--nq-selected); }
p.percent, p.progress-info { color: var(--nq-subtle); }
.version-overview table.progress td { block-size: 10px; }

/* Attachments and thumbnails. */
div.attachments { color: var(--nq-ink); }
div.attachments span.author, .attachments .size { color: var(--nq-subtle); }
div.thumbnail { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: var(--nq-radius-md); overflow: hidden; }
div.thumbnail img { margin: 0; }

/* History (journals): one hairline card per change. */
#history h3 { margin-block: 28px 14px; }
.journals > div.journal { margin-block-end: 12px; }
.journals h4.journal-header {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md) var(--nq-radius-md) 0 0;
  font-size: 13.5px;
  font-weight: 400;
  margin: 0;
  padding: 8px 12px;
}
.journals h4.journal-header .update-info { color: var(--nq-subtle); font-size: 12.5px; }
.journals h4.journal-header .update-info a { color: var(--nq-muted); }
.journals h4.journal-header .update-info a.user { color: var(--nq-ink); font-weight: 600; }
.journals div:target h4.journal-header { background: var(--nq-accent-wash); border-color: var(--nq-accent-strong); }
.journals .journal-content {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-block-start: 0;
  border-radius: 0 0 var(--nq-radius-md) var(--nq-radius-md);
  margin-block-end: 0;
  padding: 10px 14px;
}
.journals .journal-content > :first-child { margin-block-start: 0; }
.journals .journal-content > :last-child { margin-block-end: 0; }
.journals .journal-details, ul.revision-info { color: var(--nq-muted); font-size: 13px; margin-block: 0 8px; padding-inline-start: 18px; }
.journals .journal-details li::marker { color: var(--nq-faint); }
.journals .journal-details a, ul.revision-info a { color: var(--nq-accent-text); }
.journals .journal-details a:hover, ul.revision-info a:hover { color: var(--nq-accent-text); }
.journals .journal-content .wiki { margin-inline-start: 0; }
.journals .private-notes { border-inline-start: 0; box-shadow: none; }
.journals .private-notes > :is(h4.journal-header, .journal-content) { box-shadow: inset 3px 0 0 var(--nq-danger); }
.journals .journal-meta .journal-link { color: var(--nq-subtle); font-family: var(--nq-font-mono); font-size: 12px; }
.journals .journal-actions a { color: var(--nq-subtle); }
.journals .journal-actions a:hover { color: var(--nq-ink); }
.journals h4.journal-header .avatar { border-radius: var(--nq-radius-sm); }

/* ───────────────────────── Avatars ───────────────────────── */

.avatar { border-radius: var(--nq-radius-sm); }
span[role="img"].avatar { font-family: var(--nq-font-body); font-weight: 600; letter-spacing: -.02em; }
.avatar-color-0 { background: color-mix(in srgb, var(--nq-danger) 22%, var(--nq-card)); color: var(--nq-danger-text); }
.avatar-color-1 { background: color-mix(in srgb, var(--nq-warning) 22%, var(--nq-card)); color: var(--nq-warning-text); }
.avatar-color-2 { background: color-mix(in srgb, var(--nq-warning) 30%, var(--nq-card)); color: var(--nq-warning-text); }
.avatar-color-3 { background: color-mix(in srgb, var(--nq-success) 22%, var(--nq-card)); color: var(--nq-success-text); }
.avatar-color-4 { background: color-mix(in srgb, var(--nq-accent-strong) 22%, var(--nq-card)); color: var(--nq-accent-text); }
.avatar-color-5 { background: color-mix(in srgb, var(--nq-accent-text) 18%, var(--nq-card)); color: var(--nq-accent-text); }
.avatar-color-6 { background: color-mix(in srgb, var(--nq-violet) 22%, var(--nq-card)); color: var(--nq-violet-text); }
.avatar-color-7 { background: color-mix(in srgb, var(--nq-violet) 14%, var(--nq-danger-wash)); color: var(--nq-danger-text); }
div.avatar-with-child > .avatar:nth-child(2) { border-color: var(--nq-card); }

/* ───────────────────────── Wiki content ───────────────────────── */

div.wiki { color: var(--nq-ink); line-height: 1.6; }
div.wiki h1, div.wiki h2, div.wiki h3 { font-family: var(--nq-font-head); letter-spacing: -.02em; }
div.wiki h1 { font-size: 26px; font-weight: 600; margin-block: 0 16px; }
div.wiki h2 { border-block-end: 1px solid var(--nq-border); font-size: 20px; font-weight: 600; margin-block: 28px 12px; padding-block-end: 6px; }
div.wiki h3 { font-size: 16px; margin-block: 22px 8px; }
div.wiki h4 { font-size: 14px; }
div.wiki p { line-height: 1.65; }
div.wiki a.new { color: var(--nq-danger-text); }
div.wiki .external { background-image: none; padding-inline-start: 0; }
div.wiki .external::after { content: "↗"; font-size: .85em; margin-inline-start: 2px; opacity: .7; }
div.wiki table { padding: 0; border-collapse: separate; border-spacing: 0; border: 1px solid var(--nq-border); border-radius: var(--nq-radius-md); overflow: hidden; }
div.wiki table td, div.wiki table th { border: 0; border-block-start: 1px solid var(--nq-border); border-inline-start: 1px solid var(--nq-border); padding: 7px 12px; }
div.wiki table tr:first-child > :is(td, th) { border-block-start: 0; }
div.wiki table tr > :is(td, th):first-child { border-inline-start: 0; }
div.wiki table th { background: var(--nq-inset); color: var(--nq-muted); font-weight: 600; text-align: start; }
div.wiki .wiki-class-noborder, div.wiki .wiki-class-noborder td, div.wiki .wiki-class-noborder th { border: 0; }
div.wiki pre {
  background: var(--nq-code-bg);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md);
  font-size: 12.5px;
  line-height: 1.55;
  margin-inline: 0;
  padding: 12px 14px;
}
div.wiki pre .syntaxhl { background: transparent; }
div.wiki *:not(pre) > code, div.wiki > code {
  background: var(--nq-inset);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-xs);
  font-size: .88em;
  padding: .08em .35em;
}
div.wiki blockquote, blockquote { border-inline-start: 3px solid var(--nq-border-strong); color: var(--nq-muted); font-style: normal; padding-inline-start: 14px; }
div.pre-wrapper a.copy-pre-content-link { background: var(--nq-raised); border-color: var(--nq-border-strong); border-radius: var(--nq-radius-sm); inset-inline-end: 6px; inset-block-start: 6px; padding: 3px 5px; }
div.wiki ul.toc {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md);
  padding: 12px 16px;
}
div.wiki ul.toc > li:first-child {
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
div.wiki ul.toc a { color: var(--nq-muted); }
div.wiki ul.toc a:hover { color: var(--nq-accent-text); }
div.wiki a:target + :is(h1, h2, h3, h4, h5, h6) { background: var(--nq-accent-wash); border-radius: var(--nq-radius-xs); }
a.wiki-anchor, h1:hover a.wiki-anchor, h2:hover a.wiki-anchor, h3:hover a.wiki-anchor, h4:hover a.wiki-anchor { color: var(--nq-subtle); }
a.wiki-anchor:hover { color: var(--nq-accent-text) !important; }
div.wiki img { border-radius: var(--nq-radius-sm); }
.wiki-update-info { color: var(--nq-subtle); font-size: 12.5px; }
div.wiki-page .contextual a { opacity: 1; }
div.wiki .task-list-item-checkbox { vertical-align: -2px; }
.highlight { background: var(--nq-warning-wash); border-radius: 2px; }
.highlight.token-1 { background: var(--nq-danger-wash); }
.highlight.token-2 { background: var(--nq-success-wash); }
.highlight.token-3 { background: var(--nq-violet-wash); }

/* Editor toolbar and preview. */
html .jstElements button {
  background-color: transparent;
  background-size: 16px;
  border: 1px solid transparent;
  border-radius: var(--nq-radius-xs);
  block-size: 28px;
  inline-size: 28px;
  margin-inline-end: 0;
  opacity: .75;
}
html .jstElements button:hover { background-color: var(--nq-hover); border-color: var(--nq-border); opacity: 1; }
:root[data-nq-scheme="dark"] .jstElements button[class*="jstb_"]:not(.jstb_pre) { filter: invert(1) hue-rotate(180deg); }
html .jstElements button.jstb_pre::before { color: var(--nq-muted); font-family: var(--nq-font-mono); }
:root[data-nq-scheme="dark"] .jstElements button[class*="jstb_"]:hover { background-color: color-mix(in srgb, #fff 88%, transparent); border-color: #c8ccd4; }
.jstb_pre::before { color: var(--nq-ink); }
.jstElements .help a { color: var(--nq-muted); }
html .wiki-preview { background: var(--nq-card); border: 1px solid var(--nq-border-strong); border-radius: var(--nq-radius-sm); color: var(--nq-ink); padding: 10px 12px; }
html .wiki-preview p.empty-preview { color: var(--nq-subtle); }
html .table-generator td { background: var(--nq-card); border-color: var(--nq-border-strong); }
html .table-generator td.selected-cell, html .table-generator td:hover { background: var(--nq-accent-wash-strong); }
#content .jstTabs.tabs { block-size: 42px; margin-block-end: 0; }
#content .jstTabs.tabs li { block-size: 42px; }
#content .jstTabs.tabs ul { border-block-end: 0; }

/* ───────────────────────── Code and syntax (Rouge) ───────────────────────── */

.syntaxhl { background: transparent; color: var(--nq-ink); }
.syntaxhl :is(.c, .ch, .cm, .c1, .cpf, .go, .w) { color: var(--nq-subtle); font-style: italic; }
.syntaxhl :is(.k, .kc, .kd, .kn, .kp, .kr, .ow) { color: var(--nq-violet-text); font-weight: 600; }
.syntaxhl :is(.kt, .nc, .no, .nn) { color: var(--nq-accent-text); font-weight: 600; }
.syntaxhl :is(.s, .sa, .sb, .dl, .s2, .sh, .s1, .sx, .sr, .se, .si) { background: transparent; color: var(--nq-success-text); }
.syntaxhl :is(.m, .mb, .mf, .mh, .mi, .mo, .il, .ss) { color: var(--nq-warning-text); font-weight: 400; }
.syntaxhl :is(.nf, .fm, .na, .nt, .nb, .bp) { color: var(--nq-accent-text); font-weight: 400; }
.syntaxhl :is(.nv, .vc, .vg, .vi, .vm, .nd, .nl, .ni) { color: var(--nq-danger-text); font-weight: 400; }
.syntaxhl :is(.o, .p) { color: var(--nq-muted); }
.syntaxhl :is(.cp, .cs, .gh, .gu, .gp) { color: var(--nq-muted); font-weight: 600; }
.syntaxhl :is(.err, .gr, .ne) { background: transparent; color: var(--nq-danger-text); }
.syntaxhl .gd { color: var(--nq-danger-text); }
.syntaxhl .gi { color: var(--nq-success-text); }
.syntaxhl .hll { background: var(--nq-warning-wash); }

/* Repository file view and diffs. */
table.filecontent {
  background: var(--nq-code-bg);
  border: 1px solid var(--nq-border);
  border-collapse: separate;
  border-radius: var(--nq-radius-md);
  border-spacing: 0;
  inline-size: 100%;
  overflow: hidden;
}
html table.filecontent tbody, html table.filecontent :is(td.line-code pre, td.line-code div, th.line-num, td.revision, td.author) { font-family: var(--nq-font-mono); font-size: 12.5px; }
table.filecontent th { background: var(--nq-inset); border: 0; border-block-end: 1px solid var(--nq-border); }
table.filecontent th.filename { background: var(--nq-card); color: var(--nq-ink); font-family: var(--nq-font-mono); font-size: 12.5px; font-weight: 600; padding: 10px 14px; }
html table.filecontent th.line-num { background: var(--nq-code-bg); border: 0 !important; border-inline-end: 1px solid var(--nq-border) !important; color: var(--nq-subtle); font-weight: 400; }
table.filecontent th.line-num a { color: var(--nq-subtle); }
table.filecontent td.line-code { border: 0; }
table.filecontent tr.spacing td { background: var(--nq-accent-wash); }
table.filecontent tr:target th.line-num { background: var(--nq-accent-wash-strong); color: var(--nq-ink); }
table.filecontent tr:target td.line-code { background: var(--nq-accent-wash); }
.diff_out { background: var(--nq-diff-del); }
.diff_out span { background: var(--nq-diff-del-word); }
.diff_in { background: var(--nq-diff-add); }
.diff_in span { background: var(--nq-diff-add-word); }
.text-diff { background: var(--nq-code-bg); border-color: var(--nq-border); border-radius: var(--nq-radius-md); color: var(--nq-ink); font-family: var(--nq-font-mono); font-size: 12.5px; }
table.annotate td.line-code { background: var(--nq-code-bg); border-inline-start-color: var(--nq-border); }
table.annotate tr.bloc-change { border-block-start-color: var(--nq-border); }
li.change { color: var(--nq-ink); }
li.change .copied-from { color: var(--nq-subtle); }
li.change.change-A svg.icon-svg { stroke: var(--nq-success); }
li.change.change-M svg.icon-svg { stroke: var(--nq-warning); }
li.change.change-D svg.icon-svg { stroke: var(--nq-danger); }
li.change.change-C svg.icon-svg, li.change.change-R svg.icon-svg { stroke: var(--nq-violet); }
table.entries td.filename a, table.entries a { color: var(--nq-ink); }
table.entries a:hover { color: var(--nq-accent-text); }
table.entries td.revision a, tr.changeset td.id a { font-family: var(--nq-font-mono); font-size: 12.5px; }

/* ───────────────────────── Projects, activity, search ───────────────────────── */

#projects-index ul.projects li.root { padding: 18px 20px; }
#projects-index ul.projects div.root a.project { color: var(--nq-ink); font-family: var(--nq-font-head); font-size: 17px; font-weight: 600; letter-spacing: -.02em; }
#projects-index ul.projects div.root a.project:hover { color: var(--nq-accent-text); }
#projects-index li.root ul.projects { border-inline-start: 2px solid var(--nq-border); }
#projects-index ul.projects div.description { color: var(--nq-muted); }
ul.projects li.root div.archived, ul.projects li.child div.archived { color: var(--nq-subtle); }

div#activity h3, #search-results-counts + h3 {
  background: transparent;
  border-block-end: 1px solid var(--nq-border);
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  margin-block: 24px 4px;
  padding: 0 0 8px;
  text-transform: uppercase;
}
div#activity dl, #search-results { margin-inline-start: 0; }
div#activity dt { border-block-start-color: var(--nq-border); gap: 8px; padding-block-start: 12px; }
div#activity dt .time { color: var(--nq-subtle); font-family: var(--nq-font-mono); font-size: 12px; }
div#activity dt svg.icon-svg { color: var(--nq-subtle); }
div#activity dd, #search-results dd { color: var(--nq-muted); padding-inline-start: 32px; }
div#activity dd span.description, #search-results dd span.description { color: var(--nq-muted); font-style: normal; }
div#activity dd .author { color: var(--nq-subtle); }
#search-results dt { margin-block-start: 12px; }

/* Roadmap and versions. */
div#roadmap article.version-article { border-block-start: 1px solid var(--nq-border); margin-block-start: 16px; padding-block-start: 20px; }
div#roadmap article.version-article:first-of-type { border: 0; margin: 0; padding: 0; }
div#roadmap .version-article > header h3 { font-size: 18px; }
div#roadmap header:target { background: var(--nq-accent-wash); border-radius: var(--nq-radius-sm); }
div#roadmap .related-issues { background: transparent; }
div#version-summary { background: transparent; }
div#version-summary .total-hours, div#version-summary .total-hours a { color: var(--nq-ink); font-family: var(--nq-font-mono); font-size: 13px; font-weight: 500; }
div#version-summary th { color: var(--nq-muted); font-weight: 500; }
div#version-summary fieldset { padding: 12px 16px; }

/* Documents, news, forums. */
#document-list .document-group h3 {
  background: transparent;
  border-block-end: 1px solid var(--nq-border);
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  letter-spacing: .08em;
  padding: 0 0 8px;
  text-transform: uppercase;
}
#document-list .document-item h4.title { font-size: 15px; font-weight: 600; }
#document-list .document-item .updated_on { color: var(--nq-subtle); }
#news-list article.news-article { border-block-start: 1px solid var(--nq-border); margin-block-start: 16px; padding-block-start: 16px; }
#news-list article.news-article:first-of-type { border: 0; margin: 0; padding: 0; }
#news-list article.news-article header p.author, p.author { color: var(--nq-subtle); }
div.message, div.news { color: var(--nq-ink); }
tr.message.sticky td.subject { font-weight: 600; }

/* ───────────────────────── Calendar ───────────────────────── */

ul.cal { background: var(--nq-card); border-color: var(--nq-border); border-radius: var(--nq-radius-md); box-shadow: none; overflow: hidden; }
.cal .calhead, .cal .week-number {
  background: var(--nq-inset);
  color: var(--nq-subtle);
  font-family: var(--nq-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .06em;
  padding: 8px 4px;
  text-transform: uppercase;
}
.cal .calbody { border-color: var(--nq-border); box-shadow: none; padding: 4px 6px; }
.cal .calbody.this-month { background: var(--nq-card); }
.cal .calbody.other-month, .cal .calbody.nwday:not(.other-month) { background: var(--nq-hover); }
.cal .calbody.other-month p.day-num { color: var(--nq-subtle); }
.cal .calbody p.day-num { color: var(--nq-muted); font-size: 12.5px; }
.cal .calbody.today .day-value { color: var(--nq-primary-ink); }
.cal .calbody.today .day-value::before { background: var(--nq-primary); }
.cal .calbody div.issue {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-muted);
  font-size: 12px;
  line-height: 1.35;
  margin-block: 4px;
  padding: 4px 6px;
}
.cal .calbody div.issue a { font-weight: 500; }
.cal .calbody div.issue svg.icon-svg { color: var(--nq-subtle); }

/* ───────────────────────── Gantt ───────────────────────── */

html .gantt_hdr { border-color: var(--nq-border); }
html #gantt_area .gantt_hdr { border-inline-end-color: var(--nq-border); }
html .gantt_hdr.nwday { background: var(--nq-hover); color: var(--nq-subtle); }
html .gantt_subjects div.issue-subject:hover { background: var(--nq-hover); }
html .task { color: var(--nq-muted); }
html .task_late { background: var(--nq-danger); border-color: var(--nq-danger); }
html .task_done { background: var(--nq-success); border-color: var(--nq-success); }
html .task_todo { background: var(--nq-border-strong); border-color: var(--nq-border-strong); }
html .task_todo.parent { background: var(--nq-subtle); border-color: var(--nq-subtle); }
html :is(.version, .project).task_late { background: var(--nq-danger); border-color: var(--nq-danger); }
html :is(.version, .project).task_done { background: var(--nq-success); border-color: var(--nq-success); }
html :is(.version, .project).task_todo { background: var(--nq-card); border-color: var(--nq-border-strong); }
html .issue-behind-schedule a { color: var(--nq-warning-text); }
html .project-overdue a { color: var(--nq-danger-text); }
#gantt_area { border-color: var(--nq-border); }
html .gantt_hdr[style*="background"] { background: var(--nq-inset) !important; }
html .gantt_hdr a { color: var(--nq-muted); }
#today_line { border-inline-start-color: var(--nq-accent-strong) !important; }
div#gantt_area .context-menu-selection { background-color: var(--nq-accent-wash-strong) !important; }
html div#gantt_area .context-menu-selection a { color: var(--nq-ink) !important; }
html div#gantt_area .context-menu-selection, html div#gantt_area .context-menu-selection:hover { background-color: var(--nq-accent-wash-strong) !important; }

/* ───────────────────────── Pagination ───────────────────────── */

span.pagination { color: var(--nq-subtle); }
.pagination ul.pages { display: inline-flex; gap: 4px; }
.pagination ul.pages li, .pagination ul.pages li:first-child, .pagination ul.pages li:last-child {
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-sm);
  line-height: 28px;
  min-inline-size: 30px;
}
.pagination ul.pages li a, .pagination ul.pages li span { display: block; padding: 0 10px; }
.pagination ul.pages li.page a { color: var(--nq-ink); }
.pagination ul.pages li.page:hover { background: var(--nq-hover); border-color: var(--nq-border-strong); }
.pagination ul.pages li.current { background: var(--nq-ink); border-color: var(--nq-ink); color: var(--nq-canvas); font-weight: 600; }
.pagination ul.pages li.previous, .pagination ul.pages li.next { color: var(--nq-subtle); }
.pagination .per-page span.selected { color: var(--nq-ink); font-weight: 600; }
p.other-formats { color: var(--nq-subtle); font-size: 12.5px; }

/* ───────────────────────── Sign-in ───────────────────────── */

#login-form {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-lg);
  box-shadow: 6px 6px 0 var(--nq-border);
  inline-size: 380px;
  margin-block: 72px 48px;
  padding: 28px;
}
#login-form h3 { font-size: 20px; margin-block: 0 20px; }
#login-form label { color: var(--nq-muted); font-family: var(--nq-font-mono); font-size: 11px; font-weight: 500; letter-spacing: .06em; margin-block-end: 6px; text-transform: uppercase; }
#login-form label[for=autologin] { align-items: center; color: var(--nq-ink); display: inline-flex; font-family: var(--nq-font-body); font-size: 13.5px; gap: 4px; letter-spacing: 0; text-transform: none; }
#login-form input { block-size: var(--nq-control-h-lg); }
#login-form input[type="checkbox"] { block-size: 16px; }
#login-form input[type="text"], #login-form input[type="password"] { margin-block-end: 18px; }
#login-form input[type="submit"] { margin-block-start: 16px; }
#login-form a.lost_password { font-family: var(--nq-font-body); font-size: 12.5px; letter-spacing: 0; text-transform: none; }

/* ───────────────────────── Misc ───────────────────────── */

.other-formats a, .wiki-update-info a { color: var(--nq-muted); }
abbr[title], span.field-description[title] { border-block-end-color: var(--nq-faint); }
.sample-data, .sample-data td { background: var(--nq-card); border-color: var(--nq-border); }
.block-receiver { border-color: transparent; }
.dragging .block-receiver { border-color: var(--nq-border-strong); border-radius: var(--nq-radius-md); }
div.fileover, p.custom-field-filedroplistner.fileover { background: var(--nq-accent-wash); }
.attachments_fields input.filename, #existing-attachments .filename { color: var(--nq-ink); }
ul.properties { color: var(--nq-subtle); }
.total-hours { color: var(--nq-ink); }
#trackers_description dt, #issue_statuses_description dt { text-decoration: none; }
.reaction-button.readonly .icon-svg, .reaction-button.readonly .icon-label { color: var(--nq-subtle); stroke: var(--nq-subtle); }
tr.ui-sortable-helper { background: var(--nq-raised); border-color: var(--nq-border-strong); }
#progress-label { color: var(--nq-ink); text-shadow: none; }
img.filecontent.image { background-color: var(--nq-card); border-radius: var(--nq-radius-sm); }
.api-key-actions .copy-api-key-link { border-radius: var(--nq-radius-sm); }

/* Account and user forms in two columns: every field takes the column width, so they line up. */
:is(#my_account_form, #user_form) .splitcontent .tabular p > :is(input:not([type="checkbox"], [type="radio"], [type="file"]), select, textarea) { inline-size: 100% !important; max-inline-size: 100%; }
:is(#my_account_form, #user_form) .splitcontent .tabular p { padding-inline-end: 0; }

/* ───────────────────────── Phone and tablet (Redmine's responsive layout, < 900px) ───────────────────────── */

@media screen and (max-width: 899px) {
  html #header {
    background: var(--nq-chrome);
    border-block-end: 1px solid var(--nq-border);
    block-size: 60px;
    padding: 0;
  }
  html #header::before { display: none; }
  html #header a.mobile-toggle-button {
    block-size: 60px;
    border-inline-start: 1px solid var(--nq-border);
    color: var(--nq-ink);
    font-size: 30px;
    inline-size: 56px;
    line-height: 60px;
  }
  html #header a.mobile-toggle-button:hover { background: var(--nq-hover); }
  html #project-jump.drdn { block-size: 60px; padding: 10px 68px 10px 12px; }
  html #project-jump .drdn-trigger {
    background: transparent;
    block-size: 40px;
    border: 0;
    box-shadow: none;
    color: var(--nq-ink);
    font-family: var(--nq-font-head);
    font-size: 19px;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 40px;
    padding: 0 0 0 26px;
  }
  html #project-jump .drdn-trigger::before {
    background: var(--nq-chevron) no-repeat center / 18px;
    content: "";
    font-size: 0;
    inline-size: 18px;
    inset-block: 0;
    inset-inline-start: 2px;
    opacity: 1;
    padding: 0;
    transform: none;
  }
  html #project-jump.expanded .drdn-trigger::before { padding: 0; transform: rotate(180deg); }
  html #project-jump .drdn-content { border-radius: 0 0 var(--nq-radius-md) var(--nq-radius-md); inset-block-start: 60px; }
  html #main { padding-block-start: 60px; }
  html #content, html #main.nosidebar #content { padding: 20px 16px 28px; }

  /* Flyout menu: the app chrome, not Redmine's blue. */
  html .flyout-menu { background: var(--nq-chrome); border-inline-start: 1px solid var(--nq-border); color: var(--nq-ink); }
  html .flyout-menu h3 {
    background: var(--nq-inset);
    border-block: 1px solid var(--nq-border);
    color: var(--nq-subtle);
    font-family: var(--nq-font-mono);
    font-weight: 500;
    letter-spacing: .08em;
    line-height: 26px;
    block-size: 28px;
  }
  html .flyout-menu h4 { color: var(--nq-ink); }
  html .flyout-menu a, html .flyout-menu__avatar a { color: var(--nq-ink); }
  html .flyout-menu ul li a, html .flyout-menu__avatar, html .flyout-menu__sidebar form > ul li,
  html .flyout-menu #watchers ul li, html .flyout-menu ul.queries li { border-block-start-color: var(--nq-border); }
  html .flyout-menu ul li a:hover { background: var(--nq-hover); text-decoration: none; }
  html .flyout-menu ul li a.selected { box-shadow: inset 3px 0 0 var(--nq-accent-strong); font-weight: 600; }
  html .flyout-menu .icon svg, html .flyout-menu .icon-only svg { stroke: currentColor; }
  html .flyout-menu__search input[type='text'] { background: var(--nq-field); border: 1px solid var(--nq-border-strong); color: var(--nq-ink); }
  html .flyout-menu .nq-scheme { margin: 8px; }
  html .flyout-menu #sidebar a.selected::before, html .flyout-menu a.selected::before { display: none; }

  /* Forms stack: labels above full-width fields. Checkboxes and radios keep their size. */
  html .tabular p, html .tabular.settings p { padding-inline: 0; }
  html .tabular label, html .tabular.settings label { inline-size: 100%; margin-inline-start: 0; padding-block: 4px; text-align: start; }
  html .tabular input:is([type="checkbox"], [type="radio"]), html input:is([type="checkbox"], [type="radio"]) { block-size: 16px; inline-size: 16px; max-inline-size: none; }
  #content > .contextual { float: none; justify-content: flex-start; margin-block-end: 12px; }
  #content > .contextual > a.icon-add:first-child { order: -1; }
  div.issue.details { padding: 16px 16px 16px 22px; }
  div.issue.details::before { inset-inline-start: 7px; }
  div.issue .attributes .attribute { padding-inline-start: 0; }
  div.issue .attributes .attribute .label { display: block; float: none; inline-size: auto; margin-inline-start: 0; }
  html .cal .week-number { background: var(--nq-inset); border-color: var(--nq-border); }
  html .cal .calbody { border-color: var(--nq-border); }
  html p.buttons a { border-color: var(--nq-border-strong); border-radius: var(--nq-radius-sm); }
  .mypage-box > .contextual { opacity: 1; }
  /* Narrow blocks scroll their table sideways instead of breaking every word onto its own line. */
  .mypage-box table.list td { white-space: nowrap; }
  html #project-jump.drdn.expanded .drdn-trigger { background: transparent; box-shadow: none; }
  /* The header is fixed above the page; menus opened from the content must still cover it. */
  html #context-menu { z-index: 10001; }
  /* Related issues stack into cards: the progress bar takes the card width instead of running past it. */
  #relations:not(.with-related-issues-table-headers) .issue > td.done_ratio { inline-size: 100%; padding-inline-end: 0; }
  #relations:not(.with-related-issues-table-headers) .issue > td.done_ratio table.progress { inline-size: 100%; max-inline-size: 100%; }
  table.list { display: table; }
}

/* ───────────────────────── Plugins of the production image ─────────────────────────
 * Plugin stylesheets load after the theme, so these rules carry an extra `html` for weight.
 * Where a plugin exposes variables they are mapped onto the palette; fixed colours are overridden. */

/* Additionals / Additional Tags: their --a-* variables. */
html:root {
  --a-color-dark: var(--nq-muted);
  --a-color-black: var(--nq-ink);
  --a-color-white: var(--nq-card);
  --a-color-default: var(--nq-accent-text);
  --a-color-even: var(--nq-hover);
  --a-color-odd: var(--nq-card);
  --a-color-list-border: var(--nq-border);
  --a-color-input-border: var(--nq-border-strong);
  --a-color-info: var(--nq-subtle);
  --a-color-help: var(--nq-accent-text);
  --a-color-success: var(--nq-success-text);
  --a-color-warning: var(--nq-warning-text);
  --a-color-alert: var(--nq-danger-text);
  --a-color-success-bg: var(--nq-success-wash);
  --a-color-warning-bg: var(--nq-warning-wash);
  --a-color-warning-border: color-mix(in srgb, var(--nq-warning) 45%, transparent);
  --a-color-warning-dark: var(--nq-warning-text);
  --a-color-alert-bg: var(--nq-danger-wash);
  --a-color-alert-strong: var(--nq-danger-wash);
  --a-color-border-light: var(--nq-border);
  --a-color-bg-light: var(--nq-inset);
  --a-color-muted: var(--nq-subtle);
  --a-color-text-muted: var(--nq-subtle);
  --a-color-highlight: var(--nq-hover);
  --a-color-disabled: var(--nq-faint);
  --a-color-smiley: var(--nq-warning);
  --a-color-author: var(--nq-muted);
  --a-color-selection: var(--nq-accent-strong);
  --a-color-bg-subtle: var(--nq-hover);
  --a-color-info-bg: var(--nq-accent-wash);
  --a-color-hover-highlight: var(--nq-hover);
  --a-color-success-border: color-mix(in srgb, var(--nq-success) 45%, transparent);
  --a-color-alert-border: color-mix(in srgb, var(--nq-danger) 45%, transparent);
  --a-color-orange: var(--nq-warning);
  --a-top-menu-bg: var(--nq-chrome);
  --a-top-menu-color: var(--nq-ink);
  --a-control-height: var(--nq-control-h);

  /* Checklist: it reads these generic names, with light fallbacks. */
  --border-color: var(--nq-border);
  --secondary-text-color: var(--nq-subtle);
  --success-color: var(--nq-success);
  --hover-bg: var(--nq-hover);
  --link-color: var(--nq-accent-text);
  --bg-color: var(--nq-card);
  --text-color: var(--nq-ink);
  --danger-color: var(--nq-danger-text);
}
html .top-menu .menu-children { background: var(--nq-raised); border: 1px solid var(--nq-border-strong); border-radius: var(--nq-radius-md); box-shadow: var(--nq-shadow-pop); padding: 4px; }
html .top-menu .menu-children li a, html .top-menu .menu-children li a:hover { border-radius: var(--nq-radius-sm); color: var(--nq-ink); }
html .top-menu .menu-children li a:hover { background: var(--nq-hover); }
html .checklist-item-details, html .checklist-inline-error { border-radius: var(--nq-radius-sm); }
html .checklist-progress-bar { border-radius: var(--nq-radius-pill); }

/* OAuth (OIDC) sign-in: a full-width button under the sign-in card. The provider's own button
 * colour is an inline style chosen in its settings; it is replaced so the text is always readable. */
html div#oauth-form { box-sizing: border-box; inline-size: 380px; margin: -24px auto 48px; max-inline-size: 100%; }
html div#oauth-form-buttons { display: grid; gap: 8px; }
html #oauth-form-buttons button[id^="login-oauth-submit"] {
  align-items: center;
  background: var(--nq-card) !important;
  block-size: var(--nq-control-h-lg);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  display: inline-flex;
  font-weight: 600;
  gap: 8px;
  inline-size: 100%;
  justify-content: center;
}
html #oauth-form-buttons button[id^="login-oauth-submit"]:hover { background: var(--nq-hover) !important; border-color: var(--nq-subtle); }
html #oauth-form-buttons button[id^="login-oauth-submit"] i { color: var(--nq-muted); }
html label[for="oauth_autologin"] { color: var(--nq-ink); }
html fieldset.oauth_collapsible { border-color: var(--nq-border); inline-size: 380px; max-inline-size: 100%; }
html fieldset.oauth_collapsible > legend::before { color: var(--nq-subtle); }
html legend.oauth_legend { color: var(--nq-muted); }

/* RedMica UI Extension turns selects into Select2: same field, chevron and popover as everywhere else. */
html .select2-container--default .select2-selection--single,
html .select2-container--default .select2-selection--multiple {
  background: var(--nq-field);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  min-block-size: var(--nq-control-h);
  transition: border-color var(--nq-fast) var(--nq-ease), box-shadow var(--nq-fast) var(--nq-ease);
}
html .select2-container--default .select2-selection--single { block-size: var(--nq-control-h); }
html .select2-container--default .select2-selection:hover { border-color: var(--nq-subtle); }
html .select2-container--default.select2-container--focus .select2-selection,
html .select2-container--default.select2-container--open .select2-selection {
  border-color: var(--nq-accent-strong);
  box-shadow: var(--nq-focus-ring);
  outline: none;
}
html .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--nq-ink);
  font-family: var(--nq-font-body);
  font-size: 13.5px;
  line-height: calc(var(--nq-control-h) - 2px);
  padding: 0 30px 0 10px;
}
html .select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--nq-subtle); }
html .select2-container--default .select2-selection--single .select2-selection__clear { color: var(--nq-subtle); }
html .select2-container--default .select2-selection--single .select2-selection__arrow {
  background: var(--nq-chevron) no-repeat center / 16px;
  block-size: calc(var(--nq-control-h) - 2px);
  inline-size: 26px;
  inset-block-start: 0;
}
html .select2-container--default.select2-container--open .select2-selection__arrow { transform: rotate(180deg); }
html .select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; }
html .select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 3px 6px; }
html .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--nq-inset);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-xs);
  color: var(--nq-ink);
  font-size: 12.5px;
}
html .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: var(--nq-subtle); }
html .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: var(--nq-ink); }
html .select2-container--default .select2-search--inline .select2-search__field { color: var(--nq-ink); }
html .select2-container--default.select2-container--disabled .select2-selection { background: var(--nq-inset); border-color: var(--nq-border); }
html .select2-container--default.select2-container--disabled .select2-selection__rendered { color: var(--nq-faint); }
html .select2-dropdown {
  background: var(--nq-raised);
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-md);
  box-shadow: var(--nq-shadow-pop);
  color: var(--nq-ink);
  overflow: hidden;
}
html .select2-dropdown--below { margin-block-start: 4px; }
html .select2-dropdown--above { margin-block-start: -4px; }
html .select2-search--dropdown { padding: 6px; }
html .select2-container--default .select2-search--dropdown .select2-search__field {
  background: var(--nq-field) var(--nq-search-glyph) no-repeat 9px 50%;
  border: 1px solid var(--nq-border-strong);
  border-radius: var(--nq-radius-sm);
  color: var(--nq-ink);
  min-block-size: var(--nq-control-h);
  padding-inline-start: 32px;
}
html .select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--nq-accent-strong); outline: none; }
html .select2-results__options { padding: 4px; }
html .select2-container--default .select2-results__option { border-radius: var(--nq-radius-sm); font-size: 13.5px; padding: 6px 10px; }
html .select2-container--default .select2-results__option[aria-selected='true'],
html .select2-container--default .select2-results__option--selected { background: var(--nq-selected); color: var(--nq-ink); font-weight: 600; }
html .select2-container--default .select2-results__option--highlighted[aria-selected],
html .select2-container--default .select2-results__option--highlighted,
html li.select2-results__option--highlighted[role="option"][aria-selected] { background: var(--nq-hover); color: var(--nq-ink); }
html .select2-container--default .select2-results__option[aria-disabled='true'] { color: var(--nq-faint); }
html .select2-container--default .select2-results__group { color: var(--nq-subtle); font: 500 11px var(--nq-font-mono); letter-spacing: .06em; padding: 8px 10px 4px; text-transform: uppercase; }
html .select2-results__message { color: var(--nq-subtle); }

/* Issues Panel: columns are panel cells, cards are quiet cards; priority keeps a slim inset bar. */
html table.issues-panel { background: var(--nq-card); border: 1px solid var(--nq-border); border-collapse: separate; border-radius: var(--nq-radius-md); }
html table.issues-panel th { background: var(--nq-inset); border-block-end: 1px solid var(--nq-border); color: var(--nq-muted); font: 500 11px var(--nq-font-mono); letter-spacing: .06em; padding: 9px 8px; text-transform: uppercase; }
html table.issues-panel td { background: var(--nq-canvas); border: 0; border-inline-start: 1px solid var(--nq-border); padding: 6px; }
html table.issues-panel td:first-child { border-inline-start: 0; }
html .issue-card { background: var(--nq-card); border: 1px solid var(--nq-border); border-radius: var(--nq-radius-md); color: var(--nq-ink); word-break: normal; overflow-wrap: anywhere; }
html .issue-card:hover { border-color: var(--nq-border-strong); }
html .issue-card .closed { background: transparent; opacity: .75; }
html .issue-card .card-content { font-size: 12.5px; line-height: 1.5; padding: 10px 12px; }
html .issue-card .card-content .caption strong { color: var(--nq-subtle); font-weight: 500; }
html .issue-card .card-content .header a.issue { font-family: var(--nq-font-mono); font-size: 12px; }
html .issue-card .overdue .due_date .value { color: var(--nq-danger-text); }
html .issue-card div[class*="priority-"] { border-radius: var(--nq-radius-md); }
html .issue-card div.priority-lowest { box-shadow: inset 3px 0 0 var(--nq-accent-strong); }
html .issue-card div.priority-high3 { box-shadow: inset 3px 0 0 var(--nq-warning); }
html .issue-card div:is(.priority-high2, .priority-highest) { box-shadow: inset 3px 0 0 var(--nq-danger); }
html .issue-card-receiver { border-color: transparent; }
html :is(td, th) > .issue-cards > .add-issue-card { background: transparent; border: 1px dashed var(--nq-border-strong); border-radius: var(--nq-radius-md); }
html :is(td, th) > .issue-cards > .add-issue-card:hover { background: var(--nq-hover); }
html .ui-droppable-hover { border: 2px dashed var(--nq-accent-strong) !important; border-radius: var(--nq-radius-md); }
html #issue_panel_issue_description, html #issue_panel_issue_description .issue { background: var(--nq-raised); color: var(--nq-ink); }
html #issue_panel_issue_description { border: 1px solid var(--nq-border-strong); border-radius: var(--nq-radius-md); box-shadow: var(--nq-shadow-pop); padding: 8px; }

/* Issue Templates: white boxes and grey fieldsets become panel surfaces. */
html fieldset.issue, html div.issue_template, html .box-white, html .template_box {
  background: var(--nq-card);
  border: 1px solid var(--nq-border);
  border-radius: var(--nq-radius-md);
  color: var(--nq-ink);
}
html .box-white .box-white, html .box-white fieldset.issue { background: transparent; }
html .issue_template.help_content { color: var(--nq-danger-text); }
html #template_status-area .flash_message { background-color: var(--nq-accent-wash); border-color: color-mix(in srgb, var(--nq-accent-strong) 45%, transparent); border-radius: var(--nq-radius-sm); color: var(--nq-ink); }
html #field_information, html .template_tooltip_wrapper, html .template_tooltip_wrapper:hover { color: var(--nq-muted); }
html .template_tooltip_wrapper .template_tooltip_body { background: var(--nq-raised); border: 1px solid var(--nq-border-strong); border-radius: var(--nq-radius-md); box-shadow: var(--nq-shadow-pop); color: var(--nq-ink); }
html .template_tooltip_wrapper .template_tooltip_body .title { color: var(--nq-subtle); }
html table.list.template_list { border: 1px solid var(--nq-border); }
html option.inherited, html option.global { background: var(--nq-warning-wash); color: var(--nq-warning-text); }
html .non_project_tracker { color: var(--nq-danger-text); }

/* Periodic Task: upcoming-run chips and the mini calendar. */
html .periodictask-schedule-rule { color: var(--nq-muted); }
html .periodictask-run-chip { background: var(--nq-accent-wash); border-color: color-mix(in srgb, var(--nq-accent-strong) 45%, transparent); border-radius: var(--nq-radius-pill); color: var(--nq-accent-text); font-family: var(--nq-font-mono); font-size: 11.5px; }
html .periodictask-run-chip-overdue { background: var(--nq-warning-wash); border-color: color-mix(in srgb, var(--nq-warning) 50%, transparent); color: var(--nq-warning-text); }
html .periodictask-cal th { color: var(--nq-subtle); }
html .periodictask-cal td.nwday { background: var(--nq-hover); color: var(--nq-subtle); }
html .periodictask-cal td.today { box-shadow: inset 0 0 0 1px var(--nq-accent-strong); }
html .periodictask-cal td.periodictask-cal-run { background: var(--nq-primary); color: var(--nq-primary-ink); }
html .periodictask-cal td.periodictask-cal-moved { color: var(--nq-faint); }