/* Avalon website: Raleway, charcoal and orange. UI neutrals are adaptations.
   Keep business-status colors defined in base.html unchanged. */
@font-face { font-family:Raleway; font-style:normal; font-weight:400; font-display:swap; src:url('raleway-400.ttf') format('truetype'); }
@font-face { font-family:Raleway; font-style:normal; font-weight:600; font-display:swap; src:url('raleway-600.ttf') format('truetype'); }
@font-face { font-family:Raleway; font-style:normal; font-weight:700; font-display:swap; src:url('raleway-700.ttf') format('truetype'); }
:root {
  --bg: #f6f6f4; --card: #fff; --text: #222; --muted: #5e6263;
  --line: #dcdfdc; --accent: #222; --brand-orange: #e67e22;
  --accent-soft: #fff3e8; --link: #914510;
  --radius: 14px; --shadow: 0 8px 26px rgba(34,34,34,.05);
}
body { font-family: Raleway, Arial, sans-serif; line-height: 1.5; }
button, input, select, textarea { font-family: inherit; }
a { color: var(--link); }
h1, h2, h3 { color: var(--text); }
.utility-bar { color: #fff; background: #222; border-top: 4px solid var(--brand-orange); }
.utility-inner, .topbar, .app { width: min(1800px, calc(100% - 48px)); margin: 0 auto; }
.utility-inner { display:flex; justify-content:space-between; gap:12px; padding:9px 0; font-size:12px; letter-spacing:.04em; }
.topbar { padding:24px 0; margin-bottom:28px; border-bottom:3px solid var(--brand-orange); gap:24px; }
.brand { display:flex; align-items:center; gap:24px; min-width:0; }
.brand-mark { display:block; width:250px; max-width:100%; height:auto; padding:14px 18px; background:#222; border-radius:6px; }
.brand-copy h1 { font-size:clamp(24px,2.3vw,34px); line-height:1.2; font-weight:700; }
.brand-copy p { font-size:14px; color:var(--muted); }
.app { padding:0 0 32px; }
.nav { align-items:center; }
.menu { position:relative; }
.menu > summary { cursor:pointer; border:1px solid #222; background:#222; color:#fff; border-radius:8px; padding:10px 20px; font-size:14px; font-weight:700; }
.menu-panel { position:absolute; right:0; top:calc(100% + 8px); width:290px; max-width:calc(100vw - 48px); display:grid; gap:8px; padding:12px; z-index:50; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 12px 30px #0002; }
.menu-panel a, .menu-panel button { width:100%; text-align:left; margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:8px; background:#f7f7f5; color:#222; font-size:14px; overflow-wrap:anywhere; }
.menu-panel a:hover, .menu-panel button:hover { background:var(--accent-soft); border-color:var(--brand-orange); }
.card { border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); min-width:0; }
.card h2 { font-size:21px; line-height:1.3; }
.card .card { box-shadow:none; }
.field { border-radius:10px; min-width:0; }
.field:not(.tone-high):not(.tone-medium):not(.tone-low) { background:#fbfcfa; }
.label { font-weight:600; letter-spacing:.06em; }
.value { font-size:14px; }
.btn, button.btn { border:1px solid transparent; padding:10px 14px; font-weight:600; font-size:14px; line-height:1.4; }
.btn.primary { background:#222; color:#fff; border-color:#222; }
.btn.primary:hover { background:#444; }
.btn.secondary { background:#fff; border-color:#b6bab7; color:#222; }
.btn.secondary:hover { background:var(--accent-soft); border-color:var(--brand-orange); }
.btn.ghost { background:#f0f1ee; color:#343837; }
button:disabled { opacity:.65; cursor:not-allowed; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible { outline:3px solid #914510; outline-offset:3px; }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea { width:100%; min-width:0; border:1px solid #b6bab7; border-radius:8px; padding:10px 12px; font:inherit; font-size:14px; background:#fff; color:#222; }
.grid { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); }
.stack, .summary-grid, .split, .grid > * { min-width:0; }
th, td { padding:12px; font-size:13px; }
th { font-size:11px; background:#f7f7f4; letter-spacing:.06em; }
.table-scroll { width:100%; overflow-x:auto; }
.table-scroll > table { min-width:720px; }
.login-layout { display:grid; grid-template-columns:minmax(0,440px) minmax(0,1fr); gap:24px; max-width:1080px; margin:36px auto; }
.login-card { padding:30px; }
.login-card h2 { font-size:28px; margin:10px 0 12px; }
.login-card p { margin:0 0 24px; }
.login-card .label { display:block; }
.login-intro { background:#222; color:#fff; border-color:#222; padding:36px; display:flex; flex-direction:column; justify-content:space-between; gap:32px; border-top:4px solid var(--brand-orange); }
.login-intro h2 { color:#fff; font-size:32px; max-width:440px; margin:14px 0; }
.login-intro p { color:#e4e4df; }
.login-intro .eyebrow { color:#f3b27a; text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:700; }
.workflow-list { padding:0; margin:0; list-style:none; }
.workflow-list li { padding:12px 0; border-top:1px solid #ffffff30; }
.workflow-list strong { display:block; color:#fff; }
.workflow-list span { color:#deded8; font-size:14px; }
.environment-note { font-size:13px; border-left:3px solid var(--brand-orange); padding:8px 12px; background:var(--accent-soft); color:#654021; margin-bottom:20px; }
@media (max-width:980px) {
  .topbar { flex-direction:row; align-items:center; }
  .brand { gap:16px; }
  .brand-mark { width:200px; }
  .brand-copy p { max-width:300px; }
  .grid, .summary-grid, .split { grid-template-columns:minmax(0,1fr); }
  .split-review { grid-template-columns:minmax(0,1fr); grid-template-areas:"review" "pdf"; }
  .split-review.pdf-hidden { grid-template-areas:"review"; }
  .login-layout { grid-template-columns:minmax(0,1fr); max-width:620px; }
}
@media (max-width:640px) {
  .utility-inner, .topbar, .app { width:calc(100% - 32px); }
  .utility-inner { font-size:11px; flex-wrap:wrap; }
  .topbar { align-items:flex-start; padding:20px 0; margin-bottom:20px; gap:12px; }
  .brand { flex-direction:column; align-items:flex-start; gap:14px; }
  .brand-mark { width:190px; }
  .brand-copy h1 { font-size:25px; }
  .brand-copy p { font-size:12px; }
  .menu > summary { padding:9px 12px; }
  .card { padding:16px; }
  .login-layout { margin:20px auto; gap:16px; }
  .login-card, .login-intro { padding:24px; }
  .login-intro h2 { font-size:28px; }
  .toggle-row { gap:12px; flex-wrap:wrap; }
  .responsive-grid { grid-template-columns:minmax(0,1fr) !important; }
  .queue-search { min-width:0 !important; flex-basis:100% !important; }
  .app p, .app .muted { overflow-wrap:anywhere; }
}