:root {
  /* FINAL_03 source tokens. Compatibility aliases below keep legacy selectors
     on the same approved visual system while templates are migrated. */
  --color-bg-page: #F5F6F7;
  --color-bg-surface: #FFFFFF;
  --color-bg-hover: #FAFBFB;
  --color-border: #E3E5E8;
  --color-text: #1A1D21;
  --color-text-muted: #6B7280;
  --color-text-disabled: #9CA3AF;
  --color-accent: #2563EB;
  --color-danger: #DC2626;
  --color-success: #15803D;
  --color-warning: #B45309;
  --color-status-new: #6B7280;
  --color-status-an-review: #B45309;
  --color-status-gip-review: #B45309;
  --color-status-assigned: #7C3AED;
  --color-status-progress: #2563EB;
  --color-status-answered: #15803D;
  --color-status-closed: #6B7280;
  --status-badge-alpha: .12;
  --font-family: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-numeric: tabular-nums;
  --font-size-h1: 20px;
  --line-height-h1: 28px;
  --font-size-h2: 15px;
  --line-height-h2: 22px;
  --font-size-body: 13px;
  --line-height-body: 18px;
  --font-size-small: 12px;
  --line-height-small: 16px;
  --font-size-caption: 11px;
  --line-height-caption: 16px;
  --font-size-metric: 28px;
  --line-height-metric: 28px;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semi: 600;
  --letter-spacing-caps: .4px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 40px;
  --space-10: 48px;
  --page-padding-x: 32px;
  --page-padding-x-mobile: 16px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --control-height: 32px;
  --control-height-mobile: 44px;
  --control-height-sm: 26px;
  --control-padding-x: 14px;
  --control-padding-x-sm: 10px;
  --badge-height: 20px;
  --badge-padding-x: 8px;
  --table-header-height: 32px;
  --table-row-min-height: 36px;
  --table-cell-padding-x: 12px;
  --topbar-height: 56px;
  --topbar-height-mobile: 46px;
  --logo-size: 30px;
  --tile-padding: 16px;
  --tile-min-width: 190px;
  --focus-ring-width: 1.5px;
  --tap-target-min: 44px;
  --modal-max-width: 480px;
  --modal-shadow: 0 8px 28px rgba(0, 0, 0, .22);
  --transition-fast: 120ms ease;

  --color-teal: var(--color-accent);
  --color-teal-dark: #1D4ED8;
  --color-teal-pale: #EFF6FF;
  --color-azure: var(--color-accent);
  --color-azure-dark: #1D4ED8;
  --color-azure-pale: #EFF6FF;
  --color-pink: var(--color-danger);
  --color-pink-dark: #B91C1C;
  --color-green: var(--color-success);
  --color-green-dark: #166534;
  --color-info: var(--color-accent);
  --color-text-soft: var(--color-text);
  --color-muted: var(--color-text-muted);
  --color-border-strong: #D1D5DB;
  --color-surface: var(--color-bg-surface);
  --color-row-even: #FAFBFB;
  --color-row-hover: var(--color-bg-hover);
  --color-page: var(--color-bg-page);
  --shadow-card: 0 1px 2px rgba(26, 29, 33, .06);
  --shadow-raised: 0 8px 24px rgba(26, 29, 33, .12);
  --radius: var(--radius-md);
  --focus-ring: 0 0 0 3px rgba(37, 99, 235, .22);
  --content-width: 1440px;
  --form-width: 832px;
  font-family: var(--font-family);
  color: var(--color-text);
  background: var(--color-bg-page);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

*,
*::before,
*::after { box-sizing: border-box; }

html { min-width: 320px; scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
  color: var(--color-text);
  background: var(--color-page);
  overflow-wrap: anywhere;
}
body.modal-open { overflow: hidden; }
img { max-width: 100%; }
a { color: var(--color-azure-dark); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: #155f99; text-decoration: underline; }
button,
.button,
input,
select,
textarea { font: inherit; }
button,
.button { touch-action: manipulation; }
:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--color-azure);
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

.skip-link {
  position: fixed;
  z-index: 1000;
  top: var(--space-2);
  left: var(--space-2);
  padding: var(--space-3) var(--space-4);
  color: var(--color-text);
  background: var(--color-surface);
  border: 2px solid var(--color-azure);
  border-radius: var(--radius);
  box-shadow: var(--shadow-raised);
  transform: translateY(-160%);
}
.skip-link:focus { transform: translateY(0); }

.topbar {
  position: relative;
  z-index: 50;
  color: var(--color-text);
  background: var(--color-bg-surface);
  border-bottom: 1px solid var(--color-border);
  box-shadow: none;
}
.topbar-inner,
.footer-inner {
  width: min(100%, var(--content-width));
  margin: 0 auto;
  padding-inline: clamp(var(--space-4), 3vw, var(--space-8));
}
.topbar-inner {
  min-height: var(--topbar-height);
  display: flex;
  align-items: center;
  gap: var(--space-6);
}
.brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--color-text);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-semi);
  line-height: 1.2;
  text-decoration: none;
}
.brand:hover { color: var(--color-accent); text-decoration: none; }
.brand-mark {
  flex: 0 0 auto;
  display: grid;
  width: var(--logo-size);
  height: var(--logo-size);
  place-items: center;
  color: #fff;
  background: var(--color-accent);
  border-radius: var(--radius-sm);
  font-size: .75rem;
  letter-spacing: .03em;
}
.brand-logo { width: var(--logo-size); height: var(--logo-size); flex: 0 0 auto; object-fit: contain; }
.nav-shell {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
}
.primary-nav,
.account,
.account-identity {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.primary-nav { flex-wrap: wrap; }
.primary-nav a,
.account-link,
.link-button {
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  padding: .5rem .7rem;
  color: var(--color-text);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}
.primary-nav a:hover,
.primary-nav a[aria-current="page"],
.account-link:hover,
.link-button:hover {
  color: var(--color-accent);
  background: var(--color-bg-hover);
  text-decoration: none;
}
.primary-nav a[aria-current="page"] { box-shadow: inset 0 -2px var(--color-accent); }
.primary-nav .header-button:not(.complaint-button) {
  color: var(--color-teal-dark);
  background: var(--color-teal-pale);
  border-color: rgba(255, 255, 255, .45);
}
.primary-nav .header-button:not(.complaint-button):hover,
.primary-nav .header-button:not(.complaint-button):focus-visible,
.primary-nav .header-button:not(.complaint-button)[aria-current="page"] {
  color: #fff;
  background: var(--color-teal-dark);
}
.primary-nav .complaint-button {
  height: 32px;
  min-height: 32px;
  padding-inline: 14px;
  color: #DC2626;
  border: 0;
  border-radius: 6px;
  background: rgba(220, 38, 38, .1);
  transition: 120ms;
}
.primary-nav .complaint-button:hover,
.primary-nav .complaint-button:focus-visible {
  color: #DC2626;
  background: rgba(220, 38, 38, .18);
}
.primary-nav .complaint-button:active,
.primary-nav .complaint-button[aria-current="page"] {
  color: #fff;
  background: #DC2626;
}
.account {
  margin-left: auto;
  flex-wrap: nowrap;
  gap: var(--space-2);
  font-family: inherit;
  font-size: 14px;
  line-height: 20px;
}
.account-identity { flex-wrap: nowrap; gap: var(--space-2); }
.account-name {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  font-size: 14px;
  font-weight: var(--font-weight-medium);
  line-height: 20px;
}
.account form {
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  margin: 0;
  font: inherit;
}
.account button,
.account input,
.account select { font: inherit; }
.account .link-button {
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 6px 10px;
  font-size: 14px;
  font-weight: var(--font-weight-semi);
  line-height: 20px;
}
.link-button { cursor: pointer; }
.nav-toggle {
  min-height: 2.75rem;
  display: none;
  align-items: center;
  gap: var(--space-2);
  margin-left: auto;
  padding: .5rem .75rem;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  font-weight: 700;
}
.role-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-height);
  margin: 0;
  padding: 6px 10px;
  color: var(--color-teal-dark);
  background: var(--color-bg-hover);
  border-radius: 999px;
  font-size: 14px;
  font-weight: var(--font-weight-semi);
  line-height: 20px;
}

.container {
  width: min(100%, var(--content-width));
  flex: 1 0 auto;
  margin: 0 auto;
  padding: clamp(var(--space-4), 2vw, var(--space-6)) clamp(var(--space-4), 3vw, var(--space-8));
}
.footer {
  color: var(--color-muted);
  border-top: 1px solid var(--color-border);
  background: #fbfdfc;
  font-size: .875rem;
}
.footer-inner {
  min-height: 3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

h1,
h2,
h3 { color: var(--color-text); line-height: 1.25; text-wrap: balance; }
h1 { margin: 0 0 var(--space-2); font-size: var(--font-size-h1); line-height: var(--line-height-h1); }
h2 { margin: 0 0 var(--space-3); font-size: var(--font-size-h2); line-height: var(--line-height-h2); }
h3 { margin: var(--space-4) 0 var(--space-2); font-size: var(--font-size-body); line-height: var(--line-height-body); }
p { margin: 0 0 var(--space-3); }
.muted { color: var(--color-muted); }
.eyebrow {
  margin-bottom: var(--space-2);
  color: var(--color-teal-dark);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.page-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-6);
  margin-bottom: var(--space-5);
}
.page-heading > :first-child { min-width: 0; }
.page-heading p { max-width: 52rem; margin-bottom: 0; }
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0 0 var(--space-4);
  padding: 0;
  color: var(--color-muted);
  list-style: none;
  font-size: .875rem;
}
.breadcrumb li + li::before { margin-right: var(--space-2); content: "/"; color: var(--color-border-strong); }

.button,
button:not(.link-button, .nav-toggle) {
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: .55rem .9rem;
  color: var(--color-text-soft);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: #fff;
  box-shadow: 0 1px 1px rgba(24, 36, 51, .04);
  cursor: pointer;
  font-weight: 650;
  line-height: 1.2;
  text-decoration: none;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.button:hover,
button:not(.link-button, .nav-toggle):hover {
  color: #fff;
  border-color: var(--color-text-soft);
  background: var(--color-text-soft);
  text-decoration: none;
}
.button:disabled,
button:disabled,
[aria-disabled="true"] { opacity: .55; cursor: not-allowed; pointer-events: none; }
.primary,
.button-primary {
  color: #fff !important;
  border-color: var(--color-azure) !important;
  background: var(--color-azure) !important;
}
.primary:hover,
.button-primary:hover { border-color: var(--color-azure-dark) !important; background: var(--color-azure-dark) !important; }
.success,
.button-success {
  color: #fff !important;
  border-color: var(--color-green) !important;
  background: var(--color-green) !important;
}
.danger,
.button-danger {
  color: var(--color-danger) !important;
  border-color: #e6a6a6 !important;
  background: #fff !important;
}
.danger:hover,
.button-danger:hover { color: #fff !important; border-color: var(--color-danger) !important; background: var(--color-danger) !important; }
.button-complaint {
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
  background: var(--color-bg-surface) !important;
}
.button-instruction { color: var(--color-teal-dark); border-color: #96dfc8; background: var(--color-teal-pale); }
.button-instruction:hover { color: #fff; border-color: var(--color-teal); background: var(--color-teal); }
.button-excel { color: var(--color-teal-dark); border-color: #75cdb1; background: #fff; }
.button-excel::before { content: "XLSX"; font-size: .65rem; font-weight: 800; letter-spacing: .03em; }
.button-excel:hover { color: #fff; border-color: var(--color-teal-dark); background: var(--color-teal-dark); }
.button-outline { color: var(--color-azure-dark); border-color: var(--color-azure); background: #fff; }
.actions,
.actionbar,
.workflow-actions,
.filter-actions,
.registry-toolbar,
.export-actions,
.pagination,
.active-filters,
.meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
}
.actionbar { margin-bottom: var(--space-4); }
.actions { margin-top: var(--space-4); }

.card,
.form-card,
.auth-card {
  min-width: 0;
  margin-bottom: var(--space-4);
  padding: clamp(var(--space-4), 1.5vw, var(--space-5));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}
.card > :last-child,
.form-card > :last-child { margin-bottom: 0; }
.section-card { margin-bottom: var(--space-4); }
.grid.two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}
.meta { color: var(--color-muted); font-size: .9rem; }
.meta > * + *::before { margin-right: var(--space-3); content: "•"; color: var(--color-border-strong); }

.messages { margin-bottom: var(--space-6); }
.alert,
.message,
.error-summary,
.invitation-error {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  color: #1e4f72;
  border: 1px solid #b9dcf5;
  border-left: 4px solid var(--color-info);
  border-radius: var(--radius);
  background: var(--color-azure-pale);
}
.alert-marker {
  flex: 0 0 auto;
  width: .7rem;
  height: .7rem;
  margin-top: .42rem;
  border: 2px solid currentColor;
  border-radius: 50%;
}
.alert-success,
.message.success { color: #176b35; border-color: #b4dfbd; border-left-color: var(--color-green); background: #eefaf0; }
.alert-warning,
.message.warning { color: #7a5100; border-color: #f2d48d; border-left-color: var(--color-warning); background: #fff8e6; }
.alert-error,
.error-summary,
.invitation-error { color: #8c2828; border-color: #edb6b6; border-left-color: var(--color-danger); background: #fff1f1; }
.error-summary { display: block; }
.error-summary ul { margin-bottom: 0; }

.form-card { width: min(100%, var(--form-width)); margin-inline: auto; }
form.stack > p,
.form-field { margin: 0 0 var(--space-3); }
label,
.form-field > label,
.stack label {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--color-text-soft);
  font-weight: 650;
}
label:not(:has(.required-indicator)):has(+ input[required])::after,
label:not(:has(.required-indicator)):has(+ select[required])::after,
label:not(:has(.required-indicator)):has(+ textarea[required])::after { content: " *"; color: var(--color-danger); }
.required-indicator { color: var(--color-danger); }
input,
select,
textarea {
  width: 100%;
  min-height: var(--control-height);
  padding: .62rem .75rem;
  color: var(--color-text);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: #fff;
  line-height: 1.4;
}
textarea { min-height: 7rem; resize: vertical; }
input[type="checkbox"],
input[type="radio"] {
  width: 1.15rem;
  min-height: 1.15rem;
  margin: .15rem .4rem 0 0;
  accent-color: var(--color-azure);
}
input[type="file"] { min-height: 3rem; padding: .5rem; }
input:hover,
select:hover,
textarea:hover { border-color: #99a8b7; }
input:focus,
select:focus,
textarea:focus { border-color: var(--color-azure); box-shadow: var(--focus-ring); }
[aria-invalid="true"],
.has-error input,
.has-error select,
.has-error textarea { border-color: var(--color-danger); box-shadow: 0 0 0 1px var(--color-danger); }
.helptext {
  display: block;
  margin-top: var(--space-2);
  color: var(--color-muted);
  font-size: .875rem;
}

.action-required input,
.action-required select,
.action-required textarea {
  border-color: var(--color-green);
  box-shadow: 0 0 0 1px var(--color-green);
}

.action-required input:focus,
.action-required select:focus,
.action-required textarea:focus {
  border-color: var(--color-green);
  box-shadow: 0 0 0 3px rgba(21, 128, 61, .18);
}

.action-required [aria-invalid="true"],
.action-required.has-error input,
.action-required.has-error select,
.action-required.has-error textarea {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 1px var(--color-danger);
}

.errorlist {
  margin: var(--space-2) 0;
  padding-left: var(--space-5);
  color: #9f2929;
  font-size: .9rem;
}
.required-note { color: var(--color-muted); font-size: .875rem; }
fieldset {
  min-width: 0;
  margin: 0 0 var(--space-6);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
legend { padding-inline: var(--space-2); font-weight: 700; }

.auth-page {
  background:
    linear-gradient(rgba(244, 252, 249, .82), rgba(255, 255, 255, .9)),
    url("../images/login-project.3f246dfae192.png") center / cover fixed no-repeat;
}
.auth-page .topbar { box-shadow: none; }
.auth-branding { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-5); }
.auth-logo { width: 48px; height: 48px; object-fit: contain; }
.auth-page .nav-shell,
.auth-page .nav-toggle { display: none; }
.auth-page .topbar-inner { justify-content: center; }
.auth-page .container {
  width: min(100%, 38rem);
  display: grid;
  place-items: center;
  padding-block: clamp(var(--space-6), 7vh, 5rem);
}
.auth-card {
  width: min(100%, 31rem);
  margin: 0;
  padding: clamp(var(--space-6), 5vw, var(--space-10));
  box-shadow: var(--shadow-raised);
}
.auth-mark {
  margin-bottom: var(--space-5);
  color: var(--color-teal-dark);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.auth-submit { width: 100%; margin-top: var(--space-2); text-align: center; }
.auth-links { margin-top: var(--space-5); text-align: center; }
.invitation-identity {
  margin: var(--space-6) 0;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
.invitation-identity div {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
}
.invitation-identity div + div { border-top: 1px solid var(--color-border); }
.invitation-identity span { color: var(--color-muted); }

.registry-search { margin-bottom: var(--space-5); }
.registry-search > summary {
  width: fit-content;
  min-height: 2.65rem;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: .55rem .9rem;
  color: var(--color-azure-dark);
  border: 1px solid var(--color-azure);
  border-radius: var(--radius-sm);
  background: #fff;
  cursor: pointer;
  font-weight: 700;
}
.registry-search > summary::after { content: "Развернуть"; color: var(--color-muted); font-size: .75rem; font-weight: 500; }
.registry-search[open] > summary::after { content: "Свернуть"; }
.registry-filters {
  margin-top: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: #fbfefd;
  box-shadow: var(--shadow-card);
}
.filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(10rem, 1fr));
  gap: var(--space-4);
}
.filter-grid-basic {
  grid-template-columns: minmax(15rem, 2fr) repeat(3, minmax(9rem, 1fr));
}
.filter-grid-basic .filter-search { grid-column: auto; }
.registry-advanced { margin-top: var(--space-4); }
.registry-advanced > summary {
  width: fit-content;
  min-height: 2.4rem;
  display: inline-flex;
  align-items: center;
  padding: .45rem .75rem;
  color: var(--color-azure-dark);
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: .875rem;
  font-weight: 700;
}
.registry-advanced > summary:hover { background: var(--color-azure-pale); }
.registry-advanced .advanced-hide-label { display: none; }
.registry-advanced[open] .advanced-show-label { display: none; }
.registry-advanced[open] .advanced-hide-label { display: inline; }
.filter-grid-advanced { margin-top: var(--space-3); }
.filter-field { min-width: 0; }
.filter-field label { font-size: .875rem; }
.filter-search { grid-column: span 2; }
.filter-error { grid-column: 1 / -1; }
.filter-actions { margin-top: var(--space-5); }
.registry-toolbar { justify-content: space-between; margin-bottom: var(--space-4); }
.active-filters { margin-top: var(--space-2); color: var(--color-muted); font-size: .85rem; }

/* Registry heading: title on the left, «Добавить запрос» and «Excel» on the right. */
.registry-heading { align-items: center; }
.registry-heading > h1 { margin: 0; font-size: var(--font-size-h1); font-weight: var(--font-weight-semi); }
.registry-heading-actions { display: flex; align-items: center; gap: 6px; }
.excel-menu { position: relative; }
.excel-menu > summary {
  height: 32px;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 0 14px;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: #FFFFFF;
  cursor: pointer;
  font-size: var(--font-size-body);
  font-weight: 650;
  list-style: none;
  white-space: nowrap;
}
.excel-menu > summary::-webkit-details-marker { display: none; }
.excel-menu > summary::after { color: var(--color-text-muted); font-size: 9px; content: "▼"; }
.excel-menu[open] > summary::after { content: "▲"; }
.excel-menu-list {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  right: 0;
  width: 190px;
  display: flex;
  flex-direction: column;
  padding: var(--space-1) 0;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: #FFFFFF;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
  font-size: 12px;
}
.excel-menu-list a { padding: var(--space-2) var(--space-3); color: var(--color-text); text-decoration: none; }
.excel-menu-list a:hover,
.excel-menu-list a:focus { background: var(--color-bg-hover); text-decoration: none; }
.registry-summary-value { color: var(--color-text); font-weight: var(--font-weight-semi); }
a.registry-summary-overdue { color: var(--color-text); text-decoration: underline; }
.filter-chip {
  padding: .2rem .55rem;
  color: var(--color-teal-dark);
  border: 1px solid #a9dccb;
  border-radius: 999px;
  background: var(--color-teal-pale);
}
.sort-indicator { color: var(--color-azure-dark); font-size: 1rem; }
.pagination { justify-content: center; margin-top: var(--space-6); }

.table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: var(--shadow-card);
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}
table {
  width: 100%;
  min-width: 48rem;
  border-collapse: collapse;
  background: #fff;
}
caption {
  padding: var(--space-4);
  color: var(--color-text);
  font-weight: 700;
  text-align: left;
}
th,
td {
  max-width: 34rem;
  padding: .8rem .75rem;
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
  text-align: left;
  overflow-wrap: anywhere;
}
th {
  color: var(--color-text-soft);
  background: #f4f8f6;
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .025em;
  text-transform: uppercase;
}
tbody tr:nth-child(odd) { background: #fff; }
tbody tr:nth-child(even) { background: var(--color-row-even); }
tbody tr:hover,
tbody tr:focus-within { background: var(--color-row-hover); }
tbody tr.js-registry-row:focus {
  outline: 2px solid var(--color-azure);
  outline-offset: -2px;
  background: var(--color-row-hover);
  box-shadow: inset 0 0 0 2px rgba(66, 153, 225, .2);
}
tbody tr:last-child td { border-bottom: 0; }
.numeric { font-variant-numeric: tabular-nums; text-align: right; }
.js-registry-row { cursor: pointer; }
.table-short-heading {
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}
.container:has(.issue-register) { max-width: 1440px; padding-inline: 32px; }
.table-wrap:has(.issue-register) {
  width: 100%;
  overflow-x: auto;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.issue-register {
  width: 1376px;
  min-width: 1376px;
  table-layout: fixed;
}
.issue-register th,
.issue-register td {
  box-sizing: border-box;
  max-width: none;
  padding: 8px 12px;
  vertical-align: top;
  text-align: left;
  overflow-wrap: normal;
}
.issue-register th:first-child,
.issue-register td:first-child { padding-left: 20px; }
.issue-register th:last-child,
.issue-register td:last-child { padding-right: 20px; }
.issue-register thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  height: 32px;
  padding-block: 0;
  color: var(--color-text-muted);
  background: #FFFFFF;
  border-bottom: 1px solid var(--color-border);
  font-size: 11px;
  font-weight: 500;
  line-height: 32px;
  letter-spacing: .4px;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}
.table-sort-arrow { margin-left: 5px; }
.issue-register tbody tr { height: 36px; background: #FFFFFF; }
.issue-register tbody tr:nth-child(odd),
.issue-register tbody tr:nth-child(even) { background: #FFFFFF; }
.issue-register tbody tr:hover,
.issue-register tbody tr:focus-within { background: var(--color-bg-hover); }
.issue-register .numeric { text-align: left; }
.registry-number-content { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.overdue-dot {
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--color-danger);
}
.registry-author {
  display: -webkit-box;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.registry-question,
.registry-answer {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.issue-register .status {
  height: 20px;
  min-height: 20px;
  overflow: hidden;
  padding-inline: 6px;
  border-radius: 4px;
  font-size: 11px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.issue-register .status::before { display: none; }

/* On sufficiently wide desktops the registry table fills the content container
   and the ten columns fit without horizontal scrolling. Narrower viewports keep
   the existing fixed-width scrollable layout.

   Column widths live in the template colgroup so a single fixed grid serves both
   modes: the eight fixed columns stay at their exact pixel values and Вопрос и
   Ответ split the remainder equally via calc((100% - 566px) / 2). Percentage
   widths are deliberately not used here — they scaled Статус below its required
   130px and clipped the «На рассмотрении» badge. */
@media (min-width: 1366px) {
  .issue-register {
    width: 100%;
    min-width: 0;
  }
  /* `overflow-x: auto` alone computes `overflow-y` to `auto`, which turns the
     wrapper into the nearest scrollport for the sticky header. Its height is
     unconstrained, so the header scrolled away with the page instead of
     pinning to the viewport. Above 1366px the table already fits, so the
     wrapper needs no scrolling at all and the viewport becomes the scrollport.
     Below 1366px the wrapper keeps `overflow-x: auto` (see .table-wrap). */
  .table-wrap:has(.issue-register) {
    overflow: visible;
  }
}

/* «План»: a historical deadline already expired when it was rescheduled reads
   as danger, one moved ahead of time stays muted, the current one is plain
   text. The missed/moved distinction comes from the state prepared server-side
   (`entry.registry_deadline_state`); nothing is recomputed here. */
.deadline-history s,
.deadline-previous s { color: var(--color-text-muted); }
.deadline-previous.deadline-moved s { color: var(--color-text-muted); }
.deadline-previous.deadline-missed s { color: var(--color-danger); }
.current-deadline { color: var(--color-text); font-weight: var(--font-weight-regular); }
/* «Откл.»: only a positive (overdue) deviation is emphasised; zero, negative
   and the empty em dash stay muted at regular weight. */
.registry-deviation { color: var(--color-text-muted); font-weight: var(--font-weight-regular); }
.registry-deviation-positive { color: var(--color-danger); font-weight: 600; }
.empty { padding: var(--space-10) var(--space-5) !important; color: var(--color-muted); text-align: center; }

.status,
.badge {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  max-width: 100%;
  min-height: var(--badge-height);
  padding: 0 var(--badge-padding-x);
  color: var(--color-status-new);
  border: 0;
  border-radius: var(--radius-sm);
  background: rgba(107, 114, 128, var(--status-badge-alpha));
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-medium);
  line-height: 1.25;
  white-space: normal;
}
.status::before,
.badge::before { width: .45rem; height: .45rem; flex: 0 0 auto; border-radius: 50%; background: currentColor; content: ""; }
.status-new { color: var(--color-status-new); background: rgba(107, 114, 128, .12); }
.status-an_review { color: var(--color-status-an-review); background: rgba(180, 83, 9, .12); }
.status-gip_review { color: var(--color-status-gip-review); background: rgba(180, 83, 9, .12); }
.status-assigned { color: var(--color-status-assigned); background: rgba(124, 58, 237, .12); }
.status-in_progress { color: var(--color-status-progress); background: rgba(37, 99, 235, .12); }
.status-answer_sent { color: var(--color-status-answered); background: rgba(21, 128, 61, .12); }
.status-closed { color: var(--color-status-closed); background: rgba(107, 114, 128, .12); }
.badge-success,
.badge-ready { color: #1e7534; border-color: #b3dfbd; background: #eefaf0; }
.badge-warning,
.badge-due { color: #805500; border-color: #ebd28f; background: #fff8e6; }
.badge-danger,
.badge-overdue { color: #9f2929; border-color: #ebb5b5; background: #fff1f1; }
.badge-neutral { color: #566573; border-color: #d1d9e0; background: #f5f7f8; }

.dashboard-counters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
.dashboard-counter {
  position: relative;
  min-height: 6.25rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  color: inherit;
  border-left: 4px solid var(--color-azure);
  text-decoration: none;
}
.dashboard-counter::after { position: absolute; right: var(--space-4); bottom: var(--space-4); color: var(--color-muted); content: "Открыть →"; font-size: .75rem; }
.dashboard-counter-empty::after { content: none; }
.dashboard-counter-empty { color: var(--color-text-disabled); }
.dashboard-counter:hover { color: inherit; border-color: var(--color-teal); box-shadow: var(--shadow-raised); text-decoration: none; }
.dashboard-counter strong { font-size: 1.8rem; font-variant-numeric: tabular-nums; line-height: 1; }
.dashboard-section { margin-top: var(--space-5); }
.dashboard-definition-list { margin: 0; }
.dashboard-definition-list div { display: flex; justify-content: space-between; gap: var(--space-4); padding: .5rem 0; border-bottom: 1px solid var(--color-border); }
.dashboard-definition-list dd { margin: 0; font-weight: 750; font-variant-numeric: tabular-nums; }
.dashboard-issue-list { margin: 0; padding-left: var(--space-6); }
.dashboard-issue-list li { margin-bottom: var(--space-2); }
.distribution-bar { width: 100%; height: .4rem; margin-top: .35rem; overflow: hidden; border-radius: 999px; background: #e6ece9; }
.distribution-bar > span { display: block; height: 100%; max-width: 100%; background: var(--color-teal); }

dl { margin: 0; }
dt { margin-top: var(--space-3); color: var(--color-muted); font-size: .82rem; font-weight: 650; }
dd { margin: var(--space-1) 0 0; }
.preline { white-space: pre-line; overflow-wrap: anywhere; }
.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(17rem, 1fr);
  align-items: start;
  gap: var(--space-6);
}
.detail-sidebar { min-width: 0; grid-column: 2; grid-row: 1; }
.detail-main { min-width: 0; grid-column: 1; grid-row: 1; }
.detail-sidebar .card { padding: var(--space-5); }
.issue-detail-page .detail-grid {
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: var(--space-4);
}
.issue-detail-page .detail-sidebar { min-width: 260px; }
.issue-detail-page .detail-sidebar .card { padding: var(--space-4); }
.issue-detail-page .issue-heading-meta {
  color: var(--color-text-muted);
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
}
.issue-detail-page .detail-grid-designer-priority .detail-sidebar { display: contents; }
.issue-detail-page .detail-grid-designer-priority .detail-main {
  grid-column: 1;
  grid-row: 1 / span 3;
}
.issue-detail-page .detail-grid-designer-priority .resolution-deadline-card {
  grid-column: 2;
  grid-row: 1;
}
.issue-detail-page .detail-grid-designer-priority .assignment-reference-card {
  grid-column: 2;
  grid-row: 2;
}
.issue-detail-page .detail-grid-designer-priority .contact-reference-card {
  grid-column: 2;
  grid-row: 3;
}
.issue-detail-page .deadline-action-card { border: 1.5px solid var(--color-text); }
.issue-detail-page .resolution-deadline-card .deadline-history { margin-bottom: 10px; }
.issue-detail-page .resolution-deadline-card .deadline-current-label {
  color: var(--color-text-muted);
  font-size: 10px;
}
.issue-detail-page .resolution-deadline-card .deadline-field-grid {
  grid-template-columns: minmax(0, 1fr) 82px;
  align-items: end;
  gap: 8px;
}
.issue-detail-page .resolution-deadline-card .deadline-field-grid .form-field {
  margin-bottom: 0;
}
.issue-detail-page .resolution-deadline-card .deadline-field-grid label {
  margin-bottom: 4px;
  color: var(--color-text-muted);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .4px;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
}
.issue-detail-page .resolution-deadline-card .required-word {
  color: var(--color-text);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}
.issue-detail-page label:has(+ input[required])::after,
.issue-detail-page label:has(+ select[required])::after,
.issue-detail-page label:has(+ textarea[required])::after {
  content: none;
}
.issue-detail-page .required-indicator { color: var(--color-text); }
.issue-detail-page .resolution-deadline-card input,
.issue-detail-page .resolution-deadline-card select {
  height: 30px;
  min-height: 30px;
  padding-block: 0;
}
.issue-detail-page .resolution-deadline-card .deadline-helptext {
  margin: 6px 0 10px;
  font-size: 10px;
}
.issue-detail-page .resolution-deadline-card button[type="submit"] {
  width: 100%;
  height: 32px;
  min-height: 32px;
}
.issue-detail-page .deadline-change-open {
  width: 100%;
  min-height: var(--control-height);
  justify-content: center;
}
.issue-detail-page .deadline-history-list {
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border);
}
.issue-detail-page .deadline-history-list h3 {
  margin: 0 0 var(--space-2);
  font-size: var(--font-size-caption);
  line-height: var(--line-height-caption);
}
.issue-detail-page .deadline-history-entry {
  padding-bottom: var(--space-2);
  font-size: var(--font-size-caption);
  line-height: var(--line-height-caption);
}
.issue-detail-page .deadline-history-entry + .deadline-history-entry {
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border);
}
.issue-detail-page .deadline-history-values {
  display: flex;
  gap: var(--space-1);
  flex-wrap: wrap;
  font-variant-numeric: tabular-nums;
}
.issue-detail-page .deadline-history-values s,
.issue-detail-page .deadline-event-values s { color: var(--color-text-muted); }
.issue-detail-page .deadline-history-meta {
  margin-top: var(--space-1);
  color: var(--color-text-muted);
}
.issue-detail-page .deadline-history-reason { margin-top: var(--space-1); }
.issue-detail-page .current-deadline {
  margin-top: var(--space-2);
  font-variant-numeric: tabular-nums;
  font-weight: var(--font-weight-semi);
}
.issue-detail-page .deadline-change-dialog > form { margin: 0; }
.issue-detail-page .deadline-change-dialog .modal-body { max-height: min(70vh, 38rem); overflow-y: auto; }
.issue-detail-page .deadline-change-dialog .deadline-current-readonly {
  margin: 0;
  color: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}
.issue-detail-page .deadline-change-dialog .deadline-field-grid {
  grid-template-columns: minmax(0, 1fr) 110px;
}
.issue-detail-page .deadline-change-dialog textarea { resize: vertical; }
.issue-detail-page .deadline-timeline-event {
  margin: 0 0 var(--space-4);
  padding: 0 0 0 10px;
  border-left: 2px solid var(--color-border);
}
.issue-detail-page .deadline-event-meta {
  color: var(--color-text-muted);
  font-size: var(--font-size-small);
  line-height: var(--line-height-small);
}
.issue-detail-page .deadline-event-values {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-1);
  font-variant-numeric: tabular-nums;
}
.issue-detail-page .deadline-event-reason { margin-top: var(--space-1); }
.issue-detail-page .deadline-change-attachments { margin-top: var(--space-2); }
.issue-detail-page .attachment-deleted-marker {
  width: 100%;
  padding: var(--space-2);
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  font-size: var(--font-size-caption);
  line-height: var(--line-height-caption);
}
.issue-detail-page .question-summary {
  font-size: 13px;
  font-weight: 600;
}
.issue-detail-page .question-description {
  margin-top: 5px;
  font-size: 12px;
  line-height: 1.55;
}
.issue-detail-page .question-attachments { margin-top: 10px; }
.issue-detail-page .question-service-meta {
  margin-top: 12px;
  padding-top: 8px;
  color: var(--color-text-muted);
  border-top: 1px solid var(--color-border);
  font-size: 10px;
  line-height: 1.4;
}
.issue-detail-page .response-empty-line {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 11px;
}
.issue-detail-page .supplement-meta {
  color: var(--color-text-muted);
  font-size: 10px;
}
.issue-detail-page .content-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.issue-detail-page .content-attachment {
  width: 126px;
  min-width: 126px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.issue-detail-page .attachment-thumbnail {
  width: 126px;
  height: 60px;
  display: grid;
  overflow: hidden;
  place-items: center;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-bg-surface);
}
.issue-detail-page .attachment-thumbnail > a {
  width: 100%;
  height: 100%;
  display: block;
}
.issue-detail-page .attachment-thumbnail img {
  width: 126px;
  height: 60px;
  display: block;
  margin: 0;
  border-radius: 0;
  object-fit: contain;
}
.issue-detail-page .attachment-file-icon {
  color: var(--color-text-muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .4px;
  text-transform: uppercase;
}
.issue-detail-page .attachment-filename {
  width: 126px;
  display: -webkit-box;
  margin-top: 4px;
  overflow: hidden;
  color: var(--color-accent);
  font-size: 11px;
  line-height: 1.25;
  text-decoration: underline;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.issue-detail-page .attachment-meta {
  width: 126px;
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--color-text-muted);
  font-size: 10px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.issue-detail-page .content-attachment form { margin-top: 4px; }
.issue-detail-page .content-attachment .link-button {
  min-height: 30px;
  padding: 3px 0;
  border: 0;
  font-size: 10px;
}
.issue-detail-page .assignment-history {
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid var(--color-border);
  font-size: 10px;
  line-height: 1.45;
}
.issue-detail-page .assignment-history h3 {
  margin: 0 0 6px;
  font-size: 10px;
  font-weight: 600;
}
.issue-detail-page .assignment-history-item + .assignment-history-item {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--color-border);
}
.issue-detail-page .assignment-history-comment {
  color: var(--color-text-muted);
  font-size: 10px;
}
.issue-detail-page .assignment-history-more { margin-top: 6px; }
.issue-detail-page .assignment-history-more > summary {
  width: fit-content;
  color: var(--color-text);
  cursor: pointer;
  font-size: 10px;
  text-decoration: underline;
}
.issue-detail-page .assignment-history-older { margin-top: 8px; }
.issue-detail-page .errorlist { color: var(--color-text); }
.issue-detail-page [aria-invalid="true"] {
  border-color: var(--color-text);
  box-shadow: 0 0 0 1px var(--color-text);
}
.issue-detail-page .action-required [aria-invalid="true"] {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 1px var(--color-danger);
}
.issue-detail-page .current-response {
  border-left-color: var(--color-success);
  background: var(--color-bg-hover);
}
.issue-detail-page .current-response-badge {
  display: inline-flex;
  margin-left: var(--space-2);
  padding: 1px var(--space-2);
  color: var(--color-success);
  border: 1px solid var(--color-success);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-semi);
  line-height: var(--line-height-caption);
}
.issue-detail-page .technical-history > details > summary {
  color: var(--color-text);
  cursor: pointer;
  font-weight: var(--font-weight-semi);
}
.issue-detail-page .technical-history > details[open] > summary { margin-bottom: var(--space-4); }
.issue-detail-page .technical-history-title { font-size: var(--font-size-h2); line-height: var(--line-height-h2); }
.issue-detail-page .modal .danger {
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
  background: var(--color-bg-surface) !important;
}
.overdue-text { color: #9f2929; font-weight: 750; }
.timeline { position: relative; }
.timeline-item {
  position: relative;
  margin-left: .35rem;
  padding: .15rem 0 var(--space-3) var(--space-4);
  border-left: 2px solid #cfe2da;
}
.timeline-item::before {
  position: absolute;
  top: .35rem;
  left: -.38rem;
  width: .65rem;
  height: .65rem;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--color-teal);
  box-shadow: 0 0 0 1px var(--color-teal);
  content: "";
}
.workflow-controls { display: grid; gap: var(--space-4); margin-bottom: var(--space-6); }
.workflow-form { max-width: 46rem; padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius); background: #fbfefd; }
.workflow-form label { display: block; }
.assignment-deadline-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(9rem, 13rem));
  gap: var(--space-3);
}
.deadline-field-grid {
  display: grid;
  grid-template-columns: minmax(11rem, 1fr) minmax(7rem, .45fr);
  gap: var(--space-3);
}
.status-context-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(16rem, .8fr);
  align-items: start;
  gap: var(--space-4);
}
.status-context-layout > [hidden] { display: none; }
.context-help {
  padding: var(--space-4);
  border-left: 4px solid var(--color-azure);
  border-radius: var(--radius-sm);
  background: var(--color-azure-pale);
  line-height: 1.5;
}
.supplement-attachments { margin-top: var(--space-2); font-size: .9rem; }
.assignment-deadline-fields .form-field { min-width: 0; }
.designer-workspace { align-items: start; scroll-margin-top: var(--space-4); }
.designer-response { margin: 0 0 var(--space-4); padding: var(--space-4); border: 1px solid var(--color-border); border-left: 4px solid var(--color-azure); border-radius: var(--radius); background: #fbfdff; }
.response-heading { display: flex; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.response-summary { margin: var(--space-3) 0 var(--space-2); font-size: 1rem; }

.compact-card { padding: var(--space-4); }
.question-information dt { margin-top: .65rem; }
.question-information dt:first-child { margin-top: 0; }
.question-information dd { margin-top: .1rem; }
.supplement-list {
  margin-top: var(--space-4);
  padding-top: var(--space-1);
  border-top: 1px solid var(--color-border);
}
.supplement {
  padding: var(--space-3) 0;
}
.supplement + .supplement { border-top: 1px solid #edf1f3; }
.supplement-meta,
.category-change-line,
.technical-event-line,
.technical-field-label {
  color: var(--color-muted);
  font-size: .78rem;
  line-height: 1.35;
}
.supplement-text { margin-top: var(--space-1); line-height: 1.45; }
.compact-timeline { font-size: .875rem; }
.technical-history { color: var(--color-text-soft); font-size: .85rem; }
.technical-history h2 { font-size: 1.05rem; }
.technical-timeline .timeline-item {
  margin-left: .2rem;
  padding: 0 0 var(--space-2) var(--space-4);
  border-left-width: 1px;
  border-left-color: #dbe5e1;
}
.technical-timeline .timeline-item::before {
  top: .25rem;
  left: -.26rem;
  width: .45rem;
  height: .45rem;
  border-width: 1px;
  background: #72ad98;
  box-shadow: none;
}
.technical-field-label { margin-top: .1rem; }
.technical-change { margin-top: .15rem; }
.technical-change > summary {
  width: fit-content;
  color: var(--color-azure-dark);
  cursor: pointer;
  font-size: .78rem;
}
.technical-change[open] { padding-bottom: var(--space-2); }
.technical-change[open] > div { margin-top: var(--space-1); }

.attachments {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-4);
}
.attachment { min-width: 0; padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff; overflow: hidden; }
.attachment img { width: 100%; height: 9.5rem; display: block; margin-bottom: var(--space-2); border-radius: var(--radius-sm); object-fit: cover; }
.attachment small { display: block; margin-top: var(--space-2); color: var(--color-muted); overflow-wrap: anywhere; }
.attachment form { margin-top: var(--space-3); }
.attachment .link-button { min-height: 2.4rem; padding: .45rem .65rem; color: var(--color-danger); border: 1px solid #e5abab; }

.clipboard-upload { margin-top: var(--space-3); }
.clipboard-paste-target { min-height: 5rem; padding: var(--space-4); color: var(--color-muted); border: 2px dashed #9db1bf; border-radius: var(--radius); background: #f8fbfa; }
.clipboard-paste-target:focus { border-color: var(--color-azure); background: #fff; box-shadow: var(--focus-ring); }
.clipboard-preview-list { display: grid; gap: var(--space-3); margin-top: var(--space-3); }
.clipboard-preview {
  min-width: 0;
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
.clipboard-preview img,
.clipboard-file-icon { width: 4.5rem; height: 3.5rem; border-radius: var(--radius-sm); }
.clipboard-preview img { object-fit: cover; }
.clipboard-file-icon { display: grid; place-items: center; color: var(--color-muted); background: #edf2f0; font-size: .75rem; }
.clipboard-preview strong,
.clipboard-preview small { display: block; overflow-wrap: anywhere; }
.clipboard-preview small { margin-top: var(--space-1); color: var(--color-muted); }
.upload-errors:not(:empty) { margin-top: var(--space-2); color: var(--color-danger); }
.loading-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: var(--space-2);
  border: 2px solid var(--color-border);
  border-top-color: var(--color-accent);
  border-radius: 50%;
  animation: loading-spin .8s linear infinite;
}
@keyframes loading-spin { to { transform: rotate(360deg); } }

.field-counter {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: var(--space-1);
  color: var(--color-text-muted);
  font-size: var(--font-size-small);
}
.field-counter [data-character-count-for] { flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.field-counter .is-near-limit { color: var(--color-warning); font-weight: var(--font-weight-semi); }
.draft-status { color: var(--color-text-muted); font-size: var(--font-size-small); }
.draft-status[data-state="loading"]::before { content: "◌ "; }
.draft-status[data-state="saved"] { color: var(--color-success); }
.draft-status[data-state="error"],
.draft-status[data-state="conflict"] { color: var(--color-danger); }

.system-state {
  width: min(100%, 42rem);
  margin: var(--space-6) auto;
  padding: var(--space-6);
  text-align: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg-surface);
}
.system-state-code { color: var(--color-text-muted); font-variant-numeric: tabular-nums; }

dialog.modal {
  width: min(calc(100% - 32px), var(--modal-max-width));
  padding: 0;
  border: 0;
  border-radius: var(--radius-lg);
  box-shadow: var(--modal-shadow);
}
dialog.modal[open] { display: block; }
dialog.modal::backdrop { background: rgba(26, 29, 33, .48); }
.modal-header,
.modal-body,
.modal-actions { padding: var(--space-4); }
.modal-header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--color-border); }
.modal-header h2 { margin: 0; }
.modal-close { min-width: var(--tap-target-min); min-height: var(--tap-target-min); }
.modal-actions { display: flex; justify-content: flex-end; gap: var(--space-2); border-top: 1px solid var(--color-border); }

.instruction-nav {
  position: sticky;
  z-index: 10;
  top: var(--space-3);
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin: 0 0 var(--space-6);
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--shadow-card);
}
.instruction-nav a { padding: .4rem .7rem; color: var(--color-teal-dark); border-radius: 999px; background: var(--color-teal-pale); font-weight: 650; text-decoration: none; }
.instruction-nav a:hover { color: #fff; background: var(--color-teal); }
.instruction-section { max-width: 60rem; scroll-margin-top: 5rem; }
.instruction-section ol,
.instruction-section ul { padding-left: var(--space-6); }
.instruction-section li { margin-bottom: var(--space-3); }
.instruction-return { margin-top: var(--space-6); }
.security-note { padding: var(--space-4); border-left: 4px solid var(--color-warning); border-radius: var(--radius-sm); background: #fff8e6; }
kbd { padding: .08rem .35rem; border: 1px solid var(--color-border-strong); border-bottom-width: 2px; border-radius: .25rem; background: #f7f9f8; }

.diagnostic-table { min-width: 48rem; }
.diagnostic-status-ok,
.resource-level-normal { color: #176b35; font-weight: 750; }
.diagnostic-status-warning,
.resource-level-warning { color: #805500; font-weight: 750; }
.diagnostic-status-error,
.resource-level-critical { color: #9f2929; font-weight: 750; }
.report-number { font-size: 1.15rem; font-weight: 750; }
.print-only { display: none; }

@media (max-width: 72rem) {
  .topbar-inner { gap: var(--space-3); }
  .primary-nav a,
  .account-link,
  .link-button { padding-inline: .5rem; font-size: .88rem; }
  .account-name { max-width: 9rem; }
  .filter-grid { grid-template-columns: repeat(3, minmax(10rem, 1fr)); }
  .filter-grid-basic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-grid-basic .filter-search { grid-column: 1 / -1; }
}

@media (max-width: 62rem) {
  .topbar-inner { min-height: 3.75rem; flex-wrap: wrap; padding-block: var(--space-2); }
  .nav-toggle { display: inline-flex; }
  .nav-shell {
    flex: 1 0 100%;
    display: none;
    align-items: stretch;
    padding: var(--space-2) 0 var(--space-3);
    border-top: 1px solid rgba(255, 255, 255, .25);
  }
  .nav-shell.is-open { display: grid; }
  .primary-nav { align-items: stretch; }
  .primary-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-nav a { justify-content: flex-start; }
  .account { align-items: center; justify-content: space-between; margin: var(--space-2) 0 0; padding-top: var(--space-2); border-top: 1px solid rgba(255, 255, 255, .2); }
  .account-name { max-width: min(48vw, 20rem); }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-search { grid-column: 1 / -1; }
  .detail-grid { grid-template-columns: 1fr; }
  .detail-sidebar,
  .detail-main { grid-column: 1; grid-row: auto; }
}

@media (min-width: 48.001rem) and (max-width: 62rem) {
  .issue-detail-page .detail-grid { grid-template-columns: minmax(0, 1fr) 260px; }
  .issue-detail-page .detail-sidebar { min-width: 260px; grid-column: 2; grid-row: 1; }
  .issue-detail-page .detail-main { grid-column: 1; grid-row: 1; }
  .issue-detail-page .detail-grid-designer-priority .detail-main { grid-row: 1 / span 3; }
}

@media (max-width: 48rem) {
  .topbar-inner { min-height: var(--topbar-height-mobile); padding-inline: var(--page-padding-x-mobile); }
  .container { padding-inline: var(--page-padding-x-mobile); }
  .button,
  button,
  .primary-nav a,
  .account-link,
  .link-button,
  input,
  select { min-height: var(--tap-target-min); }
  .auth-page { background-attachment: scroll; }
  .container { padding-block: var(--space-4); }
  .page-heading { flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-4); }
  .page-heading > .button { width: 100%; }
  .registry-heading { align-items: flex-start; }
  .registry-heading-actions { flex-wrap: wrap; }
  .issue-detail-page .pdf-actions,
  .issue-detail-page .pdf-actions .button { width: 100%; }
  .issue-detail-page .pdf-actions .button { justify-content: center; }
  .issue-detail-page .detail-grid { grid-template-columns: minmax(0, 1fr); }
  .issue-detail-page .detail-sidebar { min-width: 0; grid-column: 1; grid-row: auto; }
  .issue-detail-page .detail-grid-designer-priority .resolution-deadline-card {
    grid-column: 1;
    grid-row: 1;
  }
  .issue-detail-page .detail-grid-designer-priority .detail-main {
    grid-column: 1;
    grid-row: 2;
  }
  .issue-detail-page .detail-grid-designer-priority .assignment-reference-card {
    grid-column: 1;
    grid-row: 3;
  }
  .issue-detail-page .detail-grid-designer-priority .contact-reference-card {
    grid-column: 1;
    grid-row: 4;
  }
  .grid.two { grid-template-columns: 1fr; gap: 0; }
  .dashboard-counters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .registry-toolbar { align-items: flex-start; }
  .footer-inner { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: var(--space-4); }
  .instruction-nav { position: static; }
  .status-context-layout { grid-template-columns: 1fr; }
  dialog.modal { width: 100%; max-width: none; margin: auto 0 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
}

@media (max-width: 35rem) {
  .brand { max-width: calc(100% - 6rem); font-size: .95rem; }
  .primary-nav { grid-template-columns: 1fr; }
  .account { align-items: center; flex-direction: row; flex-wrap: nowrap; }
  .account-identity { min-width: 0; justify-content: flex-start; flex-wrap: nowrap; }
  .account-name { max-width: min(34vw, 10rem); }
  .filter-grid { grid-template-columns: 1fr; }
  .filter-grid-basic { grid-template-columns: 1fr; }
  .filter-search { grid-column: auto; }
  .filter-actions > *,
  .export-actions > *,
  .workflow-actions > * { width: 100%; text-align: center; }
  .assignment-deadline-fields { grid-template-columns: 1fr; }
  .deadline-field-grid { grid-template-columns: 1fr; }
  .issue-detail-page .deadline-change-dialog .deadline-field-grid { grid-template-columns: 1fr; }
  .dashboard-counters { grid-template-columns: 1fr; }
  .dashboard-counter { min-height: 6.5rem; }
  .registry-search > summary { width: 100%; justify-content: space-between; }
  .registry-filters { padding: var(--space-4); }
  .clipboard-preview { grid-template-columns: 3.5rem minmax(0, 1fr); }
  .clipboard-preview img,
  .clipboard-file-icon { width: 3.5rem; height: 3rem; }
  .clipboard-preview button { grid-column: 1 / -1; }
  .auth-card { padding: var(--space-5); }
  .invitation-identity div { grid-template-columns: 1fr; gap: var(--space-1); }
}

@media print {
  @page { size: A4; margin: 14mm; }
  html,
  body { min-width: 0; color: #000; background: #fff; font-size: 10.5pt; }
  .no-print,
  .print-hidden,
  .topbar,
  .footer,
  .skip-link,
  .messages,
  button { display: none !important; }
  .print-only { display: block !important; }
  .print-attachments.print-hidden,
  .print-excluded { display: none !important; }
  .container { width: 100%; max-width: none; padding: 0; }
  h1,
  h2,
  h3,
  a { color: #000 !important; }
  a { text-decoration: none !important; }
  a[href]::after { content: none !important; }
  .print-sheet,
  .print-sheet details,
  .print-sheet details > * { display: block !important; }
  .print-sheet details > summary { list-style: none; }
  .card { margin-bottom: 5mm; padding: 5mm; border: 1px solid #aaa; box-shadow: none; break-inside: avoid; }
  .supplement { break-inside: avoid; }
  .supplement-meta { color: #333; font-size: 8.5pt; }
  .supplement-text { color: #000; }
  .grid.two,
  .detail-grid { display: block; }
  .table-wrap { overflow: visible; border: 0; box-shadow: none; }
  table { min-width: 0; }
  th,
  td { padding: 2mm; color: #000; border-color: #aaa; }
  .status,
  .badge { color: #000; border-color: #777; background: #fff; }
  .print-attachments { color: #000; background: #fff; }
  .print-attachment {
    color: #000;
    background: #fff;
    text-align: left;
    break-before: page;
    break-inside: avoid;
    page-break-before: always;
    page-break-inside: avoid;
  }
  .print-attachment-meta { display: block; margin: 0 0 5mm; color: #000; line-height: 1.35; text-align: left; }
  .print-attachment-meta strong,
  .print-attachment-meta span { display: block; }
  .print-attachment img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 220mm;
    display: block;
    margin: 0;
    object-fit: contain;
    object-position: left top;
  }
  .print-non-image-files { color: #000; background: #fff; break-before: page; }
  .print-non-image-files:has(li) { display: block !important; }
  .print-non-image-files:not(:has(li)) { display: none !important; }
}
