:root {
  --color-background: #f5f6f4;
  --color-surface: #ffffff;
  --color-surface-subtle: #eef1ed;
  --color-text-primary: #1d211f;
  --color-text-secondary: #515955;
  --color-text-muted: #747c77;
  --color-border: #dce1dd;
  --color-border-strong: #b7c0ba;
  --color-brand: #176b5b;
  --color-brand-hover: #105a4c;
  --color-brand-soft: #e2f0eb;
  --color-success: #287a4b;
  --color-warning: #9a6415;
  --color-danger: #b13b36;
  --color-info: #3e6479;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --radius-small: 4px; --radius-control: 6px; --radius-container: 8px;
  --content-width: 1120px; --form-width: 440px; --nav-height: 60px;
}
* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; min-height: 100vh; background: var(--color-background); color: var(--color-text-primary); font: 15px/1.55 var(--font-sans); letter-spacing: 0; }
a { color: var(--color-brand); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--color-brand-hover); }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
button, a, input, select, textarea { outline-offset: 2px; }
:focus-visible { outline: 3px solid rgba(23, 107, 91, .26); }
.skip-link { position: fixed; left: 12px; top: -50px; z-index: 20; background: var(--color-surface); padding: 8px 12px; border: 1px solid var(--color-border-strong); }
.skip-link:focus { top: 12px; }
.topbar { height: var(--nav-height); border-bottom: 1px solid var(--color-border); background: rgba(255,255,255,.96); }
.topbar-inner { width: min(var(--content-width), calc(100% - 40px)); height: 100%; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.brand { display: flex; align-items: center; gap: 10px; color: var(--color-text-primary); text-decoration: none; font-weight: 720; }
.brand-mark { width: 27px; height: 27px; display: grid; place-items: center; border-radius: var(--radius-small); color: #fff; background: var(--color-brand); font-size: 13px; }
.nav-links { display: flex; align-items: center; gap: 6px; }
.nav-links a { color: var(--color-text-secondary); text-decoration: none; padding: 7px 10px; border-radius: var(--radius-control); }
.nav-links a[aria-current="page"], .nav-links a:hover { color: var(--color-text-primary); background: var(--color-surface-subtle); }
.page { width: min(var(--content-width), calc(100% - 40px)); margin: 0 auto; padding: var(--space-8) 0 var(--space-10); }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-5); padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-border); margin-bottom: var(--space-6); }
.eyebrow { margin: 0 0 4px; color: var(--color-text-muted); font-size: 13px; font-weight: 650; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 4px; font-size: 27px; line-height: 1.25; font-weight: 720; }
h2 { margin-bottom: var(--space-3); font-size: 18px; line-height: 1.35; }
h3 { margin-bottom: var(--space-2); font-size: 15px; }
.lead { margin: 0; color: var(--color-text-secondary); }
.auth-shell { min-height: calc(100vh - var(--nav-height)); display: grid; place-items: start center; padding: 9vh 20px 48px; }
.auth-panel { width: min(100%, var(--form-width)); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-container); padding: 28px; }
.auth-heading { margin-bottom: var(--space-6); }
.auth-heading h1 { font-size: 24px; }
.auth-footer { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--color-border); color: var(--color-text-secondary); }
.field { display: grid; gap: 6px; margin-bottom: var(--space-4); }
.field label { font-weight: 650; font-size: 14px; }
.field-help { color: var(--color-text-muted); font-size: 13px; }
input, select, textarea { width: 100%; min-height: 42px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-control); color: var(--color-text-primary); background: var(--color-surface); padding: 9px 11px; }
input:hover, select:hover, textarea:hover { border-color: #89958d; }
input:focus, select:focus, textarea:focus { border-color: var(--color-brand); outline: 3px solid rgba(23,107,91,.13); }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.button { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid transparent; border-radius: var(--radius-control); padding: 8px 14px; color: #fff; background: var(--color-brand); font-weight: 680; text-decoration: none; cursor: pointer; }
.button:hover { color: #fff; background: var(--color-brand-hover); }
.button.secondary { color: var(--color-text-primary); background: var(--color-surface); border-color: var(--color-border-strong); }
.button.secondary:hover { color: var(--color-text-primary); background: var(--color-surface-subtle); }
.button.danger { color: var(--color-danger); background: var(--color-surface); border-color: #e3b7b4; }
.button.danger:hover { background: #fbefee; }
.button:disabled { opacity: .55; cursor: not-allowed; }
.button.full { width: 100%; }
.message { min-height: 0; margin: 0 0 var(--space-4); padding: 10px 12px; border-left: 3px solid var(--color-info); background: #eef3f5; color: #294956; }
.message:empty { display: none; }
.message.error { border-color: var(--color-danger); background: #fbefee; color: #7c2824; }
.message.success { border-color: var(--color-success); background: #ecf5ef; color: #235e3b; }
.status { display: inline-flex; align-items: center; min-height: 25px; padding: 2px 8px; border-radius: var(--radius-small); background: var(--color-surface-subtle); color: var(--color-text-secondary); font-size: 13px; font-weight: 650; }
.status.success { color: #235e3b; background: #e5f2e9; }
.status.warning { color: #70480d; background: #f8efd9; }
.status.danger { color: #812b27; background: #f8e8e7; }
.grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--space-6); }
.main-column { grid-column: span 8; }
.side-column { grid-column: span 4; }
.section { padding: var(--space-5) 0; border-bottom: 1px solid var(--color-border); }
.section:first-child { padding-top: 0; }
.section:last-child { border-bottom: 0; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-3); }
.definition-list { display: grid; grid-template-columns: 150px minmax(0,1fr); margin: 0; }
.definition-list dt, .definition-list dd { margin: 0; padding: 11px 0; border-bottom: 1px solid var(--color-border); }
.definition-list dt { color: var(--color-text-muted); }
.list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-border); }
.list-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.list-item-main { min-width: 0; }
.list-item-main strong { display: block; }
.list-item-main small { color: var(--color-text-muted); overflow-wrap: anywhere; }
.empty { padding: 36px 0; color: var(--color-text-muted); text-align: center; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.danger-zone { border-top: 1px solid #e3b7b4; padding-top: var(--space-5); }
.hidden { display: none !important; }
.muted { color: var(--color-text-muted); }
.loading { color: var(--color-text-muted); }
@media (max-width: 760px) {
  .topbar-inner, .page { width: min(100% - 24px, var(--content-width)); }
  .nav-links a:not(.always) { display: none; }
  .auth-shell { padding: 28px 12px; align-items: start; }
  .auth-panel { padding: 22px 18px; }
  .page { padding-top: 22px; }
  .page-header { align-items: flex-start; flex-direction: column; }
  .main-column, .side-column { grid-column: 1 / -1; }
  .definition-list { grid-template-columns: 1fr; }
  .definition-list dt { padding-bottom: 0; border-bottom: 0; }
  .definition-list dd { padding-top: 3px; }
  .list-item { align-items: flex-start; flex-direction: column; }
  .list-item .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }