:root{--navy:#0D3B66;--teal:#0097A7;--ink:#172433;--muted:#597080;--line:#d9e2e8;--bg:#f5f8fa}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px system-ui,sans-serif}.site-header{background:var(--navy);color:#fff;padding:1rem max(1rem,calc((100% - 1100px)/2));display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap}.brand{display:grid}.brand a{color:#fff;font-size:1.2rem;font-weight:700;text-decoration:none}.brand span{font-size:.8rem;opacity:.8}.site-header nav{display:flex;gap:.9rem;flex-wrap:wrap;flex:1}.site-header nav a{color:#fff;text-decoration:none}.logout{margin:0}.logout button{background:transparent;border:1px solid #fff}main{max-width:1100px;margin:auto;padding:1.5rem;min-width:0}.page-heading{display:flex;justify-content:space-between;gap:1rem;align-items:center}.page-heading h1{margin:.1rem 0}.page-heading p{color:var(--muted)}.button,button{display:inline-block;background:var(--teal);color:#fff;text-decoration:none;border:0;border-radius:.35rem;padding:.55rem .8rem;font:inherit;cursor:pointer}.quick-actions{display:flex;gap:.5rem;flex-wrap:wrap}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.panel,.card,.auth-card{background:#fff;border:1px solid var(--line);border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;min-width:0}.panel h2{font-size:1rem;margin-top:0;color:var(--navy)}.panel ul{list-style:none;padding:0;margin:0}.panel li{padding:.55rem 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:.5rem}.urgent{border-left:4px solid #cc5b20}time{color:var(--muted);font-size:.9rem}form{display:grid;gap:.7rem;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:1rem}label{display:grid;gap:.3rem;min-width:0}input,select,textarea{border:1px solid #aabac5;border-radius:.3rem;padding:.55rem;font:inherit;max-width:100%;min-width:0}textarea{min-height:5rem}.filters{display:flex;flex-wrap:wrap;gap:1rem;align-items:end;margin:1rem 0}.filters label{flex:1 1 12rem;min-width:0}.filters button{flex:0 0 auto}.auth-card{max-width:440px;margin:8vh auto}.auth-card form{grid-template-columns:1fr}.error{color:#9d1b16;font-weight:600}#message{min-height:1.3rem;color:var(--navy)}@media(max-width:700px){.site-header{align-items:flex-start}.site-header nav{order:3;flex-basis:100%}.dashboard-grid{grid-template-columns:1fr}.page-heading{align-items:flex-start;flex-direction:column}.filters,form{flex-direction:column;display:flex}.filters label,.filters button{width:100%;flex-basis:auto}}

/* Space reserved for a future fixed header when a panel is brought into view. */
#editor { scroll-margin-top: 5.5rem; }
#editor [tabindex="-1"] { outline-offset: .25rem; }

button:disabled,
button[aria-disabled="true"] {
  background: #8b99a5;
  color: #eef3f6;
  cursor: not-allowed;
  opacity: 1;
}

#confirm-import:disabled,
#confirm-import.is-disabled,
#confirm-import[aria-disabled="true"] {
  background-color: #657582 !important;
  background-image: none !important;
  border-color: #657582 !important;
  color: #ffffff !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  box-shadow: none !important;
}


/* Shared workbench controls: compact, aligned choices and separated actions. */
.actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  margin-top: .85rem;
}
.actions button,
.actions .button { margin: 0; }

form fieldset {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  min-width: 0;
  margin: 0;
  padding: .65rem .75rem .75rem;
  border: 1px solid var(--line);
  border-radius: .35rem;
}
form fieldset legend {
  padding: 0 .25rem;
  color: var(--navy);
  font-weight: 600;
}
label.check {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  width: auto;
  min-width: 0;
  cursor: pointer;
}
input[type="checkbox"],
input[type="radio"] {
  appearance: auto;
  inline-size: 1rem;
  block-size: 1rem;
  min-inline-size: 1rem;
  min-block-size: 1rem;
  margin: 0;
  padding: 0;
  accent-color: var(--teal);
  flex: 0 0 auto;
}
@media(max-width:700px) {
  form fieldset { display: flex; }
  label.check { width: auto; }
}

.account-card{max-width:640px;margin:2rem auto}.account-card form{grid-template-columns:1fr}.account-email{font-weight:600;overflow-wrap:anywhere}.notice{color:#075f68;font-weight:600}
