[hidden] { display: none !important; }  /* so `hidden` wins over display: flex etc. */
body { font-family: system-ui, sans-serif; max-width: 1100px; margin: 32px auto; padding: 0 16px; background: #fff; color: #111; }
header { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-bottom: 2px solid #333; }
h1 { margin: 0 0 4px; }
h2, h3 { margin: 0; }
.loaded { color: #555; margin: 0 0 8px; font-size: 0.9rem; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
button { font-size: 0.95rem; padding: 8px 16px; cursor: pointer; }
button.secondary { background: none; border: 1px solid #999; border-radius: 4px; }
button:disabled { opacity: 0.5; cursor: not-allowed; }
button.link { background: none; border: none; padding: 2px 4px; color: #2f6fed; font-size: 0.85rem; }
button.danger { background: none; border: 1px solid #cf222e; color: #cf222e; border-radius: 4px; }
button.danger[data-armed="1"] { background: #cf222e; color: #fff; }
.status { white-space: pre-wrap; font-size: 0.9rem; }
.status:empty { display: none; }
.ok { color: #1a7f37; }
.err { color: #cf222e; }
.muted { color: #666; font-size: 0.9rem; }
.spacer { flex: 1; }
.toggle { font-size: 0.9rem; color: #555; }

/* ---------- sign-in ---------- */
.splash { max-width: 26rem; margin: 8vh auto 0; text-align: center; }
.splash-logo { display: block; margin: 0 auto 12px; }
.splash h1 { margin-bottom: 8px; }
.splash-buttons { display: flex; flex-direction: column; gap: 10px; margin: 24px 0 12px; }
.splash-buttons button { padding: 10px 16px; }
.splash-foot { margin-top: 16px; }
.who { color: #555; font-size: 0.9rem; }

/* "There is missing general information for this week…" (app.js renderMissingGeneral) */
.general-missing { margin: 0 0 10px; padding: 8px 12px; background: #fff8e1; border: 1px solid #f0c36d; border-radius: 6px; font-size: 0.95rem; }
.general-missing a { font-weight: 600; }

/* ---------- week buttons ---------- */
.weeks { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
button.week-btn { font-size: 0.9rem; padding: 5px 14px; background: #fff; border: 1px solid #999; border-radius: 4px; font-variant-numeric: tabular-nums; }
button.week-btn.current { border: 2px solid #2f6fed; }                  /* this week */
button.week-btn.selected { background: #e8efff; font-weight: 600; }     /* the week shown */
/* Site Admin › History: the weeks under a heading per year. */
.week-year h3 { margin: 10px 0 0; font-size: 1rem; }
.week-year .weeks { margin-top: 6px; }
#weeks.weeks-history { display: block; }

/* ---------- day block ---------- */
.day { margin-top: 24px; }
#days > .day { border: 2px solid #ccc; border-radius: 6px; padding: 6px 12px 12px; }  /* gray box around each day */
#days > .day:has(> .day-body[hidden]) { padding-bottom: 6px; }  /* collapsed: as much space under the date as above it */
#days > .day:has(> .day-body[hidden]) > .day-head { padding-bottom: 0; }
#days > .day.today { border-color: #2f6fed; }                                        /* today: blue box */
.day-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-bottom: 4px; }
.day-head h2 { font-size: 1.5rem; }
button.day-toggle { font-size: inherit; font-weight: 700; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; text-align: left; }
/* Smaller buttons for day and General actions (Add sim, Add meeting, Edit). */
.day-head .actions { margin-bottom: 0; }
.day-body > .table-wrap:first-child table { margin-top: 4px; }  /* sims table close under the day's heading */
.day-head .actions button, .general-head button.secondary { font-size: 0.85rem; padding: 5px 12px; }
.day-head .actions button.day-btn { background: #eef0f2; }   /* + Sim, + Mtg, feedback, Download / Distribute */
.day-head .actions button.day-btn:hover:not(:disabled) { background: #e2e6ea; }
.day-note { font-size: 0.95rem; font-weight: normal; color: #555; }
.meetings { margin-top: 4px; }  /* just under the sims */
.meetings table { margin-top: 0; }

/* ---------- tables ---------- */
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; margin-top: 10px; font-size: 0.9rem; }
th, td { border: 1px solid #ccc; padding: 5px 9px; text-align: left; vertical-align: top; }
th { background: #f3f3f3; }
td .line { display: block; }
td.empty { text-align: center; padding: 12px; }
.line.mission { font-weight: 600; }
.line.people { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; }
.line.links { margin-top: 4px; white-space: nowrap; }
.line.links button.link { padding: 0 2px; }
.line.links button.link[data-armed="1"] { color: #cf222e; font-weight: 600; }
table.sims td:nth-child(1), table.sims td:nth-child(2), table.sims td:nth-child(5) { white-space: nowrap; }
tr.cancelled td, tr.deleted td { text-decoration: line-through; color: #999; }
/* The row's strike-through can't be switched off on a child, but it doesn't reach inline-blocks. */
tr.cancelled .line.links, tr.deleted .line.links { display: inline-block; }
tr.conflict td { background: #fff0f0; }
tr.conflict-msg td { background: #ffe0e0; color: #a4161a; font-weight: 600; border-top: 2px solid #cf222e; }
.conflict-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-top: 4px; }
button.resolve { font-size: 0.8rem; padding: 3px 10px; background: #fff; border: 1px solid #cf222e; color: #a4161a; border-radius: 4px; font-weight: normal; }
button.resolve:hover:not(:disabled) { background: #cf222e; color: #fff; }
tr.placeholder-msg td { background: #fff3cd; color: #5c4400; font-weight: 600; border-top: 2px solid #e0a800; }
tr.placeholder-msg button.resolve { border-color: #e0a800; color: #5c4400; }
tr.placeholder-msg button.resolve:hover { background: #e0a800; color: #fff; }

/* ---------- bubbles (tags); CIP colors come from config.js ---------- */
.tag { display: inline-block; font-size: 0.72rem; line-height: 1.4; padding: 0 7px; border-radius: 10px; margin-left: 6px; vertical-align: middle; font-weight: normal; text-decoration: none; }
.tag.cip { margin-left: 0; font-weight: 600; }
.tag.academics { background: #fff3cd; color: #7a5a00; }
.tag.inst { background: #333; color: #fff; font-weight: 700; margin-left: 4px; letter-spacing: 0.03em; }
/* A CIP acting as the instructor (app.js person; since 2026-10-18): one bubble, the name in their color, then CIP / CIW in white on black. */
.tag.cip-inst { padding: 0; overflow: hidden; display: inline-flex; }
.tag.cip-inst > span { padding: 0 7px; }
.tag.cip-inst .cip-inst-name { border: 0; }
.tag.cip-inst .cip-inst-role { background: #111; color: #fff; font-weight: 700; letter-spacing: 0.03em; }
.tag.manual { background: #eee; color: #444; }
.tag.absent { background: #ffe0e0; color: #a4161a; }
.tag.absent.status-PTO { background: #dbeafe; color: #1e4fa3; }  /* Leave / PTO / TDY list: PTO blue, TDY amber */
.tag.absent.status-TDY { background: #fdecc8; color: #8a4b00; }

/* ---------- general section ---------- */
.general-section { margin-top: 16px; }
.general-empty { font-size: 1rem; color: #666; padding: 4px 0; }
.sim-period-moved { color: #d32f2f; font-weight: 600; margin: 6px 0 4px; }
.general-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
button.disclosure { background: none; border: none; padding: 4px 0; color: inherit; cursor: pointer; }
button.disclosure .arrow { display: inline-block; width: 1em; }
button.general-toggle { font-size: 1rem; font-weight: 500; color: #666; }
.cip-absent td { color: #999; }
/* General info: one Scheduler | Standby line (as on AF Week), then the Scheduling bars. */
.general-body { margin-top: 5px; }
.duty-row { display: flex; flex-wrap: wrap; align-items: stretch; font-size: 0.88rem; margin-bottom: 10px; padding: 4px 10px; background: #eef0f2; border-radius: 4px; }
.duty-cell { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-left: 1px solid #ccd3da; }
.duty-cell:first-child { border-left: none; padding-left: 0; }
.duty-key { font-weight: 600; color: #444; }
.duty-key:not(:first-child) { margin-left: 10px; }
.duty-time { font-variant-numeric: tabular-nums; color: #555; }
.duty-row .head-link { align-self: center; margin-left: 14px; font-size: 0.8rem; }
/* The ▾ that hides the general information starts the gray line; Edit general info ends it. */
/* Collapsed: a small line and a small button. */
button.general-toggle.general-closed { font-size: 0.85rem; padding: 2px 0; }
.general-head:has(.general-closed) > button.secondary { font-size: 0.8rem; padding: 2px 10px; }
.duty-row .duty-arrow { display: inline-flex; align-items: center; gap: 4px; padding: 0 6px 0 0; font-size: 1rem; }
.duty-row .duty-arrow + .duty-cell { border-left: none; padding-left: 0; }
.duty-row > button.secondary { align-self: center; margin-left: 12px; font-size: 0.8rem; padding: 3px 10px; background: #fff; }
/* AF Week (afweek.js): the "squadron board", the whole week in one dense upper-case table with a dark bar per day. */
table.af-board { margin-top: 14px; font-family: "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif; font-size: 0.88rem; text-transform: uppercase; }
.af-board th { background: #24303d; color: #fff; font-size: 0.75rem; letter-spacing: 0.08em; border-color: #24303d; padding: 4px 8px; }
.af-board td { padding: 3px 8px; border-color: #d4d9de; }
.af-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.af-sub { color: #666; font-size: 0.78rem; }
.af-msn { font-weight: 700; }
.af-ios { color: #555; }
.af-rmk { color: #444; font-size: 0.8rem; max-width: 260px; }
.af-board tr.af-bar td { background: #3b4a5a; color: #fff; padding: 5px 8px; border-color: #3b4a5a; }
.af-board tr.af-bar.today td { background: #2f6fed; border-color: #2f6fed; }
.af-bar-in { display: flex; flex-wrap: wrap; gap: 14px; align-items: baseline; }
.af-date { font-weight: 700; font-size: 1rem; letter-spacing: 0.04em; }
.af-daynote { opacity: 0.85; }
.af-duty { font-variant-numeric: tabular-nums; white-space: pre-wrap; }
.af-key { opacity: 0.7; }
.af-mtg td { background: #fff8dc; }
.af-empty { text-align: center; color: #888; padding: 8px; }
.af-board tbody tr:not(.af-bar):hover td { background: #f3f6fa; }
/* Scheduling bars (sched-bars.js; admin and sim-instructors): below the rest of General information */
.warn-tri { width: 1.05em; height: 0.95em; margin-left: 8px; vertical-align: -0.1em; }
.sched-bars { grid-column: 1 / -1; margin-top: 6px; overflow-x: auto; }
.sb-chart { min-width: 560px; padding-right: 14px; }
.sb-row { display: grid; grid-template-columns: 124px 1fr; align-items: center; gap: 8px; margin-bottom: 4px; }
.sb-track { position: relative; height: 24px; background: #f4f6f8; border-radius: 3px; }
.sb-axis .sb-track { height: 16px; background: none; }
.sb-hour { position: absolute; transform: translateX(-50%); font-size: 0.72rem; color: #6b7785; font-variant-numeric: tabular-nums; }
.sb-grid { position: absolute; top: 0; bottom: 0; width: 1px; background: #e2e6ea; }
.sb-track > div { position: absolute; top: 0; bottom: 0; box-sizing: border-box; overflow: hidden; white-space: nowrap; font-size: 0.68rem; line-height: 24px; text-align: center; }
.sb-duty { background: #dcefdc; border: 1px solid #9bc89b; border-radius: 3px; }
.sb-absent { background: repeating-linear-gradient(45deg, #e9e9e9 0 6px, #f6f6f6 6px 12px); color: #777; border-radius: 3px; }
.sb-block { top: 3px !important; bottom: 3px !important; line-height: 18px !important; border-radius: 3px; color: #fff; }
.sb-brief { background: #5b8fd9; }
.sb-sim { background: #1f3f73; }
.sb-ios { background: #0f7c7c; }
.sb-debrief { background: #8a6bbf; }
.sb-meeting { background: #c98a12; }
.sb-standby { background: #fff; border: 1px dashed #7a8592; color: #4a5562 !important; }
.sb-block.sb-standby { top: 0 !important; bottom: 0 !important; line-height: 22px !important; }  /* the lowest layer, a little taller so it shows around an event on top */
.sb-unavailable { background: #7d858f; container-type: inline-size; }
/* "Unavailable" when it fits, else "Unavail", else just the gray. */
.sb-unavailable > span { display: none; }
@container (min-width: 64px) { .sb-unavailable > .sb-u-long { display: inline; } }
@container (min-width: 40px) and (max-width: 63.98px) { .sb-unavailable > .sb-u-short { display: inline; } }
/* The label: name bubble, then duty hours ("10-18") or status ("TDY"). */
.sb-label { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.sb-hours { font-size: 0.78rem; color: #444; font-variant-numeric: tabular-nums; }
.sb-hours.sb-away { font-weight: 600; color: #8a4b00; cursor: help; }
/* Cockpits and Rooms: how many are in use at once. */
.sb-row.sb-cockpits { margin-top: 10px; }  /* a little apart from the CIPs */
.sb-load-label { font-size: 0.82rem; font-weight: 600; color: #444; }
.sb-load { top: 3px !important; bottom: 3px !important; line-height: 18px !important; border-radius: 3px; font-weight: 700; font-size: 0.74rem !important; }
.sb-cp-1, .sb-rm-1 { background: #fbf1c7; color: #6b5300; }
.sb-cp-2, .sb-rm-2 { background: #f3dc8a; color: #5c4700; }
.sb-cp-3 { background: #e2bd45; color: #3d2f00; }
.sb-cp-4 { background: #b8901a; color: #fff; }
.sb-rm-full { background: #d32f2f; color: #fff; }
.sb-rm-over { background: #111; color: #fff; }
.sb-cp-over { background: repeating-linear-gradient(45deg, #d32f2f 0 5px, #111 5px 10px); color: #fff; text-shadow: 0 0 3px #000, 0 0 2px #000; }
.sb-track > .sb-over-tri { position: absolute; top: -11px; transform: translateX(-50%); z-index: 3; line-height: 0; }
.sb-over-tri .warn-tri { margin: 0; width: 15px; height: 14px; filter: drop-shadow(0 0 1px #fff); }
.sb-clash { background: repeating-linear-gradient(45deg, #d32f2f 0 5px, #111 5px 10px); opacity: 0.88; border: 1px solid #d32f2f; z-index: 2; }
.sb-row.has-clash .sb-label .tag { box-shadow: 0 0 0 2px #d32f2f; }
.sb-conflicts { margin: 6px 0 0 132px; padding-left: 18px; font-size: 0.82rem; color: #a4161a; }
.sb-conflicts li { margin: 2px 0; }
.subhead { font-size: 1rem; margin-top: 16px; }

/* ---------- dialogs ---------- */
dialog { border: 1px solid #999; border-radius: 6px; padding: 16px 20px; max-width: calc(100vw - 32px); }
dialog::backdrop { background: rgb(0 0 0 / 0.35); }
dialog input { font-size: 0.95rem; padding: 6px 8px; max-width: 100%; box-sizing: border-box; }
dialog.editor { width: 820px; }
dialog.editor.narrow { width: 520px; }
dialog.editor h2 { margin-top: 0; }
dialog.editor form > * + * { margin-top: 12px; }
.dialog-actions { justify-content: flex-end; margin: 14px 0 0; }
.field { display: flex; flex-direction: column; gap: 4px; font-size: 0.9rem; font-weight: 600; }
.field input { font-weight: normal; }
.field input[type="text"], .field textarea { font-size: 0.95rem; padding: 6px 8px; box-sizing: border-box; width: 100%; }
.field-row { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.field-row .field input { width: auto; }
fieldset.field { border: 1px solid #ccc; border-radius: 4px; padding: 6px 10px 8px; margin-inline: 0; }
fieldset.field legend { padding: 0 4px; }
.check { display: inline-flex; align-items: center; gap: 4px; font-size: 0.9rem; font-weight: normal; }
.check-list { display: flex; flex-wrap: wrap; gap: 6px 14px; }
input:invalid:not(:disabled):not(:placeholder-shown) { border-color: #cf222e; }
.edit-table td { vertical-align: middle; }
.edit-table th { font-weight: 600; }
.edit-table tbody th { background: #f3f3f3; text-align: left; }
.edit-table input, .edit-table select { font-size: 0.9rem; padding: 4px 6px; }
.edit-table input:invalid:not(:disabled) { border-color: #cf222e; }
.edit-table .check-list { gap: 4px 10px; }
.edit-table input.others { display: block; margin-top: 4px; width: 100%; }
input.num { width: 3.5em; }
.cip-name { font-weight: 600; }
.hours { white-space: nowrap; }
.away-range { margin-left: 4px; font-variant-numeric: tabular-nums; }
.cip-absent td .away-range { color: #333; }  /* the dates matter; keep them readable in a greyed row */
.instructor-line { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 0.85rem; font-weight: normal; }
.instructor-pick { font-size: 0.85rem; padding: 2px 4px; }
.ios-instructors { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; }
.ios-instructors label { display: inline-flex; align-items: center; gap: 3px; font-weight: normal; }
td.center { text-align: center; }

/* The schedule page's Edit sim / Edit meeting / General windows (2026-10-19): tighter spacing,
   smaller inputs and buttons, narrow time and room boxes so a phase's CIP ticks stay on one line. */
dialog.compact { padding: 10px 14px; }
dialog.compact::backdrop { background: rgb(0 0 0 / 0.2); }  /* lighter, so the Scheduling bars read through */
dialog.compact h2.drag-handle { cursor: move; user-select: none; touch-action: none; }  /* drag to move (app.js makeMovable) */
dialog.compact h2 { font-size: 1.15rem; margin-bottom: 6px; }
dialog.compact form > * + * { margin-top: 6px; }
dialog.compact .subhead { font-size: 0.9rem; margin-top: 8px; }
dialog.compact p.muted { font-size: 0.78rem; margin: 4px 0; }
dialog.compact p.err:empty { display: none; }
dialog.compact .field { gap: 2px; font-size: 0.82rem; }
dialog.compact input, dialog.compact select, dialog.compact textarea,
dialog.compact .field input[type="text"], dialog.compact .field textarea { font-size: 0.85rem; padding: 2px 5px; }
dialog.compact .field-row { gap: 10px; }
dialog.compact fieldset.field { padding: 2px 8px 5px; }
dialog.compact .check { font-size: 0.82rem; gap: 2px; }
dialog.compact .check-list, dialog.compact .edit-table .check-list { gap: 2px 6px; flex-wrap: nowrap; }
dialog.compact .check .tag { font-size: 0.68rem; padding: 0 5px; }
dialog.compact .check input { margin: 0 1px; }
dialog.compact table { margin-top: 4px; font-size: 0.82rem; }
dialog.compact .edit-table th, dialog.compact .edit-table td { padding: 2px 4px; }
dialog.compact .edit-table input, dialog.compact .edit-table select { font-size: 0.82rem; padding: 2px 4px; }
dialog.compact .edit-table input[size="5"] { width: 4.2em; }   /* HHMM */
dialog.compact .edit-table input[size="4"] { width: 3em; }     /* brief room */
dialog.compact .edit-table input.others { margin-top: 2px; }
#s-phases td:nth-child(2), #s-phases td:nth-child(3), #s-phases td:nth-child(5) { width: 1%; }  /* times and room: as narrow as their boxes */
dialog.compact .instructor-line { margin-top: 2px; font-size: 0.78rem; }
dialog.compact .table-wrap { overflow-x: auto; }
dialog.compact #s-mission { width: 14em; }
dialog.compact button { font-size: 0.85rem; padding: 4px 12px; }
dialog.compact button.link { padding: 1px 4px; font-size: 0.8rem; }
dialog.compact .dialog-actions { margin-top: 8px; }

/* ---------- history window ---------- */
#h-entries { max-height: 60vh; overflow-y: auto; }
.history-entry { border-top: 1px solid #ddd; padding: 8px 0; font-size: 0.9rem; }
.history-entry .line { display: block; padding-left: 12px; color: #333; }
.history-when { display: flex; gap: 10px; flex-wrap: wrap; font-weight: 600; margin-bottom: 2px; }
.history-at { color: #666; font-weight: normal; font-variant-numeric: tabular-nums; }
.warnings { margin: 8px 0 0; padding-left: 20px; color: #9a6700; }
#email-dialog textarea { width: 100%; box-sizing: border-box; font-family: Aptos, "Aptos Display", Calibri, Arial, sans-serif; font-size: 12pt; font-weight: normal; padding: 8px; }
#email-dialog input { width: 100%; font-weight: normal; }
.dist-section { border-top: 1px solid #ccc; padding-top: 10px; margin-top: 14px; }
.dist-section h3 { margin: 0 0 8px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: #555; }
.dist-section .check-list { margin-bottom: 10px; }

/* File-type icons (Bootstrap Icons, MIT: icons/LICENSE-bootstrap-icons.txt), text-high, drawn as
   colored masks: <span class="ico ico-…">. */
.ico {
  display: inline-block; width: 1.15em; height: 1.15em; vertical-align: -0.2em; flex: none;
  -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat;
}
.ico { margin-right: 0.2em; }
.ico-xlsx { --icon: url(icons/file-earmark-excel-fill.svg); background: #217346; }
.ico-pdf { --icon: url(icons/file-earmark-pdf-fill.svg); background: #c5221f; }
.ico-mail { --icon: url(icons/envelope.svg); background: #1565c0; }
.ico-txt { --icon: url(icons/filetype-txt.svg); background: #5f6368; }
.ico-png { --icon: url(icons/file-earmark-image-fill.svg); background: #6a3fb5; }
.ico-html { --icon: url(icons/filetype-html.svg); background: #e44d26; }
.ico-cloud { --icon: url(icons/cloud-fill.svg); background: #0b7bc1; }
.ico-bug { --icon: url(icons/bug.svg); background: #2e7d32; }
/* Lineup card (icons/lineup-card*.svg, drawn for the site from the Phoenix Eagle card) and plus
   (Lucide, icons/LICENSE-lucide.txt): colour from the element (currentColor); the -tall card is
   twice the height. The lightning bolt (Lucide zap) is full colour (yellow, dark outline), not a mask. */
.ico-card-tall, .ico-plus { background: currentColor; }
.ico-card-tall { --icon: url(icons/lineup-card-tall.svg); width: 1.725em; height: 2.3em; vertical-align: middle; }
.ico-plus { --icon: url(icons/plus-heavy.svg); }
.ico.ico-bolt { -webkit-mask: none; mask: none; background: url(icons/bolt-yellow.svg) center / contain no-repeat; }
.ico.ico-edit { -webkit-mask: none; mask: none; background: url(icons/edit-yellow.svg) center / contain no-repeat; }  /* Lucide square-pen, yellow pencil */

/* ---------- Feedback (bug) button and announcements (notices.js) ---------- */
button.icon-btn { padding: 4px 8px; line-height: 1; }
button.icon-btn .ico { margin-right: 0; }
.day-head .actions button.icon-btn { padding: 4px 8px; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
#announcements:empty { display: none; }
#announcements { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.announcement { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap;
  background: #fff8d6; border: 1px solid #e8d48a; border-radius: 6px; padding: 8px 12px; color: #4a3b00; font-size: 0.95rem; }
.announcement-msg { flex: 1 1 24rem; }
.announcement-actions { display: flex; align-items: center; gap: 10px; }
.announcement button.secondary { font-size: 0.85rem; padding: 4px 12px; background: #fff; }
.field textarea { font-family: inherit; font-weight: normal; }
#feedback-dialog select { font-size: 0.95rem; padding: 5px 6px; font-weight: normal; }
.dist-btn .ico:last-of-type { margin-right: 0.4em; }
.field.grow { flex: 1; }
.field-row .field.grow input { width: 100%; }
.field select { font-size: 0.95rem; padding: 5px 6px; font-weight: normal; }

/* ---------- other pages: ScheduleTrain Fetch (st.html), Users (users.html) ---------- */
.tag.stale { background: #ffe0e0; color: #a4161a; }
.tag.google { background: #e8efff; color: #1a4fb5; }
.st-week-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 32px; border-bottom: 2px solid #333; }
.st-week-header h2 { margin: 0 0 6px; }
.st-week-header button { margin-bottom: 6px; }
.st-day { border: 1px solid #ddd; border-radius: 6px; padding: 12px 16px; margin: 14px 0; }
.st-day.today { border-color: #2f6fed; box-shadow: 0 0 0 1px #2f6fed; }
.st-day h3 { margin: 0 0 10px; }
.st-controls { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; }
.st-control { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.st-day .status { margin-top: 8px; }
.when { color: #555; font-size: 0.9rem; }
.invite-form { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.invite-form .field input { font-size: 0.95rem; padding: 6px 8px; font-weight: normal; }
.invite-form .field.grow { min-width: 16rem; }
.invite-form .field.grow input { width: 100%; box-sizing: border-box; }
table.users td.user-actions { white-space: nowrap; }
table.users td.profile { white-space: nowrap; }
table.users tr.group-head th { text-align: left; background: #eef1f6; padding-top: 10px; font-size: 1rem; }
table.users tr.group-head th .muted { font-weight: normal; font-size: 0.85rem; }
.profile-edit { display: inline-flex; gap: 6px; align-items: center; }
.profile-edit input, .profile-edit select { font-size: 0.9rem; padding: 3px 6px; }
.request-form { text-align: left; margin-top: 8px; display: flex; flex-direction: column; gap: 10px; }
.request-form .field input, .request-form .field textarea { font-size: 0.95rem; padding: 6px 8px; box-sizing: border-box; width: 100%; font-weight: normal; }
.request-form .hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
details.request { margin-top: 20px; text-align: left; }
details.request summary { cursor: pointer; color: #2f6fed; text-align: center; }

/* ---------- Mission Planning card window: mission summary ---------- */
.card-summary { margin: 6px 0 0; }
.card-crew { margin-left: 2.5em; font-weight: 600; }
td.no-mission { background: #fff0f0; }
.tag.no-mission { background: #cf222e; color: #fff; font-weight: 700; margin-left: 0; }

/* ---------- Reports page (reports.html) ---------- */
.report-month { margin-top: 28px; }
.report-month h2 { margin: 0 0 4px; border-bottom: 2px solid #333; padding-bottom: 6px; }
.report-month h2 .muted { font-weight: normal; margin-left: 10px; }
.report-scroll { overflow-x: auto; }
table.report { width: auto; font-variant-numeric: tabular-nums; }
table.report th.period { white-space: nowrap; vertical-align: middle; }
table.report td.kind { white-space: nowrap; color: #555; }
table.report td.num { text-align: right; min-width: 3.5em; }
table.report td.zero { color: #bbb; }
table.report .all { font-weight: 600; border-left: 2px solid #999; }
table.report tr.period-start > * { border-top: 2px solid #999; }
table.report tr.total td, table.report tr.total th { background: #eef3ff; }
/* Reports: 2026 Events (reports.js renderEvents), drawn like the CIP events spreadsheet. */
.report-events { margin-top: 28px; }
.report-events h2 { margin: 0 0 10px; border-bottom: 2px solid #333; padding-bottom: 6px; }
table.events { width: auto; border-collapse: collapse; font-family: Calibri, Carlito, "Segoe UI", Arial, sans-serif; font-variant-numeric: tabular-nums; background: #fff; }
table.events th, table.events td { border: 1px solid #000; padding: 0; height: 22px; min-width: 28px; text-align: center; font-size: 0.85rem; color: #000; background: #fff; }
table.events thead th { font-size: 0.62rem; font-weight: normal; height: 20px; }
table.events th.ev-month { border: none; text-align: right; padding: 0 4px 0 0; font-size: 1rem; font-weight: normal; min-width: 0; white-space: nowrap; }
table.events .ev-total { font-weight: 700; border-left: 2px solid #000; border-right: 2px solid #000; }
table.events thead th.ev-letter { color: #fff; font-size: 0.85rem; font-weight: 700; }
table.events tr.ev-live td { background: #f7f9ff; }  /* counted live from Logs (since 2026-10-24) */
/* 2026 Champions (since 2026-10-24): three small ranking tables side by side. */
.report-champions { margin-top: 24px; }
.champions-row { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: flex-start; }
table.champions { width: auto; border-collapse: collapse; font-variant-numeric: tabular-nums; }
table.champions caption { text-align: left; font-weight: 700; padding: 0 0 4px; }
table.champions th, table.champions td { border: 1px solid #ccc; padding: 3px 12px; text-align: center; }
table.champions th { background: #f3f3f3; }
table.champions tr.champ-top td { font-weight: 700; background: #fff8dc; }
.champ-name { font-weight: 600; }
/* Reports: last / this / next week charts (reports.js renderCharts) */
.report-charts { position: relative; margin-top: 18px; }
.report-charts .chart-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; border-bottom: 2px solid #333; padding-bottom: 6px; margin-bottom: 12px; }
.report-charts h2 { margin: 0; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 6px; }
.chart-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.chart-panel { border: 1px solid #dde3ea; border-radius: 6px; padding: 10px 12px 4px; background: #fff; }
.chart-panel.current { border-color: #8fa9c8; }
.chart-panel h3 { margin: 0 0 4px; font-size: 1rem; }
.chart-panel h3 .muted { font-weight: normal; margin-left: 8px; }
.chart-panel svg { display: block; width: 100%; height: auto; }
.chart-panel .grid { stroke: #e8ecf0; stroke-width: 1; }
.chart-panel .grid.base { stroke: #9aa5b1; }
.chart-panel .y-t { fill: #7a8592; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.chart-panel .x-t { fill: #333; font-size: 13px; }
.chart-panel .hit { fill: transparent; }
.chart-panel .bar { pointer-events: none; }
.chart-panel .hit.hot { fill: rgba(30, 60, 100, 0.07); }
.chart-panel .hit:focus { outline: none; stroke: #8fa9c8; }
.chart-tip { position: absolute; z-index: 5; pointer-events: none; background: #fff; border: 1px solid #c9d1da; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,.12); padding: 8px 10px; font-size: 0.85rem; min-width: 170px; }
.chart-tip .tip-head { font-weight: 600; margin-bottom: 4px; white-space: nowrap; }
.chart-tip .tip-row { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; font-variant-numeric: tabular-nums; }
.chart-tip .tip-swatch { width: 10px; height: 10px; border-radius: 2px; }

/* ---------- Availability page (availability.html) ---------- */
.field.inline { flex-direction: row; align-items: center; gap: 8px; }
.avail-section { margin-top: 28px; }
.avail-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-bottom: 2px solid #333; padding-bottom: 6px; }
.avail-head .actions { margin: 0; }
.avail-head button.secondary { font-size: 0.85rem; padding: 5px 12px; }
.avail-section > .muted { margin: 6px 0 0; }
.avail-head h2 .range { font-size: 0.9rem; font-weight: normal; color: #666; margin-left: 10px; }
td.nowrap { white-space: nowrap; }
table.appts, table.aways { width: auto; min-width: 60%; }
tr.past td { color: #999; }
tr.current td { background: #fff8e6; }
.cal-month { margin-top: 16px; }
.cal-month h3 { font-size: 1rem; }
table.calendar { table-layout: fixed; margin-top: 6px; }
table.calendar th { text-align: center; }
td.cal-day { height: 4.6em; padding: 3px 5px; }
td.cal-day.today { box-shadow: inset 0 0 0 2px #2f6fed; }
td.cal-blank, td.cal-out { background: #fafafa; }
td.cal-out .cal-num { color: #bbb; }
/* Calendar day by CIPs available (1 or none … 5); non-work days get no class and stay white. */
td.cal-avail-1 { background: #f8c4c4; }
td.cal-avail-2 { background: #fbd6ad; }
td.cal-avail-3 { background: #fbefa6; }
td.cal-avail-4 { background: #bfe5ac; }
td.cal-avail-5 { background: #a9dc93; }
.cal-num { font-size: 0.8rem; color: #555; font-variant-numeric: tabular-nums; }
.cal-away { display: flex; flex-wrap: wrap; gap: 2px; margin: 2px 0; }
.tag.cal-tag { font-size: 0.68rem; padding: 0 5px; }
button.cal-tag { cursor: pointer; font-family: inherit; }
.cal-avail { font-size: 0.75rem; color: #444; }
td.cal-avail-1 .cal-avail { color: #a4161a; font-weight: 600; }

/* Letter of X's (lox.js): FORM-8 navy, DEMO PRO green, SEE amber; events grouped by a top header row. */
.lox-brushes { display: inline-flex; border: 1px solid #999; border-radius: 6px; overflow: hidden; }
.lox-brushes button { border: none; border-right: 1px solid #ccc; background: #fff; padding: 5px 10px; font-size: 0.85rem; display: inline-flex; gap: 5px; align-items: center; }
.lox-brushes button:last-child { border-right: none; }
.lox-brushes button.on { background: #e8efff; font-weight: 700; box-shadow: inset 0 -3px 0 #2f6fed; }
table.lox { border-collapse: separate; border-spacing: 0; font-size: 0.82rem; margin-top: 4px; width: auto; }
table.lox th, table.lox td { border: none; border-bottom: 1px solid #d0d7de; padding: 0; background: none; }
table.lox tbody th, table.lox tbody td { vertical-align: middle; }
table.lox tr.lox-grp th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: .04em; color: #555; padding: 6px 4px 2px; border-bottom: 2px solid #999; text-align: center; }
table.lox tr.lox-ev th { font-weight: 600; font-size: 0.68rem; padding: 4px 1px; text-align: center; min-width: 36px; line-height: 1.15; vertical-align: bottom; }
table.lox tr.lox-ev th small { display: block; color: #666; font-weight: 400; }
table.lox .lox-nm { text-align: left; padding: 4px 8px 4px 0; white-space: nowrap; font-size: 0.9rem; position: sticky; left: 0; background: #fff; z-index: 1; }
table.lox tr.lox-ev th.lox-nm { font-size: 0.9rem; text-align: left; }
button.lox-name { font-size: 0.9rem; font-weight: 700; color: inherit; padding: 2px 0; text-align: left; }
button.lox-name:hover { color: #2f6fed; text-decoration: underline; }
table.lox .lox-first { border-left: 2px solid #ddd; }
table.lox tr.lox-grp th + th { border-left: 2px solid #fff; }
td.lox-c { text-align: center; height: 34px; user-select: none; }
td.lox-paint { cursor: crosshair; }
td.lox-paint:hover { background: #f0f4ff; }
td.lox-due { padding: 0 0 0 8px; white-space: nowrap; }
td.lox-due input { font-size: 0.8rem; width: 124px; }
table.lox th.lox-due-h { text-align: left; padding-left: 10px; }
.lox-ic { display: inline-flex; width: 21px; height: 21px; border-radius: 50%; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: 800; box-sizing: border-box; vertical-align: middle; }
.lox-ic-Q { background: #1f2a44; color: #fff; }
.lox-ic-D { background: #e6f4ea; color: #1a7f37; border: 1.5px solid #1a7f37; }
.lox-ic-S { background: #fff6dc; color: #b7791f; border: 1.5px dashed #b7791f; }
.lox-ic-none { color: #bbb; }
.lox-cfe { display: block; font-size: 0.6rem; color: #666; font-weight: 700; }
.lox-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 0.85rem; color: #333; margin-top: 8px; }
.lox-legend > span { display: inline-flex; align-items: center; gap: 6px; }
#lox-section .status:empty { display: none; }
.cal-appts { font-size: 0.72rem; }
table.aways td:nth-child(3) .line { white-space: nowrap; }
.tag.event { background: #e4e4e4; color: #111; border: 1px solid #c8c8c8; margin-left: 0; }
.cal-events { display: flex; flex-wrap: wrap; gap: 2px; margin: 2px 0; }
table.aways tr.deleted td { text-decoration: line-through; color: #999; }
table.aways tr.deleted td.links-cell { text-decoration: none; }
.status-head { display: inline-flex; align-items: baseline; gap: 8px; }
a.head-link { font-weight: normal; font-size: 0.8rem; }

/* ---------- Site Admin page (siteadmin.html) ---------- */
button.small { font-size: 0.8rem; padding: 3px 10px; }
table.bugs td.bug-message { white-space: pre-wrap; min-width: 16rem; }
table.bugs td.bug-notes { min-width: 14rem; }
table.bugs td.bug-notes textarea { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 0.85rem; }
table.bugs td .line button { margin-top: 4px; }
table.anns td.ann-message { min-width: 18rem; }
#n-help code, #n-preview code { font-size: 0.85rem; }

/* Missions page (missions.html) */
.missions-section { margin-top: 18px; }
.missions-section .subhead { margin-bottom: 2px; }
table.cards td { vertical-align: top; }
.nowrap { white-space: nowrap; }
/* The "which card?" window (cardchooser.js): Recommended card, or Use different card with two dropdowns. */
dialog.card-chooser { width: 460px; }
dialog.card-chooser h2 + p { margin-top: -6px; }
.card-chooser .chooser-option { display: block; margin: 10px 0; padding: 10px 12px; border: 1px solid #ccc; border-radius: 6px; font-weight: normal; cursor: pointer; }
.card-chooser .chooser-option:has(input:checked) { border-color: #2e7d32; background: #f1f8f1; }
.card-chooser .chooser-option input[type="radio"] { margin: 0 6px 0 0; }
.card-chooser .chooser-option-head { display: block; cursor: pointer; }
.card-chooser .chooser-rec { font-weight: bold; }
.card-chooser .chooser-picks { display: flex; gap: 8px; margin: 8px 0 0 22px; }
.card-chooser .chooser-picks select { font-size: 0.95rem; padding: 4px 6px; }
.card-chooser .chooser-picks select:last-child { flex: 1; min-width: 0; }
.card-chooser:not(.chooser-other) .chooser-picks select { opacity: 0.6; }

dialog.editor.mission-card { width: 760px; }
dialog.mission-card .field { display: block; margin-top: 10px; }
dialog.mission-card .field input[type="text"] { width: 100%; }
.radio-group { border: 1px solid #ddd; border-radius: 6px; margin: 12px 0 0; padding: 6px 12px 10px; display: flex; flex-direction: column; gap: 4px; }
.radio-group legend { font-weight: 600; font-size: 0.9rem; padding: 0 4px; }
.radio-group .muted { margin: 4px 0 0; font-size: 0.8rem; }
.warnings-line { color: #9a6700; margin: 6px 0 0; font-size: 0.9rem; }
ol.steps { display: flex; list-style: none; padding: 0; margin: 12px 0 4px; counter-reset: step; border-bottom: 1px solid #ddd; }
ol.steps li { flex: 1; counter-increment: step; padding: 6px 4px; font-size: 0.85rem; color: #888; border-bottom: 3px solid transparent; margin-bottom: -1px; }
ol.steps li::before { content: counter(step) ". "; }
ol.steps li.current { color: #111; font-weight: 600; border-bottom-color: #2f6fed; }
ol.steps li.done { color: #1b5e20; border-bottom-color: #8fc79a; }
ol.steps li.done::before { content: "✓ "; }
.card-data { display: grid; grid-template-columns: 240px 1fr; gap: 16px; align-items: start; }
.card-data .tpl-list { margin-top: 0; }
.card-fields .radio-group { margin-top: 10px; }
.field-grid { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-end; }
dialog.mission-card .field-grid .field { display: flex; flex-direction: column; margin-top: 4px; font-size: 0.85rem; }
dialog.mission-card .field-grid .field input, dialog.mission-card .field-grid .field select { font-size: 0.9rem; padding: 4px 6px; width: auto; }
dialog.mission-card .field-grid.radios .field input { width: 9rem; }
.muted.small { font-size: 0.78rem; margin: 4px 0 0; }
.step-head { font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: #555; margin: 16px 0 4px; border-top: 1px solid #ccc; padding-top: 10px; }
.step-head .muted { text-transform: none; letter-spacing: 0; font-size: 0.8rem; }
table.crew { width: auto; margin-top: 8px; }
table.crew td, table.crew th { padding: 3px 6px; }
table.crew input { font-size: 0.9rem; padding: 4px 6px; width: 9rem; }
.flow-box { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 0.9rem; }
.flow-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.flow-head .field.inline { margin-bottom: 4px; font-size: 0.85rem; }
.flow-head .step-head { flex: 1; }
@media (max-width: 640px) { .card-data { grid-template-columns: 1fr; } }
#m-templates { display: flex; flex-direction: column; gap: 4px; }
#m-templates .check { align-items: flex-start; }
.st-ids { margin-top: 6px; }
.st-preview { border: 1px solid #ddd; border-radius: 6px; padding: 6px 12px; margin: 6px 0; background: #fafafa; }
.st-preview ul { margin: 4px 0; }
/* Missions card window: light-green "go" buttons, share sub-options, the lineup block */
button.go { background: #d4efd9; border: 1px solid #6aa874; border-radius: 4px; color: #123d1c; }
button.go:hover:not(:disabled) { background: #c2e8c9; }
button.cancel { background: #f8dcdc; border: 1px solid #cf8a8a; border-radius: 4px; color: #5c1a1a; }  /* light red */
button.cancel:hover:not(:disabled) { background: #f3cbcb; }
button.archive { background: #fde5c8; border: 1px solid #d9a35e; border-radius: 4px; color: #5c3300; }  /* light orange */
button.archive:hover:not(:disabled) { background: #fbd8ae; }
.radio-group.compact { padding: 2px 10px 6px; gap: 2px; }
.radio-group.compact legend { font-size: 0.85rem; }
.radio-group.compact .check { font-size: 0.85rem; }
.sub-options { margin: 2px 0 6px 24px; display: flex; flex-direction: column; gap: 4px; }
.sub-options .check-list { gap: 4px 14px; }
.lineup-block { border: 1px solid transparent; border-radius: 6px; padding: 8px 10px; }
.lineup-block.linked { background: #eef0f2; border: 1px dashed #9aa3ab; }
.lineup-block.linked input, .lineup-block.linked select { background: #e2e5e8; color: #555; border-color: #c4c9ce; }
.lock-note { margin: 0 0 6px; font-size: 0.85rem; color: #444; }
.lineup-cols { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.time-col { display: flex; flex-direction: column; gap: 6px; }
dialog.mission-card .time-col .field { display: flex; flex-direction: column; margin-top: 0; font-size: 0.85rem; }
dialog.mission-card .time-col .field input, dialog.mission-card .time-col .field select { width: 6rem; font-size: 0.9rem; padding: 4px 6px; }
.lineup-cols table.crew { margin-top: 0; }
dialog.mission-card > section > .radio-group { margin-top: 14px; }

/* Top bar (nav.js, design B): full-width dark bar + the Schedule sub-bar. Only once signed in
   (body.has-appbar); the page's own content keeps the 1100 px column. */
body.has-appbar { max-width: none; margin: 0; padding: 0; }
body.has-appbar > #page, body.has-appbar > #app { max-width: 1100px; margin: 0 auto; padding: 20px 16px 32px; }
header .actions:empty { display: none; }
.appbar { background: #1d2b3a; color: #fff; }
.appbar-row { max-width: 1100px; margin: 0 auto; padding: 0 16px; display: flex; align-items: center; gap: 6px; min-height: 54px; flex-wrap: wrap; }
.appbar-brand { display: flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; font-weight: 700; letter-spacing: 0.02em; margin-right: 18px; }
.appbar-brand img { height: 30px; }
.appbar nav { display: flex; gap: 4px; }
.appbar nav a { color: #c9d4df; text-decoration: none; padding: 7px 12px; border-radius: 6px; font-weight: 500; white-space: nowrap; }
.appbar nav a:hover { background: #2b3d50; color: #fff; }
.appbar-main a.active { background: #3b82f6; color: #fff; }
.appbar-admin { margin-left: 10px; padding-left: 10px; border-left: 1px solid #3d5064; }
.appbar-admin a.icon-link { display: inline-flex; align-items: center; gap: 5px; font-size: 0.88rem; border: 1px solid transparent; }
.appbar-admin a.icon-link .icon { font-size: 0.95rem; }
.appbar-admin a.active { border-color: #f0c35a; background: #3a3420; color: #fff; }
.appbar-spacer { flex: 1; }
.appbar-right { display: flex; align-items: center; gap: 8px; }
.appbar-right .who { color: #c9d4df; white-space: nowrap; }
.appbar-right button { background: #2b3d50; color: #fff; border: 1px solid #3d5064; border-radius: 5px; padding: 6px 12px; font-size: 0.9rem; white-space: nowrap; }
.appbar-right button:hover { background: #34495f; }
/* The bug and ? buttons: matching 30 px squares (notices.js) */
.appbar-right .bug-btn { background: #fff; border-color: #fff; box-sizing: border-box; width: 30px; height: 30px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.appbar-right .bug-btn:hover { background: #e8eef5; }
.subbar { background: #e9eef3; border-bottom: 1px solid #cfd8e1; }
.subbar-row { max-width: 1100px; margin: 0 auto; padding: 0 16px; display: flex; gap: 20px; min-height: 38px; align-items: stretch; flex-wrap: wrap; }
.subbar-row a { display: flex; align-items: center; color: #3c4b5a; text-decoration: none; font-size: 0.9rem; border-bottom: 2px solid transparent; white-space: nowrap; }
.subbar-row a:hover { color: #111; }
.subbar-row a.active { border-bottom-color: #1d2b3a; color: #111; font-weight: 600; }
/* A third bar under the sub-bar (nav.js: DOMP's pages), lighter and a little smaller. */
.subbar-third { background: #f5f7f9; border-bottom-color: #e1e6eb; }
.subbar-third .subbar-row { min-height: 32px; gap: 18px; }
.subbar-third .subbar-row a { font-size: 0.85rem; }

/* Mission Planning card lists */
.my-cards-block { background: #e8f5e9; border: 1px solid #a5d6a7; border-radius: 8px; padding: 4px 14px 12px; }
.my-cards-block table.cards { background: #fff; }
/* My Missions (since 2026-10-18): Starred in light yellow; the star on a mission row and a card tile;
   a hidden mission (Show hidden missions); the note on a card I hid; v0 / v1 in the from-scratch window. */
.starred-block { background: #fffbe6; border: 1px solid #f0d77a; border-radius: 8px; padding: 4px 14px 12px; }
.starred-block table.cards { background: #fff; }
.star-mark { color: #c58a00; font-weight: 600; margin-left: 6px; white-space: nowrap; }
.mp-star.on { color: #9a6a00; border-color: #e0b54a; background: #fff7e0; }
tr.hidden-mission td { opacity: 0.55; }
.hidden-note { background: #f4f4f5; border-left: 3px solid #9ca3af; padding: 4px 8px; margin: 4px 0; }
.scratch-kind { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 10px; }  /* stacked: v3, v2, v1, v0 (since 2026-10-20; v3 since 2026-10-22) */
.product-lines { margin-top: 2px; }  /* a mission's cards under its date / mission line (My Missions; since 2026-10-20) */
.product-line { font-weight: normal; font-size: 0.9rem; color: #444; }
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.card-mission { font-weight: 700; }
.card-name { font-size: 0.82rem; color: #555; margin-top: 2px; }
.lineup-cell .crew-line { white-space: pre; font-size: 0.88rem; }
.tag.owner-tag { background: #111; color: #fff; font-weight: 700; margin: 0 0 3px; letter-spacing: 0.02em; }
.visible-cell .vis-line { font-size: 0.88rem; }
.card-actions { white-space: normal; min-width: 9rem; }
tr.archived td { color: #888; background: #fafafa; }
tr.archived .card-mission { font-weight: 600; }
.tag.archived-tag { background: #e4e4e4; color: #555; }
#all-cards-details summary { cursor: pointer; }
h2.subhead.inline { display: inline; }
dialog.mission-card.scratch .not-scratch { display: none !important; }
.history-list { padding-left: 18px; font-size: 0.9rem; max-height: 60vh; overflow: auto; }
.history-list > li { margin-bottom: 8px; }
.history-list ul { margin: 2px 0 0; padding-left: 18px; color: #444; font-size: 0.85rem; overflow-wrap: anywhere; }
/* Mission Planning: cards for scheduled missions, a bubble per day (its sims as a table; my missions
   light green), in two columns filled down the left first */
.day-bubbles { columns: 2; column-gap: 14px; margin-top: 6px; }
.day-bubble { break-inside: avoid; border: 1px solid #d8dde3; border-radius: 8px; padding: 6px 10px 8px; margin-bottom: 12px; background: #fff; }
.day-bubble h3 { margin: 2px 0 6px; font-size: 0.95rem; }
.day-bubble table.sim-cards { width: 100%; font-size: 0.9rem; }
.si-ios { color: #555; margin-top: 2px; font-size: 0.85rem; }
table.sim-cards tr.mine td { background: #e8f5e9; }
@media (max-width: 900px) { .day-bubbles { columns: 1; } }
/* Switch-mission choices */
.switch-choices { display: flex; flex-direction: column; gap: 8px; }
.switch-choices button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; }
.switch-choices button span { font-size: 0.85rem; color: #444; }
/* "My missions" in light green (as My Mission Cards); the checkbox wears the same green, so it's also the key */
.check.mine-key { background: #e8f5e9; border: 1px solid #a5d6a7; border-radius: 6px; padding: 4px 10px; }
.check.mine-key:has(input:disabled) { opacity: 0.6; }
/* Schedule page: a sim's Create card button (opens Mission Planning) */
/* The schedule's Notes cell (notesCell in app.js): grey icon buttons on the left, all the same
   height, icons only (the name is the tooltip): Edit (yellow pencil), the card badge (.card-badge
   below: black / blue card with the count, or green plus + card), Quick Card (yellow lightning,
   only while there's no card); the notes, History and tags to their right. */
.notes-cell { display: flex; align-items: flex-start; gap: 8px; }
.note-btns { display: flex; align-items: stretch; gap: 4px; flex: none; }
.note-text { min-width: 0; }
.note-text > .line.links:first-child { margin-top: 0; }
.card-btn { display: inline-flex; align-items: center; gap: 2px; padding: 3px 6px; font-size: 1rem; text-decoration: none; background: #e4e4e4; border: 1px solid #9e9e9e; border-radius: 4px; }
.card-btn:hover { background: #d6d6d6; }
.card-btn .ico { margin: 0; }
.card-btn .ico-plus { width: 1.5em; height: 1.5em; }
.card-btn .ico-bolt, .card-btn .ico-edit { width: 1.6em; height: 1.6em; }

/* The lineup card badge (cardicons.js), on the schedule and Mission Planning: a grey button with a
   black card (you have a card), a blue card (shared with you) or a green plus and card (make one),
   and "2 cards". .big: Mission Planning's first column. .sample: the key above the sims. */
.card-badge { display: inline-flex; align-items: center; gap: 3px; padding: 3px 6px; font-size: 1rem; line-height: 1; text-decoration: none;
  background: #e4e4e4; border: 1px solid #9e9e9e; border-radius: 4px; cursor: pointer; color: #111; font-family: inherit; }
.card-badge:hover { background: #d6d6d6; }
.card-badge .ico { margin: 0; }
.card-badge .ico-plus { width: 1.5em; height: 1.5em; }
.card-badge.mine { color: #111; }
.card-badge.shared { color: #1565c0; }
.card-badge.create { color: #2e7d32; }
/* My Missions' split badge (since 2026-10-20): black card (n) for my cards, blue card (n) for shared ones. */
.card-badge.split, .card-badge.big.split { flex-direction: row; gap: 8px; }  /* side by side, also in the big badge */
.card-badge.big .badge-part .badge-count { margin: 0 0 0 2px; }
.card-badge .badge-part { display: inline-flex; align-items: center; gap: 2px; }
.card-badge .badge-part.mine { color: #111; }
.card-badge .badge-part.shared { color: #1565c0; }
.card-badge .badge-count { font-size: 0.8rem; font-weight: 600; color: #111; margin-left: 3px; white-space: nowrap; }
.card-badge.big .ico-card-tall { width: 2.3em; height: 3.07em; }
.card-badge.big { flex-direction: column; padding: 5px 8px; }
.card-badge.big .badge-count { margin: 3px 0 0; }
.card-badge.sample { cursor: default; font-size: 0.6rem; padding: 2px 4px; vertical-align: middle; }
.card-badge.sample:hover { background: #e4e4e4; }
.badge-key { font-size: 0.85rem; color: #444; margin: 4px 0 8px; }
td.badge-cell { text-align: center; width: 1%; white-space: nowrap; }
table.sim-cards td.badge-cell { text-align: right; }
table.by-mission tr.more-cards td { border-top: 1px dashed #d0d0d0; }
.ico-download { --icon: url(icons/download.svg); background: #333; }

/* The Mission page (missions.js openMission): the mission on the left, its cards on the right */
dialog.editor.mission-page { width: 1100px; }
.mp-grid { display: grid; grid-template-columns: 240px 1fr; gap: 20px; align-items: start; margin-top: 8px; }
.mp-left { border-right: 1px solid #ddd; padding-right: 16px; }
.mp-row { margin-bottom: 10px; }
.mp-row .label, .mp-vis .label { display: block; font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: #666; }
.mp-row .crew-line { white-space: pre; }
button.add-card-btn { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; font-size: 0.95rem; padding: 6px 12px; color: #2e7d32; font-weight: 600; }
button.add-card-btn .ico { margin: 0; }
button.add-card-btn .ico-plus { width: 1.3em; height: 1.3em; }
button.add-card-btn .ico-card-tall { width: 1.2em; height: 1.6em; margin-right: 4px; }
.mp-empty { background: #f4f4f4; border: 1px dashed #bbb; border-radius: 8px; padding: 24px; text-align: center; color: #555; }
.mp-tile { background: #f2f3f5; border: 1px solid #d4d8dd; border-radius: 8px; padding: 14px; margin-bottom: 16px; }
.mp-tile.shared { border-color: #9cc0e8; }
.mp-tile.archived { opacity: 0.7; }
.mp-preview { width: min(100%, 540px); }
.mp-preview img { display: block; width: 100%; height: auto; border: 1px solid #ccc; background: #fff; }
button.mp-picture { display: block; padding: 0; border: none; background: none; cursor: zoom-in; width: 100%; }
.mp-making { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-height: 120px; justify-content: center;
  background: #fff; border: 1px dashed #bbb; border-radius: 4px; padding: 16px; color: #555; }
.mp-making.err { color: #a4161a; }
.mp-btns { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
button.mp-btn { display: inline-flex; align-items: center; gap: 2px; font-size: 1rem; padding: 10px 14px; background: #fff; border: 1px solid #9e9e9e; border-radius: 4px; }
button.mp-btn:hover:not(:disabled) { background: #e8eef5; }
button.mp-btn .ico { width: 1.3em; height: 1.3em; margin: 0; }
button.mp-btn .ico:last-of-type { margin-right: 6px; }
button.mp-btn.icon-only .ico:last-of-type { margin-right: 0; }
button.mp-btn.icon-only { padding: 10px 12px; }
.mp-ids { margin-top: 14px; padding-top: 10px; border-top: 1px solid #e2e2e2; }
.mp-ids code { font-size: 0.8rem; overflow-wrap: anywhere; }
.card-data .tpl-col .field { margin-top: 0; margin-bottom: 10px; }
.mp-name { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 1rem; margin: 4px 0 10px; overflow-wrap: anywhere; }
.mp-name input.mp-name-input { flex: 1 1 24rem; font-size: 0.95rem; }
button.mp-pencil { background: none; border: none; padding: 2px; }
button.mp-pencil .ico { width: 1.2em; height: 1.2em; }
.mp-vis { margin-bottom: 10px; }
.mp-vis .visible-cell { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.mp-vis .tag.owner-tag { margin: 0; }
.mp-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.mp-actions button { font-size: 0.85rem; padding: 5px 10px; }
.mp-meta { margin: 6px 0 0; }
/* A lineup card database's source (cards/registry.js sourceText; since 2026-10-20). */
.card-source { margin: 2px 0 0; font-size: 0.9rem; color: #555; font-weight: 600; }
.card-source-inline { color: #666; font-size: 0.85em; margin-left: 4px; }
.card-source-inline::before { content: "("; } .card-source-inline::after { content: ")"; }
.chooser-source { margin: 4px 0 0; }
.chooser-option .chooser-source { display: block; margin-left: 0; }
.mp-weather { margin: 6px 0 0; }  /* a v2 or v3 card's weather line under its picture (since 2026-10-20) */
.mp-weather.warn { color: #8a4b00; }
dialog.png-view { width: min(1100px, 96vw); }
#png-pages img { display: block; width: 100%; height: auto; border: 1px solid #ccc; margin-top: 8px; }
@media (max-width: 760px) {
  .mp-grid { grid-template-columns: 1fr; }
  .mp-left { border-right: none; padding-right: 0; border-bottom: 1px solid #ddd; padding-bottom: 10px; }
}
.tag.owner-tag { white-space: nowrap; }

/* Download / Distribute made in the cloud (cloud-render.js) */
.cloud-btn { border-color: #0b7bc1; }
#cr-head h2 .ico { margin-right: 0.2em; }
.cr-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cr-preview { margin: 10px 0 4px; }
.cr-preview a { display: block; }
.cr-preview img { width: 100%; height: auto; border: 1px solid #ccc; background: #fff; }
/* A cloud picture that couldn't be shown on the page (cloud-image.js): a link to open it instead */
.cloud-image-failed { padding: 12px; border: 1px dashed #c9d1da; border-radius: 6px; color: #5b6b7c; font-size: 0.9rem; background: #fff; }
/* A finished file: a link that looks like the window's buttons */
.cr-btns { margin: 6px 0 4px; }
dialog.cr-pages { width: min(1100px, 96vw); }
dialog.cr-pages figure { margin: 10px 0; }
dialog.cr-pages img { display: block; width: 100%; height: auto; border: 1px solid #ccc; background: #fff; }


/* Cloud Analytics (cloudanalytics.js) */
.ca-filters { display: flex; gap: 16px; flex-wrap: wrap; margin: 8px 0 12px; }
.ca-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin-bottom: 18px; }
.ca-tile { border: 1px solid #ddd; border-radius: 6px; padding: 8px 10px; background: #fcfcfb; }
.ca-tile-v { font-size: 1.3rem; font-weight: 600; font-variant-numeric: tabular-nums; color: #0b0b0b; }
.ca-tile-k { font-size: 0.78rem; color: #52514e; }
.ca-figure { position: relative; }
.ca-chart { width: 100%; height: auto; display: block; }
.ca-axis { font-size: 11px; fill: #52514e; }
.ca-hit:hover { fill: rgba(0, 0, 0, 0.04); }
.ca-legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 0.85rem; color: #333; margin-bottom: 4px; }
.ca-swatch { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.ca-tip { position: absolute; pointer-events: none; white-space: pre; background: #fff; border: 1px solid #ccc; border-radius: 4px;
  padding: 6px 8px; font-size: 0.8rem; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); }
.ca-tip[hidden] { display: none; }
table.ca-jobs td, table.ca-jobs th { white-space: nowrap; }
table.ca-jobs td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.ca-jobs tr.ca-error td, table.ca-jobs tr.ca-unfinished td { color: #b42318; }
table.ca-jobs tr.clickable { cursor: pointer; }
table.ca-jobs tr.clickable:hover td { background: #f4f6fb; }
table.ma-cards { width: auto; }
table.ma-cards td.ma-short { color: #b42318; }

/* Sim editor: the red ✕ that clears a brief or debrief row (app.js phaseRow) */
button.phase-clear { color: #cf222e; font-weight: 700; margin-left: 4px; padding: 0 4px; }
button.phase-clear:hover { background: #fde8e8; border-radius: 3px; }

/* The "?" Help button beside the bug button in the top bar (notices.js helpButton) */
.appbar-right .help-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; box-sizing: border-box; border-radius: 5px;
  background: #fff; color: #1d2b3a; font-weight: 700; font-size: 1rem; text-decoration: none; border: 1px solid #fff; }
.appbar-right .help-btn:hover { background: #e8eef5; }
body.in-help .appbar-right .help-btn { box-shadow: 0 0 0 2px #f0b429; }
.help-section { max-width: 820px; }
.help-section p { line-height: 1.55; }
.help-figure { margin: 16px 0 0; max-width: 1100px; }
.help-figure img { display: block; width: 100%; height: auto; border: 1px solid #d5dde6; border-radius: 8px; background: #fff; }
.help-figure figcaption { margin-top: 6px; font-size: 0.85rem; color: #5b6b7c; }

/* ScheduleTrain Fetch (st.js questions; since 2026-10-18): a flagged meeting or EX DT block waiting
   for an answer, in red; what was added from ScheduleTrain, under it. */
.st-ask { background: #fdecea; border: 1px solid #e57373; border-radius: 6px; padding: 8px 12px; margin: 8px 0; color: #7f1d1d; }
.st-ask p { margin: 2px 0; }
.st-ask-btns { display: flex; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.st-added { margin: 8px 0; font-size: 0.9rem; }
.st-added ul { margin: 4px 0 0 18px; padding: 0; }

/* Site Admin › Notifications (notifications.js, since 2026-10-19) */
.tag.on { background: #dafbe1; color: #1a7f37; margin-left: 0; }
table.notify-rules td.notify-to { white-space: nowrap; }
.notify-actions { display: flex; flex-wrap: wrap; gap: 4px; min-width: 12rem; }
.notify-run { border-top: 1px solid #ddd; padding: 6px 0; }
.notify-run summary { cursor: pointer; }
pre.notify-email { white-space: pre-wrap; background: #f6f8fa; border-radius: 6px; padding: 8px 10px; font-size: 0.85rem; margin: 6px 0 0; }

/* The admins' "New 🐞" badge in the top bar: open feedback nobody has acknowledged (nav.js, since 2026-10-19) */
.appbar a.appbar-newbug { display: inline-flex; align-items: center; gap: 4px; margin-left: 10px; padding: 3px 10px; border-radius: 14px;
  background: #ffd43b; color: #3d2e00; font-weight: 700; font-size: 0.85rem; text-decoration: none; border: 1px solid #f0b400; }
.appbar a.appbar-newbug:hover { background: #ffe066; }
.appbar a.appbar-newbug .ico-bug { background: #3d2e00; margin-right: 0; }
/* Site Admin feedback: new (unacknowledged) rows */
table.bugs tr.bug-new td { background: #fff8d6; }
.tag.new { background: #ffd43b; color: #3d2e00; font-weight: 700; margin-left: 0; }
/* Publish the schedule and Schedule › Logs (since 2026-10-21; admin only for now) */
.tag.published-badge { background: #4a4a4a; color: #fff; font-weight: 600; letter-spacing: 0.02em; }
.publish-section { margin: 4px 0 10px; }
button.publish-btn { background: #4a4a4a; color: #fff; border: 1px solid #4a4a4a; border-radius: 4px; font-weight: 600; }
button.publish-btn:disabled { opacity: 0.6; }
.publish-warning { background: #fff3cd; color: #5c4400; border-left: 4px solid #e0a800; padding: 8px 10px; }
.tag.review-badge { background: #ffd43b; color: #3d2e00; font-weight: 700; }
details.log-month, details.log-week, details.log-day { margin: 6px 0; }
details.log-month > summary { font-size: 1.15rem; font-weight: 600; cursor: pointer; padding: 6px 0; border-bottom: 1px solid #ccc; }
details.log-week { margin-left: 16px; }
details.log-week > summary { font-weight: 600; cursor: pointer; padding: 4px 0; }
details.log-day { margin-left: 16px; border: 1px solid #ddd; border-radius: 6px; padding: 4px 10px; }
details.log-day > summary { cursor: pointer; padding: 4px 0; }
.log-date { font-weight: 600; }
.log-day-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
table.log-lines td:nth-child(2), table.log-changes td:nth-child(3) { white-space: nowrap; }
table.log-lines tr.log-sim td { background: #f7f9ff; }
.log-changes-head { margin: 14px 0 0; font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase; color: #555; }
table.log-changes tr.decided td { color: #777; }
td.log-actions { white-space: nowrap; }
input.log-reason { width: 18em; font-size: 0.85rem; padding: 3px 6px; }
.log-logged { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 4px 0 12px; font-size: 0.85rem; }
.log-logged-key { font-weight: 600; color: #333; }
.log-logged-item.zero { color: #aaa; }
.log-month-tools { margin: 4px 0 8px 16px; }

/* Logs › monthly PDF (since 2026-10-24): #log-print is laid out only for printing; the page itself is hidden. */
#log-print { display: none; }
@media print {
  @page { size: letter; margin: 0.4in; }
  html:has(body.printing) { font-size: 9px; }  /* the site's sizes are rem: this shrinks them all */
  body.printing { margin: 0; padding: 0; max-width: none; }
  body.printing > *:not(#log-print) { display: none !important; }
  body.printing #log-print { display: block; }
  #log-print h1 { font-size: 1.7rem; margin: 0 0 2px; }
  #log-print h2 { font-size: 1.4rem; margin: 0 0 6px; }
  #log-print .print-day { break-before: page; }
  #log-print .print-png { display: block; max-width: 100%; max-height: 4.6in; margin: 0 auto 6px; border: 1px solid #ccc; }
  #log-print table.log-lines td, #log-print table.log-lines th, #log-print table.log-changes td { padding: 1px 6px; }
  #log-print .log-changes-head { margin-top: 8px; }
  #log-print .log-month-counts { margin: 6px 0 0; }
  #log-print .tag { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  #log-print table.log-lines tr.log-sim td, #log-print .log-month-counts, #log-print table.log-count th { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
.log-done { color: #1a7f37; font-weight: 600; }
.tag.change-cancelled, .tag.change-meetingRemoved { background: #ffe0e0; color: #a40e26; margin-left: 0; font-weight: 600; }
.tag.change-added, .tag.change-meetingAdded { background: #dcf5e3; color: #116329; margin-left: 0; font-weight: 600; }
.tag.change-time { background: #fff3cd; color: #7a5a00; margin-left: 0; font-weight: 600; }
table.log-changes td:first-child { white-space: nowrap; }
.log-previous { margin-top: 10px; font-size: 0.85rem; }
/* Logs › counts for the day (since 2026-10-24): two small tables side by side. */
.log-counts { display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: flex-start; margin-top: 4px; }
table.log-count { border-collapse: collapse; font-size: 0.85rem; width: auto; }
table.log-count caption { text-align: left; font-weight: 600; font-size: 0.8rem; color: #333; padding: 0 0 3px; }
table.log-count th, table.log-count td { padding: 2px 8px; border: 1px solid #ddd; text-align: center; }
table.log-count th { background: #f3f3f3; font-weight: 600; }
table.log-count th.row { text-align: left; }
table.log-count td.zero { color: #bbb; }
table.log-count tr.sum th, table.log-count tr.sum td { border-top: 2px solid #999; font-weight: 600; }
.log-month-counts { margin: 0 0 10px 16px; padding: 2px 10px 8px; background: #f7f9ff; border: 1px solid #dde3f0; border-radius: 6px; }
.log-month-counts .log-changes-head { margin-top: 8px; }

/* Reminders (reminders.js): the yellow banner at the top of CIP Availability and the list at the bottom. */
.rem-banner { background: #fff8d6; border: 1px solid #e6c84f; border-left: 6px solid #e0a800; border-radius: 6px; padding: 8px 12px; margin: 10px 0; }
.rem-banner-title { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #8a6d00; }
.rem-banner-item { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid #f0dc8a; flex-wrap: wrap; }
.rem-banner-title + .rem-banner-item { border-top: none; }
.rem-banner-item b { flex: 1; min-width: 200px; }
.rem-banner-date { font-size: 0.8rem; color: #8a6d00; white-space: nowrap; }
.rem-banner-item button { font-size: 0.85rem; padding: 4px 12px; background: #fff; }
h3.rem-sub { font-size: 0.8rem; text-transform: uppercase; letter-spacing: .05em; color: #555; margin: 14px 0 4px; font-weight: 600; }
h3.rem-sub .muted { text-transform: none; letter-spacing: 0; font-weight: normal; }
table.rem-table { border-collapse: collapse; width: 100%; font-size: 0.88rem; }
table.rem-table th { text-align: left; font-size: 0.75rem; text-transform: uppercase; letter-spacing: .04em; color: #555; border: none; border-bottom: 2px solid #999; padding: 6px 8px; white-space: nowrap; background: none; }
table.rem-table td { border: none; border-bottom: 1px solid #d0d7de; padding: 7px 8px; vertical-align: middle; }
tr.rem-row { cursor: pointer; }
tr.rem-row:hover td { background: #f6f9ff; }
td.rem-when { white-space: nowrap; }
td.rem-text { font-weight: 600; }
tr.rem-mine td.rem-text::before { content: "● "; color: #e0a800; }
tr.rem-done td { color: #999; }
tr.rem-done td.rem-text { font-weight: normal; }
td.rem-mail { font-size: 0.8rem; color: #6a3d9a; overflow-wrap: break-word; }
td.rem-act { white-space: nowrap; text-align: right; }
td.rem-act button.secondary { font-size: 0.8rem; padding: 3px 9px; }
.rem-ok { color: #1a7f37; font-weight: 600; white-space: nowrap; }
.rem-cips-row { display: flex; align-items: center; gap: 4px 14px; flex-wrap: wrap; }
.rem-cips { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; }
.rem-dot { color: #e0a800; }
#rem-form fieldset.field { gap: 6px; }
#rm-emails { width: 100%; box-sizing: border-box; font: inherit; font-size: 0.9rem; padding: 6px 8px; }
.rem-acks { font-size: 0.85rem; padding: 8px 12px; background: #f6f8fa; border-radius: 6px; }
.rem-mail-preview { border: 1px solid #d0d7de; border-radius: 6px; font-size: 0.88rem; }
.rem-mail-hdr { background: #f6f8fa; padding: 8px 12px; border-bottom: 1px solid #d0d7de; line-height: 1.6; }
.rem-mail-body { padding: 12px; line-height: 1.5; }