:root {
  --color-teal: #0ca678;
  --color-teal-dark: #087f5b;
  --color-teal-pale: #e6fcf5;
  --color-azure: #4299e1;
  --color-azure-dark: #2176b9;
  --color-azure-pale: #ebf5ff;
  --color-pink: #d6336c;
  --color-pink-dark: #a61e4d;
  --color-green: #2fb344;
  --color-green-dark: #248f36;
  --color-warning: #f59f00;
  --color-danger: #d63939;
  --color-info: #4299e1;
  --color-text: #182433;
  --color-text-soft: #334155;
  --color-muted: #667382;
  --color-border: #dce3e9;
  --color-border-strong: #c7d1db;
  --color-surface: #ffffff;
  --color-row-even: #f7fcf8;
  --color-row-hover: #eaf7ee;
  --color-page: #ffffff;
  --shadow-card: 0 1px 2px rgba(24, 36, 51, .04), 0 5px 18px rgba(24, 36, 51, .06);
  --shadow-raised: 0 12px 32px rgba(24, 36, 51, .12);
  --radius-sm: .375rem;
  --radius: .625rem;
  --radius-lg: .875rem;
  --focus-ring: 0 0 0 3px rgba(66, 153, 225, .32);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --content-width: 90rem;
  --form-width: 52rem;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  color: var(--color-text);
  background: var(--color-page);
  font-size: 16px;
  line-height: 1.5;
}

*,
*::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;
}
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: #fff;
  background: var(--color-teal);
  box-shadow: 0 2px 8px rgba(8, 127, 91, .18);
}
.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: 4rem;
  display: flex;
  align-items: center;
  gap: var(--space-6);
}
.brand {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.brand:hover { color: #fff; text-decoration: none; }
.brand-mark {
  flex: 0 0 auto;
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  color: var(--color-teal-dark);
  background: #fff;
  border-radius: var(--radius-sm);
  font-size: .75rem;
  letter-spacing: .03em;
}
.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: 2.5rem;
  display: inline-flex;
  align-items: center;
  padding: .5rem .7rem;
  color: #fff;
  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: #fff;
  background: rgba(255, 255, 255, .16);
  text-decoration: none;
}
.primary-nav a[aria-current="page"] { box-shadow: inset 0 -2px #fff; }
.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 {
  color: #fff;
  background: var(--color-pink);
  border-color: var(--color-pink);
}
.primary-nav .complaint-button:hover,
.primary-nav .complaint-button:focus-visible {
  color: #fff;
  background: var(--color-pink-dark);
}
.account { margin-left: auto; }
.account-identity { gap: var(--space-2); }
.account-name {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .875rem;
}
.account form { display: inline-flex; margin: 0; }
.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: #fff;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: var(--radius-sm);
  background: transparent;
  font-weight: 700;
}
.role-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: .15rem .55rem;
  color: var(--color-teal-dark);
  background: #fff;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
}

.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: clamp(1.65rem, 3vw, 2.15rem); }
h2 { margin: 0 0 var(--space-3); font-size: clamp(1.15rem, 2vw, 1.35rem); }
h3 { margin: var(--space-4) 0 var(--space-2); font-size: 1.05rem; }
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: 2.65rem;
  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: #fff !important;
  border-color: var(--color-pink) !important;
  background: var(--color-pink) !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: 2.75rem;
  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;
}
.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-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; }
.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;
}
.issue-register { min-width: 67rem; table-layout: auto; }
.issue-register .issue-number-column { width: 1%; min-width: 4.4rem; white-space: nowrap; text-align: center; }
.issue-register .issue-date-column { width: 1%; min-width: 5.6rem; white-space: nowrap; }
.issue-register .issue-author-column { width: 1%; min-width: 8rem; max-width: 12rem; }
.issue-register .issue-description-column { width: 30%; min-width: 15rem; }
.issue-register .issue-days-column {
  width: 1%;
  min-width: 4.75rem;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
  text-align: center;
}
.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: 1.65rem;
  padding: .2rem .55rem;
  color: #355268;
  border: 1px solid #bfd4e3;
  border-radius: 999px;
  background: #eef7fc;
  font-size: .78rem;
  font-weight: 700;
  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: ""; }
.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: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; }
.detail-sidebar .card { padding: var(--space-5); }
.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);
}
.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); }

.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,
  .account { align-items: stretch; }
  .primary-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-nav a { justify-content: flex-start; }
  .account { 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; }
}

@media (max-width: 48rem) {
  .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%; }
  .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; }
}

@media (max-width: 35rem) {
  .brand { max-width: calc(100% - 6rem); font-size: .95rem; }
  .primary-nav { grid-template-columns: 1fr; }
  .account { align-items: stretch; flex-direction: column; }
  .account-identity { justify-content: space-between; }
  .account-name { max-width: 58vw; }
  .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; }
  .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; }
}