@font-face {
  font-family:Geist;
  src:url('./fonts/geist.woff2') format('woff2');
  font-weight:100 900;
  font-display:swap
}
@font-face {
  font-family:Newsreader;
  src:url('./fonts/newsreader.woff2') format('woff2');
  font-weight:200 800;
  font-display:swap
}
:root {
  /* Lagoon: actions, completed work and attention have separate roles. */
  --bg:#102a2e;
  --surface:#17383d;
  --raised:#24494f;
  --ink:#f0f4ee;
  --muted:#b5c9c7;
  --line:rgb(240 244 238 / .08);
  --line-hover:rgb(240 244 238 / .12);
  --quiet:rgb(240 244 238 / .65);
  --action:#bbdcf4;
  --action-hover:#c9e4f7;
  --attention:#f4b975;
  --control-border:rgb(240 244 238 / .55);
  --good:#a9d1b5;
  --sans:Geist,'Segoe UI',sans-serif;
  --serif:Newsreader,Georgia,serif;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --text-caption:13px;
  --text-body:15px;
  --text-vehicle:17px;
  --text-title:48px;
  font-family:var(--sans);
  font-size:var(--text-body);
  color:var(--ink);
  background:var(--bg);
  color-scheme:dark;
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums
}
* {
  box-sizing:border-box
}
body {
  margin:0
}
[hidden] {
  display:none!important
}
a {
  color:inherit;
  text-underline-offset:5px
}
button,.button,input,select,textarea {
  font:inherit
}
button,.button {
  font-size:13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  position:relative;
  min-height:38px;
  padding:8px 16px;
  border:1px solid;
  border-color:var(--action);
  border-radius:8px;
  background:var(--action) linear-gradient(180deg,rgb(255 255 255 / .22),transparent 72%);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .55),inset 0 -1px 1px rgb(16 42 46 / .12),0 1px 2px rgb(0 0 0 / .2);
  color:var(--bg);
  font-weight:500;
  line-height:1.4;
  text-decoration:none;
  cursor:pointer
}
button:disabled {
  opacity:.5;
  cursor:wait
}
.secondary {
  background:transparent;
  color:var(--ink);
  border-color:var(--control-border);
  box-shadow:inset 0 1px 0 rgb(240 244 238 / .035)
}
.text-button {
  background:transparent;
  border-color:transparent;
  color:var(--muted);
  padding:8px 0;
  text-decoration:underline;
  text-underline-offset:5px;
  box-shadow:none
}
:focus-visible {
  outline:2px solid var(--action);
  outline-offset:4px
}
[tabindex='-1']:focus {
  outline:none
}
h1,h2,h3,h4,p {
  margin:0 0 16px
}
h1 {
  font:400 var(--text-title)/1.08 var(--serif);
  letter-spacing:-.025em;
  text-wrap:balance;
  max-width:23ch
}
h2 {
  font-size:17px;
  font-weight:500;
  line-height:1.4
}
h3,h4 {
  font-size:var(--text-body);
  font-weight:500;
  line-height:1.5
}
p {
  color:var(--muted);
  line-height:1.6;
  max-width:65ch;
  text-wrap:pretty
}
.small {
  font-size:var(--text-caption);
  line-height:1.5
}
strong {
  font-weight:500
}
label {
  display:block;
  font-size:var(--text-caption);
  color:var(--muted);
  margin-bottom:8px
}
input,select,textarea {
  max-width:100%;
  border:1px solid var(--control-border);
  border-radius:7px;
  background:var(--bg);
  color:var(--ink);
  padding:11px 12px;
  min-height:44px
}
input,textarea {
  width:100%
}
input::placeholder,textarea::placeholder {
  color:var(--quiet);
  opacity:1
}
textarea {
  resize:vertical;
  line-height:1.5
}
input[type='checkbox'] {
  width:18px;
  min-height:18px;
  height:18px;
  accent-color:var(--action);
  flex:none
}
form>input,form>textarea,form>select {
  margin-bottom:18px
}
button+button {
  margin-inline-start:12px
}
summary {
  cursor:pointer;
  min-height:44px;
  padding-block:12px;
  line-height:1.4
}
details>p {
  margin-top:12px
}
details details {
  margin-top:16px
}
blockquote {
  margin:0 0 20px;
  line-height:1.6;
  color:var(--ink);
  max-width:70ch
}
pre,code {
  font-size:12px;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
li {
  line-height:1.6
}
.sr-only,.skip:not(:focus) {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}
.skip:focus {
  position:fixed;
  z-index:5;
  background:var(--ink);
  color:var(--bg);
  padding:14px
}
.topbar {
  display:flex;
  align-items:center;
  gap:24px;
  max-width:1440px;
  margin:auto;
  padding:25px 48px
}
.brand {
  display:flex;
  align-items:center;
  gap:11px;
  font:500 17px/1 var(--sans);
  letter-spacing:-1px;
  text-decoration:none
}
.brandmark {
  width:30px;
  height:30px;
  color:var(--ink)
}
.product-label {
  font-size:13px;
  color:var(--muted);
  margin-inline-start:6px
}
.topbar>a:last-child {
  margin-inline-start:auto;
  font-size:13px;
  color:var(--muted)
}
.desk {
  max-width:1344px;
  margin:22px auto 80px;
  padding-inline:40px
}
.toolbar {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:44px;
  min-width:0
}
.toolbar>label {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0)
}
#history {
  width:320px;
  font-size:13px;
  border-color:var(--control-border);
  background:var(--surface)
}
select,select option,select optgroup { background-color:var(--surface);color:var(--ink);color-scheme:dark }
#test-history { width:100%;font-size:13px }
.toolbar button {
  font-size:13px
}
.session-tools {
  margin-inline-start:auto;
  position:relative;
  font-size:13px
}
.session-tools[open] {
  background:var(--surface);
  padding:0 16px 12px;
  border-radius:10px
}
.session-tools>span,.session-tools>button {
  display:block;
  margin:0
}
.session-tools>summary {
  text-align:end
}
.session-tools>span {
  color:var(--muted);
  padding:8px 0
}
.case-header {
  margin-bottom:28px
}
.route-line {
  font-size:13px;
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px
}
.route-line>span:last-child {
  margin-inline-start:8px;
  color:var(--muted)
}
.case-header h1 {
  margin-bottom:0
}
.journey {
  display:flex;
  list-style:none;
  padding:0;
  margin:0 0 34px;
  max-width:670px;
  gap:0;
  font-size:13px
}
.journey li {
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  color:var(--muted);
  padding-bottom:20px
}
.step-dot {
  display:grid;
  place-content:center;
  flex:none;
  width:22px;
  height:22px;
  border:1px solid var(--control-border);
  border-radius:50%;
  font-size:12px
}
.journey li.current {
  color:var(--ink)
}
.journey li.current .step-dot {
  border-color:var(--attention);
  color:var(--attention)
}
.journey li.done .step-dot {
  color:var(--bg);
  background:var(--good);
  border-color:var(--good)
}
.step-line {
  position:absolute;
  inset-inline:0 8px;
  bottom:0;
  height:2px;
  background:var(--line);
  transform-origin:left
}
.journey li.done .step-line {
  background:var(--good)
}
.workspace-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:68px;
  align-items:start
}
.recovery {
  grid-column:1;
  grid-row:1;
  min-width:0
}
.arrival-sheet {
  grid-column:2;
  grid-row:1;
  position:sticky;
  top:24px;
  background:var(--surface);
  padding:26px;
  border-radius:16px;
  min-width:0
}
.manifest-top {
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:13px;
  margin-bottom:25px;
  color:var(--muted)
}
.manifest-top>span:last-child {
  color:var(--ink)
}
.seat-group {
  position:relative;
  margin-bottom:22px
}
.seat-group-label {
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:13px;
  margin-bottom:12px;
  color:var(--muted)
}
.is-withdrawn .seat-group-label>span:first-child {
  text-decoration:line-through;
  text-decoration-color:var(--attention)
}
.is-held .seat-group-label {
  color:var(--ink)
}
.seats {
  display:grid;
  grid-template-columns:repeat(10,minmax(0,1fr));
  gap:7px
}
.seat {
  position:relative;
  aspect-ratio:.82;
  border:1px solid var(--control-border);
  border-radius:5px 5px 3px 3px;
  isolation:isolate
}
.seat::after {
  content:'';
  position:absolute;
  bottom:3px;
  inset-inline:3px;
  height:1px;
  background:var(--control-border)
}
.seat-fill {
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:var(--good);
  opacity:0;
  transform-origin:50% 100%;
  z-index:-1
}
.is-held .seat-fill {
  opacity:1
}
.is-held .seat {
  border-color:var(--good)
}
.is-held .seat::after {
  background:var(--bg)
}
.seat b {
  position:absolute;
  inset:0;
  display:grid;
  place-content:center;
  font:400 15px/1 var(--sans);
  color:var(--ink)
}
.is-held .seat b {
  color:var(--bg)
}
.manifest-key {
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  font-size:12px;
  color:var(--muted);
  margin:24px 0
}
.manifest-key>span {
  display:flex;
  gap:5px;
  align-items:center
}
.key-seat {
  width:9px;
  height:11px;
  border:1px solid var(--control-border);
  border-radius:2px
}
.key-seat.held {
  background:var(--good);
  border-color:var(--good)
}
.budget {
  margin-top:28px
}
.budget>div:first-child {
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:13px;
  margin-bottom:12px;
  color:var(--muted)
}
#budget-label {
  color:var(--ink)
}
.budget-track {
  height:3px;
  background:var(--line);
  overflow:hidden;
  border-radius:2px
}
#budget-fill {
  display:block;
  height:100%;
  background:var(--muted);
  transform:scaleX(0);
  transform-origin:left
}
.manifest-route {
  font-size:12px;
  display:flex;
  justify-content:space-between;
  margin:22px 0 0
}
.reading-choices {
  display:flex;
  gap:20px;
  margin-bottom:22px;
  flex-wrap:wrap
}
.reading-choices button {
  min-height:36px;
  padding:0 0 7px;
  border:0;
  border-radius:0;
  border-bottom:1px solid transparent;
  font-size:13px;
  color:var(--muted);
  background:transparent;
  margin:0
}
.reading-choices button[aria-pressed='true'] {
  color:var(--ink);
  border-color:var(--action)
}
.message-heading {
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:13px;
  color:var(--muted);
  margin-bottom:13px
}
.message-heading>span:last-child {
  font-size:12px
}
.supplier-message {
  font-size:15px;
  line-height:1.65;
  margin-bottom:26px;
  color:var(--ink)
}
.extracted-facts {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin:0 0 28px
}
.extracted-fact dt {
  font-size:13px;
  color:var(--muted)
}
.extracted-fact dd {
  font-size:17px;
  font-weight:500;
  margin:4px 0 7px
}
.extracted-fact blockquote {
  font-size:13px;
  color:var(--muted);
  margin:0
}
.extracted-fact blockquote::before {
  content:'“'
}
.extracted-fact blockquote::after {
  content:'”'
}
.questions {
  color:var(--attention);
  font-size:13px;
  padding-inline-start:18px
}
.review-form {
  margin-top:26px;
  padding-top:22px;
  border-top:1px solid var(--line)
}
.review-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
  font-weight:500
}
.review-counts {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-bottom:18px
}
.review-confirm {
  display:flex;
  align-items:flex-start;
  gap:10px;
  line-height:1.55;
  font-size:13px;
  margin:0 0 12px;
  color:var(--ink)
}
.review-form .small {
  font-size:12px;
  margin-bottom:20px
}
.review-actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:2px
}
.review-actions button+button { margin-inline-start:0 }
#review-feedback:empty {
  display:none
}
.vehicle-table {
  width:100%;
  margin-bottom:28px
}
.vehicle-columns,.vehicle-row {
  display:grid;
  grid-template-columns:minmax(150px,1.8fr) .5fr 1.1fr .6fr .8fr;
  gap:14px;
  align-items:center
}
.vehicle-columns {
  font-size:12px;
  color:var(--muted);
  padding-bottom:16px
}
.vehicle-row {
  position:relative;
  min-height:100px;
  padding:22px 0;
  border-top:1px solid var(--line);
  font-size:13px
}
.vehicle-name {
  font-size:17px;
  font-weight:500;
  line-height:1.4
}
.vehicle-name small {
  display:block;
  font-size:12px;
  font-weight:400;
  color:var(--muted);
  margin-top:7px
}
.vehicle-state {
  font-size:12px;
  color:var(--muted)
}
.vehicle-row.withdrawn .vehicle-name {
  text-decoration:line-through
}
.vehicle-row::before,.seat-group::before {
  content:'';
  position:absolute;
  inset:0 -10px;
  border-radius:8px;
  pointer-events:none;
  background:var(--ink);
  opacity:0;
  z-index:-1
}
.seat-group::before {
  inset:-8px;
  z-index:0
}
.seat-group>* {
  position:relative
}
.vehicle-row {
  isolation:isolate
}
.vehicle-row.linked::before,.seat-group.linked::before {
  opacity:.09
}
#execution:empty {
  display:none
}
.disruption {
  margin-top:26px
}
.disruption summary {
  color:var(--muted);
  font-size:13px
}
.disruption button {
  font-size:13px;
  margin:0 12px 12px 0
}
.confirmed-review {
  margin-top:24px;
  font-size:13px
}
#viewer-note {
  font-size:13px;
  color:var(--attention);
  margin-bottom:24px
}
.view-only #ai-form,.view-only .try-message {
  display:none
}
.evidence-drawer {
  margin-top:34px;
  border-top:1px solid var(--line)
}
.evidence-drawer>summary {
  display:flex;
  gap:16px;
  align-items:center;
  padding-block:20px;
  font-size:13px;
  list-style:none
}
.evidence-drawer>summary::before {
  content:'+';
  color:var(--action);
  font-size:17px;
  font-weight:300
}
.evidence-drawer[open]>summary::before {
  content:'−'
}
.evidence-drawer>summary>span {
  margin-inline-start:auto;
  font-size:12px;
  color:var(--muted)
}
.evidence-tabs {
  display:flex;
  gap:20px;
  border-bottom:1px solid var(--line);
  margin-bottom:24px
}
.evidence-tabs button {
  background:none;
  border:0;
  border-radius:0;
  padding:10px 0;
  margin:0;
  color:var(--muted);
  font-size:13px
}
.evidence-tabs button[aria-selected='true'] {
  color:var(--ink);
  border-bottom:2px solid var(--action)
}
[role='tabpanel'] {
  font-size:13px;
  line-height:1.6
}
.check-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin:24px 0
}
.check-card>strong {
  color:var(--good)
}
.check-failed>strong {
  color:var(--attention)
}
.check-card details {
  font-size:12px
}
.check-card blockquote,.source-card blockquote {
  font-size:13px
}
.option-row {
  margin-block:20px
}
#source-search {
  margin-top:30px
}
.search-row {
  display:flex;
  gap:12px
}
.source-card {
  margin-top:15px
}
.source-card summary span {
  color:var(--muted)
}
.timeline {
  list-style:none;
  padding:0
}
.timeline li {
  padding:18px 0;
  border-bottom:1px solid var(--line)
}
.timeline time {
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-bottom:7px
}
.timeline blockquote {
  font-size:13px;
  margin:10px 0
}
.timeline p {
  margin:8px 0
}
.ai-facts {
  display:flex;
  gap:25px
}
.ai-facts dd {
  margin:0
}
.ai-result {
  margin-block:20px
}
.badge {
  font-size:12px;
  color:var(--muted)
}
.safety-example h3 {
  margin-top:12px
}
.feedback.error {
  padding:16px;
  border:1px solid var(--attention);
  color:var(--attention);
  border-radius:8px;
  margin-bottom:24px
}
.connect {
  max-width:560px;
  margin:60px auto
}
.connect h2 {
  font:400 38px/1.1 var(--serif)
}
.connect form {
  margin-top:26px
}
.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}
.actions button {
  margin:0
}
footer {
  max-width:1344px;
  margin:0 auto;
  padding:26px 40px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:12px;
  color:var(--muted)
}
.footer-credit {
  margin-inline-start:8px
}
.project-intro {
  max-width:900px;
  margin:90px auto 120px;
  padding:0 40px
}
.project-intro h1 {
  font-size:64px;
  max-width:22ch
}
.project-intro p {
  font-size:17px;
  max-width:50ch;
  margin-block:25px 32px
}
.portfolio-link {
  display:inline-block;
  margin-inline-start:25px;
  font-size:13px
}
@media (prefers-reduced-motion:no-preference) {
  body:not(.keyboard-input) button:not(:disabled):not(.text-button):not([role='tab']):not([data-reading]):active:not(:focus-visible),.button:active:not(:focus-visible) {
    transform:scale(.97);
    transition:transform 120ms var(--ease-out)
  }
}
@media (hover:hover) and (pointer:fine) {
  button:hover {
    filter:brightness(1.08)
  }
  .vehicle-row::before,.seat-group::before {
    transition:opacity 100ms var(--ease-out)
  }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}
@media (max-width:1100px) {
  .workspace-grid {
    grid-template-columns:minmax(0,1fr) 310px;
    gap:32px
  }
  .arrival-sheet {
    padding:22px
  }
  .desk {
    padding-inline:28px
  }
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(125px,1.7fr) .5fr .65fr .6fr;
    gap:10px
  }
  .vehicle-columns>span:last-child {
    display:none
  }
  .vehicle-state {
    grid-column:1/-1;
    margin-top:-8px
  }
  .vehicle-row {
    padding:18px 0
  }
  .seats {
    gap:5px
  }
  .seat b {
    font-size:13px
  }
}
@media (max-width:820px) {
  .workspace-grid {
    display:flex;
    flex-direction:column;
    gap:28px
  }
  .recovery,.arrival-sheet {
    width:100%
  }
  .arrival-sheet {
    position:static;
    padding:18px 20px;
    border-radius:12px
  }
  .manifest-top {
    margin-bottom:14px
  }
  .seat-group {
    margin-bottom:14px
  }
  .seat-group-label {
    font-size:12px;
    margin-bottom:7px
  }
  #seat-map {
    display:flex;
    gap:18px;
    flex-wrap:wrap
  }
  .seat-group {
    flex:1;
    min-width:130px
  }
  .seats {
    grid-template-columns:repeat(10,minmax(0,1fr));
    gap:4px;
    max-width:310px
  }
  .seat {
    max-width:23px;
    min-height:13px
  }
  .seat b {
    font-size:12px
  }
  .manifest-key {
    margin:12px 0 0;
    font-size:12px
  }
  .budget {
    margin-top:18px
  }
  .manifest-route {
    display:none
  }
  .journey {
    margin-bottom:24px
  }
  .case-header {
    margin-bottom:24px
  }
  .case-header h1 {
    max-width:24ch
  }
  .evidence-drawer {
    margin-top:28px
  }
}
@media (max-width:520px) {
  :root {
    --text-title:34px
  }
  .topbar {
    padding:20px;
    gap:14px
  }
  .product-label {
    display:none
  }
  .brand {
    font-size:17px
  }
  .topbar>a:last-child {
    font-size:12px
  }
  .desk {
    padding-inline:20px;
    margin-top:14px;
    margin-bottom:44px
  }
  .toolbar {
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:30px
  }
  #history {
    width:205px;
    min-width:0;
    padding:10px 8px
  }
  .toolbar>button {
    padding:9px 12px
  }
  .session-tools {
    font-size:12px
  }
  .session-tools[open] {
    width:100%
  }
  .route-line {
    font-size:12px;
    gap:7px;
    margin-bottom:16px;
    flex-wrap:wrap
  }
  .route-line>span:last-child {
    margin-inline-start:0
  }
  .journey {
    font-size:12px
  }
  .journey li {
    gap:5px;
    padding-bottom:14px
  }
  .step-dot {
    width:18px;
    height:18px;
    font-size:12px
  }
  .arrival-sheet {
    padding:16px
  }
  .manifest-top {
    font-size:12px
  }
  #seat-map {
    gap:14px
  }
  .seat-group {
    min-width:125px
  }
  .seat-group-label {
    font-size:12px
  }
  .seats {
    grid-template-columns:repeat(10,minmax(0,1fr));
    gap:3px
  }
  .seat {
    border-radius:3px;
    min-height:11px
  }
  .seat::after {
    bottom:2px;
    inset-inline:2px
  }
  .seat b {
    font-size:9px
  }
  .budget>div:first-child {
    font-size:12px
  }
  .reading-choices {
    gap:22px;
    margin-bottom:18px
  }
  .message-heading {
    font-size:12px
  }
  .message-heading>span:last-child {
    font-size:12px
  }
  .supplier-message {
    font-size:15px;
    margin-bottom:22px
  }
  .extracted-facts {
    gap:20px;
    margin-bottom:22px
  }
  .extracted-fact dd {
    font-size:17px
  }
  .extracted-fact blockquote {
    font-size:12px
  }
  .review-form {
    padding-top:16px;
    margin-top:20px
  }
  input,select,textarea {
    font-size:13px
  }
  .review-top {
    font-size:13px
  }
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(125px,1fr) 42px 49px 43px;
    gap:8px
  }
  .vehicle-columns {
    font-size:12px;
    padding-bottom:12px
  }
  .vehicle-row {
    font-size:13px
  }
  .vehicle-name {
    font-size:15px
  }
  .vehicle-name small {
    font-size:12px
  }
  .vehicle-state {
    font-size:12px
  }
  .evidence-drawer>summary>span {
    font-size:12px
  }
  .evidence-tabs {
    gap:22px
  }
  .check-grid {
    grid-template-columns:1fr
  }
  .search-row {
    flex-wrap:wrap
  }
  .search-row input {
    flex:1;
    min-width:150px
  }
  footer {
    padding:22px 20px;
    flex-direction:column;
    gap:12px
  }
  .connect {
    margin:35px 0
  }
  .project-intro {
    padding-inline:24px;
    margin:65px auto
  }
  .project-intro h1 {
    font-size:42px
  }
  .project-intro p {
    font-size:13px
  }
  .portfolio-link {
    margin:22px 0 0;
    display:block
  }
}
@media (max-width:360px) {
  .desk {
    padding-inline:16px
  }
  .topbar {
    padding-inline:16px
  }
  #history {
    width:180px
  }
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(100px,1fr) 34px 43px 39px;
    gap:5px
  }
  .journey {
    font-size:12px
  }
  .journey li {
    gap:3px
  }
  .seat-group {
    min-width:105px
  }
  .route-line {
    font-size:12px
  }
}
.wheelchair-icon {
  width:15px;
  height:15px;
  vertical-align:-2px;
  flex:none
}
.seat b .wheelchair-icon {
  width:14px;
  height:14px
}
.motion-setting {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:12px
}
.reduce-motion *, .reduce-motion *::before,.reduce-motion *::after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important
}
.reduce-motion button:active {
  transform:none!important
}
@media (max-width:820px) {
  .seat-group:only-child .seats {
    grid-template-columns:repeat(18,minmax(0,1fr));
    max-width:none
  }
  .seat {
    aspect-ratio:auto;
    height:17px;
    max-width:none
  }
  .seat b .wheelchair-icon {
    width:10px;
    height:12px
  }
  .manifest-key .wheelchair-icon {
    width:11px;
    height:11px
  }
  .seat-group {
    margin-bottom:2px
  }
  .unknown-group {
    font-size:13px;
    margin:0
  }
}
.message-heading>span:last-child,.manifest-key,.timeline time,.source-card summary span,.source-card>.small,.manifest-route {
  color:var(--quiet)
}
.arrival-margin {
  display:block;
  font-size:12px;
  line-height:1.45;
  color:var(--muted);
  margin-top:5px;
  font-weight:400
}
.extracted-fact dd {
  font-size:17px
}
.extracted-fact blockquote,.extracted-fact>.small {
  color:var(--quiet)
}
@media (hover:hover) and (pointer:fine) {
  #history:hover {
    border-color:var(--line-hover)
  }
  button:hover {
    filter:none
  }
  button {
    transition:background-color 100ms var(--ease-out),color 100ms var(--ease-out)
  }
}
@media (max-width:1100px) {
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(125px,1.5fr) .5fr 1fr .6fr
  }
}
@media (max-width:520px) {
  .journey li {
    flex-direction:column;
    align-items:flex-start;
    gap:7px
  }
  .journey {
    font-size:12px
  }
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(115px,1.25fr) 36px minmax(68px,.8fr) 39px;
    gap:8px
  }
  .arrival-margin {
    font-size:12px
  }
  .message-heading {
    flex-wrap:wrap;
    gap:4px 15px
  }
  .vehicle-state {
    grid-column:1/-1
  }
  .brand {
    font-size:17px
  }
  input,select,textarea {
    font-size:16px
  }
}
@media (max-width:360px) {
  .vehicle-columns,.vehicle-row {
    grid-template-columns:minmax(88px,1fr) 40px 62px 35px;
    gap:8px
  }
  .evidence-tabs {
    gap:18px
  }
}

.keyboard-input .vehicle-row::before,.keyboard-input .seat-group::before { transition:none; }

/* One button family. Tabs keep their own selection treatment. */
button[role='tab'],button[data-reading] { box-shadow:none }
@media (hover:hover) and (pointer:fine) {
  button:not(.secondary):not(.text-button):not([role='tab']):not([data-reading]):not(:disabled):hover,.button:hover { background-color:var(--action-hover) }
  button.secondary:not([data-reading]):not(:disabled):hover { background-color:rgb(240 244 238 / .05);border-color:var(--muted) }
}
@media (any-pointer:coarse),(max-width:820px) {
  button:not([role='tab']):not([data-reading]),.button { min-height:44px }
}
button.is-loading { overflow:hidden;cursor:wait }
button.is-loading::after {
  content:'';
  position:absolute;
  bottom:2px;
  inset-inline:8px;
  height:2px;
  background:currentColor;
  border-radius:1px;
  opacity:.65;
  transform:scaleX(.7)
}
@media (prefers-reduced-motion:no-preference) {
  body:not(.reduce-motion):not(.keyboard-input) button.is-loading::after { animation:button-progress 1000ms linear infinite }
}
@keyframes button-progress { from { transform:translateX(-110%) scaleX(.5) } to { transform:translateX(110%) scaleX(.5) } }
@media (max-width:820px) {
  #history { width:100%;flex:1 1 270px;min-width:0 }
}
/* Review facts: one received message and one deliberate confirmation. Lagoon palette. */
.case-switcher { position:relative;min-width:0;max-width:100% }
#history-trigger { min-width:210px;max-width:100%;justify-content:space-between;gap:20px;background-color:var(--surface);text-align:start }
#case-selection { white-space:normal }
#history.case-menu { position:absolute;inset-block-start:calc(100% + 8px);inset-inline-start:0;z-index:20;width:min(360px,calc(100vw - 40px));padding:6px;border:1px solid var(--line-hover);border-radius:12px;background:var(--raised);box-shadow:0 14px 40px rgb(0 0 0 / .4) }
.case-menu button.secondary { display:flex;width:100%;min-height:44px;text-align:start;justify-content:flex-start;white-space:normal;border:0;background:transparent;box-shadow:none;margin:0;padding:10px 12px;font-weight:400 }
.case-menu button[aria-current='true'] { background:var(--surface);font-weight:500 }
.case-menu button[aria-current='true']::after { content:'✓';margin-inline-start:auto;color:var(--good) }
#role-summary { display:flex;align-items:center;gap:8px }
#role-summary::before { content:'';width:6px;height:6px;border-radius:50%;background:var(--good) }
.view-only #role-summary::before { background:var(--muted) }
.supplier-reading { border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:inset 0 1px 0 rgb(240 244 238 / .05),0 24px 48px -32px rgb(0 0 0 / .6);overflow:hidden }
.supplier-reading .message-heading { justify-content:flex-start;align-items:center;margin:0;padding:20px 24px 0;gap:12px;font-weight:500 }
.supplier-reading .message-heading>span:last-child { margin-inline-start:auto;font-weight:400 }
.supplier-avatar { display:grid;place-items:center;flex:0 0 32px;height:32px;border-radius:50%;background:var(--raised);box-shadow:inset 0 1px 0 var(--line-hover) }
.supplier-avatar svg { width:18px;height:18px }
.supplier-reading .supplier-message { font:400 21px/1.5 var(--serif);margin:0;padding:16px 24px 24px 68px;max-width:42em }
.supplier-message mark { background:rgb(240 244 238 / .1);color:inherit;border-bottom:1px solid rgb(240 244 238 / .65);border-radius:3px 3px 0 0;box-decoration-break:clone;-webkit-box-decoration-break:clone }
.supplier-message mark.fact-linked { background:rgb(240 244 238 / .25) }
.not-a-count { text-decoration:underline dashed var(--muted);text-underline-offset:4px }
.count-caution { font:400 12px/1.5 var(--sans);color:var(--muted);background:var(--raised);border-radius:5px;padding:2px 6px;margin-inline-start:6px;white-space:nowrap }
.reading-summary { padding:16px 24px 22px;border-top:1px solid var(--line) }
.reading-summary>p,.reading-questions>p { font-size:12px;color:var(--muted);margin:0 0 12px }
.fact-chips { display:flex;gap:12px;flex-wrap:wrap;margin:0 }
.fact-chip { display:flex;align-items:baseline;gap:12px;padding:11px 14px;border:1px solid var(--control-border);border-radius:10px;background:var(--bg) }
.fact-chip dt { font-size:13px;color:var(--muted) }
.fact-chip dd { font-size:17px;font-weight:500;margin:0 }
.fact-chip.fact-linked { border-color:var(--ink);background:rgb(240 244 238 / .06) }
.fact-chip.unknown { border-style:dashed;border-color:var(--muted) }
.fact-chip.unknown dd { font-weight:400;color:var(--muted) }
.reading-questions { padding:0 24px 18px }
.reading-questions .questions { margin:0;color:var(--ink);font-size:15px;line-height:1.6 }
.review-form { padding-top:0;border:0;margin-top:22px }
.correction-note { font-size:13px;color:var(--muted);margin:0 0 16px;max-width:52ch }
.review-counts { max-width:420px }
.reading-choices { display:inline-flex;gap:3px;margin-bottom:16px;padding:3px;background:rgb(240 244 238 / .025);border:1px solid var(--line);border-radius:10px }
.reading-choices button { padding:8px 14px;min-height:34px;border:0;border-radius:7px }
.reading-choices button[aria-pressed='true'] { background:var(--raised);box-shadow:inset 0 1px 0 var(--line-hover),0 1px 2px rgb(0 0 0 / .2) }
.arrival-sheet { box-shadow:inset 0 1px 0 rgb(240 244 238 / .06),0 18px 40px -30px rgb(0 0 0 / .7) }
.seat-group:not(.is-held):not(.is-withdrawn) .seat { background:rgb(240 244 238 / .13);border-color:var(--control-border) }
.key-seat:not(.held) { background:rgb(240 244 238 / .13) }
@media (max-width:820px) {
  .case-switcher { flex:1;max-width:calc(100% - 112px) }
  #history-trigger { min-width:0;width:100%;gap:8px }
  .reading-choices button { min-height:44px }
  .supplier-reading .message-heading { padding:16px 18px 0;gap:10px }
  .supplier-reading .supplier-message { font-size:19px;padding:16px 18px 22px }
  .reading-summary { padding:16px 18px 18px }
  .reading-questions { padding:0 18px 18px }
  .fact-chips { gap:8px }
  .fact-chip { padding:10px;gap:8px }
  .review-actions { gap:10px }
}
@media (max-width:360px) {
  .supplier-reading .message-heading>span:last-child { display:none }
  .fact-chip { flex:1;justify-content:space-between }
}
@media (forced-colors:active) {
  .seat { border-color:CanvasText }
  .is-held .seat { background:Highlight }
  .fact-chip,.supplier-message mark { border-color:CanvasText }
}
.topbar .toolbar { margin:0;flex:1;gap:16px }
.topbar { border-bottom:1px solid var(--line);gap:24px }
.topbar #history-trigger { min-width:205px }
.desk { margin-top:42px }
.reading-choices { position:relative;display:inline-grid;grid-template-columns:repeat(var(--choice-count),minmax(0,1fr));gap:0 }
.reading-thumb { position:absolute;inset-block:3px;inset-inline-start:3px;width:calc((100% - 6px) / var(--choice-count));border-radius:7px;background:var(--raised);box-shadow:inset 0 1px 0 var(--line-hover),0 1px 2px rgb(0 0 0 / .2);pointer-events:none }
.reading-choices button { position:relative }
.reading-choices button[aria-pressed='true'] { background:transparent;box-shadow:none }
@media (prefers-reduced-motion:no-preference) {
  body:not(.reduce-motion):not(.keyboard-input) .reading-thumb { transition:transform 220ms var(--ease-out) }
}
@media (max-width:820px) {
  .topbar { gap:14px;flex-wrap:wrap }
  .topbar .toolbar { flex-basis:100%;order:3;gap:10px }
  .topbar #history-trigger { min-width:0 }
  .desk { margin-top:26px }
}
.session-tools[open] { padding:0;background:transparent }
.session-panel { position:absolute;inset-inline-end:0;inset-block-start:calc(100% + 12px);min-width:240px;padding:18px;z-index:21;background:var(--raised);border:1px solid var(--line-hover);border-radius:12px;box-shadow:0 14px 40px rgb(0 0 0 / .4) }
.session-panel>span,.session-panel>button { display:block;margin:0 }
.session-panel .text-button { padding-block:12px;min-height:44px }
.reading-choices { --choice-count:2 }
.topbar #new-case { display:none }
@media (max-width:820px) { .session-tools[open] { width:auto } }

/* Withdrawal remains legible without colour; held places keep a solid fill. */
.is-withdrawn .seat { border-color:var(--attention);border-style:dashed }
.is-withdrawn .seat::after { background:var(--attention) }
.vehicle-row.withdrawn .vehicle-state { color:var(--attention) }
@media (forced-colors:active) {
  :focus-visible { outline-color:Highlight }
  .journey li.done .step-dot { background:Highlight;color:HighlightText;border-color:Highlight }
  .is-withdrawn .seat { border-color:CanvasText }
}
/* Visitor choices use the same Lagoon desk, with no new colour vocabulary. */
.visitor-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px}
.visitor-choices button{white-space:normal;min-height:52px;text-align:left}
.visitor-choices button[aria-pressed="true"]{border-color:var(--action);color:var(--ink);box-shadow:inset 0 -3px var(--action)}
#custom-case h2{margin-top:0}
#custom-message{width:100%;box-sizing:border-box}
.visitor-fallback{max-width:1200px;margin:20px auto;padding:0 24px;color:var(--muted)}
.visitor-mode .connect{max-width:740px}
.visitor-mode .case-switcher { display:none }
.recorded-steps{max-width:1000px;margin:36px auto}.recorded-steps section{padding:32px 0;border-top:1px solid var(--line)}.recorded-steps img{width:100%;height:auto;display:block;margin-top:24px}.recorded-steps h2{max-width:740px}
@media(max-width:600px){.visitor-mode .arrival-sheet{padding:18px}.visitor-mode #intake .visitor-choices{margin-bottom:18px}.visitor-fallback{padding:0 20px}}

/* Fictional directory provenance and the next recovery action stay readable. */
.disruption { margin-top:24px;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface) }
.disruption h2 { margin-top:0 }
.disruption .withdrawal { display:block;margin-top:12px;white-space:normal;text-align:left }
.directory-preview { margin-block:16px }
.directory-offers { list-style:none;padding:0 }
.directory-offers li { display:grid;gap:4px;padding-block:12px;border-bottom:1px solid var(--line) }
.directory-offers small,.quote-reference { overflow-wrap:anywhere;color:var(--muted) }
#template-conditions { overflow-wrap:anywhere }
@media (max-width:600px) {
  .vehicle-columns,.vehicle-row { grid-template-columns:minmax(0,1fr) 40px 66px 76px;gap:8px }
  .vehicle-name { min-width:0;overflow-wrap:anywhere }
  .budget>div:first-child { flex-wrap:wrap;gap:6px }
}

#rebooking-alert { margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line) }
#rebooking-alert h2 { margin-top:0 }

/* Choose a case before showing its recovery desk. */
#case-library { max-width:960px;margin-inline:auto }
.library-header { max-width:680px;margin-bottom:36px }
.library-header h1 { font-family:var(--serif);font-size:var(--text-title);font-weight:400;line-height:1.1;margin:12px 0 18px;text-wrap:balance }
.library-header>p:last-child { color:var(--muted);font-size:17px;line-height:1.6;max-width:60ch }
.eyebrow,.case-route { color:var(--muted);font-size:var(--text-caption) }
.library-heading { display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px }
.library-heading h2,#visitor-case-list h2 { margin:0;font-size:var(--text-vehicle);font-family:var(--sans);font-weight:500 }
.library-heading p { margin:8px 0 0 }
.library-heading button { flex-shrink:0;min-height:44px }
.case-examples { display:grid;grid-template-columns:1fr 1fr;gap:20px }
.case-examples article { display:flex;flex-direction:column;align-items:flex-start;background:var(--surface);border-radius:16px;padding:24px }
.case-examples h3 { font-family:var(--serif);font-size:28px;font-weight:400;line-height:1.15;margin:6px 0 12px;text-wrap:balance }
.case-examples p { margin:0 0 12px;line-height:1.6 }
.case-examples p:not(.case-route) { color:var(--muted) }
.case-examples button { margin-top:auto;min-height:44px;white-space:normal;text-align:start }
.library-note { margin-block:28px }
#visitor-case-list { margin-top:32px;padding-top:24px;border-top:1px solid var(--line) }
#visitor-cases { display:grid;gap:12px;margin-top:16px }
.saved-case { display:grid;grid-template-columns:1fr auto;gap:6px 16px;text-align:start;padding:16px;min-width:0 }
.saved-case small { color:var(--muted);grid-column:1;font-weight:400 }
.saved-case>span:last-child { grid-column:2;grid-row:1 / 3 }
#back-to-cases { margin-bottom:24px;min-height:44px }
.visitor-draft .arrival-sheet { display:none }
.visitor-draft .workspace-grid { display:block;max-width:740px }
.visitor-draft #plan-evidence { margin-top:32px }
.visitor-draft .case-header { max-width:740px }
.case-intro { font-size:17px;line-height:1.6;max-width:60ch }
#rebooking-result .fact-chips { margin-block:24px }
.guest-records { margin-top:28px }
.guest-record-scroll { max-height:280px;overflow:auto;overscroll-behavior:contain;margin-top:12px }
.guest-record-scroll table { width:100%;border-collapse:collapse;text-align:start }
.guest-record-scroll th,.guest-record-scroll td { text-align:start;padding:10px 12px;border-bottom:1px solid var(--line) }
.guest-record-scroll th { color:var(--muted);font-weight:500 }
.guest-record-scroll td small { display:block;color:var(--muted);margin-top:4px }
.record-ids { overflow-wrap:anywhere }
.case-examples { grid-template-columns:repeat(2,minmax(0,1fr)) }
.case-examples .featured-case { grid-column:1 / -1 }
.case-picker-link { display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border:1px solid var(--control-border);border-radius:8px;color:var(--ink);text-decoration:none;white-space:nowrap }
.case-picker-link:hover { background:var(--surface) }
.case-next-actions { margin-top:32px;padding-top:24px;border-top:1px solid var(--line) }
.case-next-actions h2 { font-size:20px;margin-top:0 }
.case-next-actions p { color:var(--muted);line-height:1.6;max-width:62ch }
.case-next-actions .actions { flex-wrap:wrap;gap:12px }
#restart-allowance { margin:14px 0 0;color:var(--muted) }
#new-attempt-note { margin-block:0 24px;color:var(--muted);max-width:65ch }
@media(max-width:600px) {
  .topbar { gap:12px }
  .topbar>a:last-child { margin-inline-start:auto }
  .topbar .case-picker-link { margin-inline-start:auto }
  .case-next-actions .actions { align-items:stretch;flex-direction:column }
}
.other-examples { margin-top:4px }
.other-examples article { margin-top:16px }
.journey-constraints { border:0;padding:0;margin:24px 0;min-width:0 }
.journey-constraints legend { font-size:20px;font-weight:600;margin-bottom:12px }
.journey-constraints label { display:block;margin-top:18px;margin-bottom:8px }
.journey-constraints input,.journey-constraints select { min-height:44px;max-width:100% }
.field-error { color:var(--attention);line-height:1.5 }
.next-step { color:var(--muted);margin:0 0 24px;max-width:68ch;line-height:1.5 }
.handover { border-top:1px solid var(--line);padding-top:24px;margin-bottom:28px }
.handover li { margin-block:10px;line-height:1.6 }
#execution { margin-top:24px }
@media(max-width:820px) {
  .arrival-sheet .manifest-route { display:flex;gap:8px;flex-wrap:wrap }
  .visitor-mode .small,.visitor-mode .reading-summary>p { font-size:14px;line-height:1.5 }
  .visitor-mode .case-header h1 { font-size:32px }
}
.missing-transfer-check { margin-top:28px }
.missing-transfer-check button { margin-top:12px }
#review-resolution { width:100%;margin-top:8px }
#review-difference { margin-block:12px }
#overnight-review .review-form { border:0;padding:0 }
.case-notes { margin-top:28px }
.visitor-draft #custom-form { max-width:620px }
#custom-form .review-counts { margin-block:24px }
#rebooking-alert { border:0;padding:0 }
@media(max-width:600px) {
  .library-header { margin-bottom:28px }
  .library-header h1 { font-size:36px }
  .library-heading { flex-wrap:wrap }
  .case-examples { grid-template-columns:1fr;gap:16px }
  .case-examples article { padding:20px }
  .case-examples h3 { font-size:26px }
  .saved-case { white-space:normal }
  .guest-record-scroll th,.guest-record-scroll td { padding:10px 6px }
}

/* ===== Visual pass, Claude, 3 October 2026 =====
   Lagoon roles stay: sky marks actions, amber marks trouble, held places read by filled shape.
   Radius rule: controls 8px, cards 14px, pills and dots fully round. */
:root {
  --text-caption:14px;
  --text-body:15.5px;
  --card:#183c41;
  --card-edge:rgb(240 244 238 / .09);
  --paper:#1c4248;
}
body {
  background:
    radial-gradient(1200px 520px at 12% -8%, rgb(169 209 181 / .07), transparent 62%),
    radial-gradient(900px 480px at 92% 0%, rgb(187 220 244 / .05), transparent 60%),
    var(--bg);
  background-attachment:fixed;
  min-height:100vh;
  display:flex;
  flex-direction:column
}
body>main { flex:1 0 auto }
/* In a column flexbox, auto margins would shrink these to their content; keep them full width. */
body>header,body>main,body>aside,body>footer { width:100% }
::selection { background:rgb(187 220 244 / .3); color:var(--ink) }
.icon { width:18px; height:18px; flex:none }

/* Progress: the current step is calm ink; amber is kept for real disruptions. */
.journey li.current .step-dot { border-color:var(--ink); color:var(--ink); box-shadow:0 0 0 4px rgb(240 244 238 / .07) }
.journey li.current .step-line { background:rgb(240 244 238 / .5) }

/* Vehicle cards */
.vehicle-cards { display:grid; gap:12px; margin:4px 0 0 }
.vehicle-card {
  background:linear-gradient(180deg,rgb(255 255 255 / .025),transparent 40%),var(--card);
  border:1px solid var(--card-edge);
  border-radius:14px;
  padding:18px 20px 16px;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .04),0 14px 30px -24px rgb(0 0 0 / .8);
  transition:border-color .2s var(--ease-out)
}
.vehicle-card-main { display:flex; align-items:center; gap:14px }
.vehicle-icon { width:28px; height:28px; color:var(--muted); flex:none }
.vehicle-name { display:grid; gap:3px; min-width:0; flex:1 }
.vehicle-name strong { font-size:17px; font-weight:500; line-height:1.3; color:var(--ink) }
.vehicle-name small { display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:13.5px; color:var(--muted) }
.vehicle-name .wheelchair-icon { width:14px; height:14px }
.vehicle-card-facts { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:24px; align-items:end; margin-top:16px; padding-top:14px; border-top:1px solid var(--line) }
.fact-label { display:block; font-size:12px; color:var(--quiet); margin-bottom:4px; letter-spacing:.01em }
.vehicle-arrival strong { font:400 30px/1 var(--serif); letter-spacing:-.02em; color:var(--ink) }
.vehicle-price { text-align:right }
.vehicle-price strong { font-size:17px; font-weight:500; color:var(--ink); white-space:nowrap }
.vehicle-spare { align-self:center; padding-top:16px }
.spare-track { position:relative; height:6px; border-radius:999px; background:rgb(240 244 238 / .08) }
.spare-used { position:absolute; inset:0 auto 0 0; width:var(--at,0%); border-radius:inherit; background:rgb(240 244 238 / .2) }
.spare-pin { position:absolute; top:50%; left:var(--at,0%); width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:var(--bg); border:2px solid var(--ink) }
.spare-track::after { content:""; position:absolute; right:0; top:-5px; bottom:-5px; width:2px; border-radius:2px; background:rgb(240 244 238 / .55) }
.spare-note { margin:8px 0 0; font-size:13px; color:var(--muted) }
.vehicle-state { display:inline-flex; align-items:center; gap:8px; font-size:13.5px; color:var(--muted); white-space:nowrap }
.vehicle-state i { width:11px; height:11px; border-radius:3px; border:1.5px solid var(--control-border); flex:none }
.state-held,.state-kept { color:var(--ink) }
.state-held i,.state-kept i { background:var(--good); border-color:var(--good) }
.state-gone { color:var(--attention) }
.state-gone i { border:1.5px dashed var(--attention) }
.state-new { color:var(--ink) }
.state-new i { border-color:var(--ink) }
.vehicle-card.is-held .spare-pin,.vehicle-card.is-kept .spare-pin { background:var(--good); border-color:var(--good) }
.vehicle-card.is-new { border-color:rgb(240 244 238 / .3) }
.vehicle-card.is-gone { background:transparent; border:1px dashed rgb(244 185 117 / .55); box-shadow:none }
.vehicle-card.is-gone .vehicle-name strong { color:var(--muted); text-decoration:line-through; text-decoration-color:var(--attention) }
.vehicle-card.is-gone .vehicle-icon { color:var(--attention) }
.vehicle-card.is-gone .vehicle-arrival strong,.vehicle-card.is-gone .vehicle-price strong { color:var(--muted) }
.vehicle-card.linked { border-color:rgb(240 244 238 / .35) }

/* One primary action, directly under what it decides */
.primary-action { display:flex; align-items:center; flex-wrap:wrap; gap:12px 16px; margin:22px 0 4px }
.primary-action button { min-height:44px; padding:10px 20px; font-size:14px }
.action-hint { font-size:13.5px; color:var(--muted) }
.plan-tools { display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; margin:26px 0 0; padding-top:20px; border-top:1px solid var(--line) }
.plan-tools:empty { display:none }
.plan-tools button { margin:0 }
.plan-tools p { flex-basis:100%; margin:0; font-size:13.5px }

/* The disruption, said once and plainly, in the main column */
.disruption-notice { display:grid; grid-template-columns:auto 1fr; gap:4px 14px; padding:16px 18px; margin:0 0 20px; border:1px solid rgb(244 185 117 / .5); border-radius:14px; background:rgb(244 185 117 / .07) }
.notice-icon { width:22px; height:22px; color:var(--attention); margin-top:1px }
.disruption-notice strong { display:block; color:var(--attention); font-size:16px; font-weight:500 }
.disruption-notice p { margin:4px 0 0; color:var(--ink); font-size:14.5px }
.disruption-notice .notice-source { color:var(--quiet); font-size:12.5px }
.replacement-summary { color:var(--ink); font-size:16px; line-height:1.55; margin:0 0 18px }
.seat-group-note { margin:10px 0 0; font-size:12.5px; color:var(--muted) }

/* Handover: the end of the story, set like a dispatch slip */
.handover { margin:28px 0 0; background:linear-gradient(180deg,rgb(169 209 181 / .06),transparent 55%),var(--paper); border:1px solid rgb(169 209 181 / .22); border-radius:14px; overflow:hidden; box-shadow:0 20px 40px -30px rgb(0 0 0 / .9) }
.handover-head { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 22px 6px }
.handover-head h2 { margin:0; font:400 30px/1.1 var(--serif); letter-spacing:-.015em }
.handover-seal { display:inline-flex; align-items:center; gap:8px; color:var(--good); font-size:14px; font-weight:500; white-space:nowrap }
.handover-seal .icon { width:20px; height:20px }
.handover-route { margin:0; padding:0 22px 16px; font-size:14px; color:var(--muted); border-bottom:1.5px dashed rgb(240 244 238 / .14); max-width:none }
.handover-rows { list-style:none; margin:0; padding:4px 22px }
.handover-rows li { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:16px; align-items:center; padding:14px 0; border-bottom:1px solid var(--line) }
.handover-rows li:last-child { border-bottom:0 }
.handover-vehicle { display:grid; gap:2px }
.handover-vehicle strong { font-weight:500; font-size:16px }
.handover-vehicle small { color:var(--muted); font-size:13.5px }
.handover-time { font:400 24px/1 var(--serif); text-align:right }
.handover-time .fact-label { font:400 12px var(--sans) }
.handover-foot { display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; padding:16px 22px 18px; background:rgb(0 0 0 / .14) }
.handover-total { margin:0; color:var(--muted); font-size:14px }
.handover-total strong { color:var(--ink); font-size:20px; font-weight:500; margin-inline-start:6px }
.handover-foot .small { flex:1 1 260px; margin:0; color:var(--quiet) }
.handover-foot button { margin-inline-start:auto }
.handover-foot button .icon { width:16px; height:16px }

/* Test a cancellation: an invitation, quieter than the result above it */
.disruption { background:transparent; border:1px dashed rgb(240 244 238 / .18) }
.disruption h2 { font-size:17px }

/* Manifest: the count is the headline of the rail */
.manifest-top { align-items:baseline }
#confirmed-guests { font:400 26px/1 var(--serif); letter-spacing:-.01em }
.arrival-sheet { background:linear-gradient(180deg,rgb(255 255 255 / .02),transparent 30%),var(--surface); border:1px solid var(--card-edge) }

/* A draft group with known counts keeps its seats beside the review */
.visitor-draft.draft-group .arrival-sheet { display:block }
.visitor-draft.draft-group .workspace-grid { display:grid; max-width:none }
.visitor-draft.draft-group .case-header { max-width:none }
@media (max-width:820px) { .visitor-draft.draft-group .workspace-grid { display:flex } }

/* Phone manifest: a wrapped vehicle name must not push its seats below the others */
@media (max-width:820px) {
  #seat-map { display:grid; grid-template-columns:repeat(auto-fit,minmax(125px,1fr)); column-gap:18px; row-gap:14px }
  #seat-map .seat-group { display:grid; grid-template-rows:subgrid; grid-row:span 3; row-gap:0; min-width:0 }
  #seat-map .seat-group-label { margin-bottom:7px }
}
@media (max-width:360px) { #seat-map { grid-template-columns:repeat(auto-fit,minmax(105px,1fr)); column-gap:14px } }

/* Welcome: one composed first view */
.visitor-mode .connect { max-width:1180px; margin:clamp(32px,7vh,88px) auto 40px; padding:0 40px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); grid-template-areas:"copy visual" "actions visual"; column-gap:64px; align-items:center }
.visitor-mode .connect-copy { grid-area:copy; align-self:end }
.visitor-mode .connect #local-access { grid-area:actions; align-self:start; margin-top:26px }
.visitor-mode .connect h2 { font:400 clamp(40px,4.6vw,60px)/1.04 var(--serif); letter-spacing:-.025em; margin-bottom:20px; text-wrap:balance }
.visitor-mode .connect-copy p { font-size:17px; line-height:1.6; max-width:44ch }
.visitor-mode #local-access button { min-height:46px; padding:11px 24px; font-size:15px }
.hero-visual { grid-area:visual; margin:0 }
.hero-board { background:linear-gradient(180deg,rgb(255 255 255 / .03),transparent 45%),var(--surface); border:1px solid var(--card-edge); border-radius:18px; padding:22px 22px 18px; box-shadow:0 30px 60px -40px rgb(0 0 0 / .9),inset 0 1px 0 rgb(255 255 255 / .05) }
.hero-route { display:flex; align-items:center; gap:12px; font-size:13px; color:var(--muted); margin-bottom:16px }
.hero-route i { flex:1; height:2px; background:repeating-linear-gradient(90deg,rgb(240 244 238 / .3) 0 6px,transparent 6px 12px) }
.hero-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; padding:12px 0; border-top:1px solid var(--line) }
.hero-row strong { display:block; font-size:15px; font-weight:500 }
.hero-row small { font-size:12.5px; color:var(--muted) }
.hero-row.is-gone strong { color:var(--muted); text-decoration:line-through; text-decoration-color:var(--attention) }
.hero-row.is-gone small { color:var(--attention) }
.hero-seats,.case-seats { display:grid; grid-template-columns:repeat(10,14px); gap:4px }
.hero-seats i,.case-seats i { position:relative; width:14px; height:16px; border-radius:4px 4px 2px 2px; border:1.5px solid rgb(240 244 238 / .3) }
.hero-seats i .wheelchair-icon,.case-seats i .wheelchair-icon { position:absolute; inset:1px; width:calc(100% - 2px); height:auto }
.hero-row.is-kept i,.hero-row.is-new i { background:var(--good); border-color:var(--good); color:var(--bg) }
.hero-row.is-gone i { border:1.5px dashed var(--attention); color:var(--attention) }
.hero-total { display:flex; justify-content:space-between; gap:12px; padding-top:14px; border-top:1px solid var(--line); font-size:13px; color:var(--muted) }
.hero-total span:first-child { color:var(--good); font-weight:500 }
.hero-visual figcaption { margin-top:12px; font-size:12.5px; color:var(--quiet) }
.visitor-fallback { max-width:1180px; padding:0 40px; margin:8px auto 24px }

/* Chooser */
.case-examples .featured-case { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center }
.case-copy { display:flex; flex-direction:column; align-items:flex-start }
.case-seats { grid-template-columns:repeat(9,16px); gap:5px; padding:18px; border-radius:14px; background:rgb(0 0 0 / .14) }
.case-seats i { width:16px; height:18px }
.case-examples article { border:1px solid var(--card-edge); background:linear-gradient(180deg,rgb(255 255 255 / .025),transparent 40%),var(--surface) }
.case-route { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted) }

@media (max-width:900px) {
  .visitor-mode .connect { grid-template-columns:minmax(0,1fr); grid-template-areas:"copy" "actions" "visual"; padding:0 20px; row-gap:0 }
  .hero-route span { white-space:nowrap }
  .hero-visual { margin-top:36px }
  .case-examples .featured-case { grid-template-columns:1fr }
  .case-seats { justify-self:start }
}
@media (max-width:820px) {
  .vehicle-card-facts { grid-template-columns:auto minmax(0,1fr); gap:14px 20px }
  .vehicle-price { grid-column:1 / -1; text-align:left; display:flex; align-items:baseline; gap:10px }
  .vehicle-price .fact-label { margin:0 }
  .vehicle-card-main { flex-wrap:wrap }
  .vehicle-card-main .vehicle-state { flex-basis:100%; padding-left:42px }
  .handover-rows li { grid-template-columns:auto minmax(0,1fr) auto }
  .handover-rows li .vehicle-state { grid-column:2 / -1 }
  .handover-foot button { margin-inline-start:0 }
}
@media (max-width:520px) {
  .visitor-fallback { padding:0 20px }
  .hero-seats { grid-template-columns:repeat(10,11px); gap:3px }
  .hero-seats i { width:11px; height:13px }
  .hero-row { grid-template-columns:1fr }
  .vehicle-arrival strong { font-size:26px }
  .visitor-mode .connect h2 { font-size:38px }
}
@media (prefers-reduced-motion:reduce) { .vehicle-card { transition:none } }

/* Type pass: serif section heads, 16 px reading text, labels that read as labels */
:root { --text-body:16px; --text-section:24px }
::selection { background:rgb(187 220 244 / .3); color:var(--ink) }
input,textarea { caret-color:var(--action) }
html { scrollbar-color:rgb(240 244 238 / .22) transparent; -webkit-tap-highlight-color:transparent }
p { line-height:1.62 }
button,.button { font-size:14px; letter-spacing:.005em }
h2,.library-heading h2,#visitor-case-list h2,.case-next-actions h2,.journey-constraints legend {
  font:400 var(--text-section)/1.2 var(--serif); letter-spacing:-.012em; text-wrap:balance
}
.disruption h2 { font-size:21px }
.library-header>p:last-child,.case-intro { font-size:18px; line-height:1.6; color:var(--muted) }
.case-examples p { font-size:16px }
.case-examples .case-route { font-size:13px }
.case-examples h3 { letter-spacing:-.012em }
.next-step { font-size:17px }

/* Fields: quiet wells with a clear edge, 16 px text so phones never zoom */
label,.journey-constraints label { font-size:13.5px; font-weight:500; color:rgb(240 244 238 / .86); letter-spacing:.01em }
input,select,textarea { font-size:16px; border-radius:10px; border-color:rgb(240 244 238 / .45); background-color:rgb(0 0 0 / .16); padding:12px 14px; min-height:48px; transition:border-color 150ms var(--ease-out),background-color 150ms var(--ease-out) }
@media (hover:hover) and (pointer:fine) { input:hover,select:hover,textarea:hover { border-color:rgb(240 244 238 / .62) } }
input:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid var(--action); outline-offset:2px; border-color:transparent; background-color:rgb(0 0 0 / .22) }
input[aria-invalid='true'] { border-color:var(--attention) }
input[type='number'] { -moz-appearance:textfield; appearance:textfield }
input[type='number']::-webkit-inner-spin-button,input[type='number']::-webkit-outer-spin-button { -webkit-appearance:none; margin:0 }
select { -webkit-appearance:none; appearance:none; padding-inline-end:40px; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%; background-size:5px 5px; background-repeat:no-repeat }
.field-hint,#template-conditions { margin-top:8px }
.journey-constraints { margin:36px 0 28px }
.journey-constraints legend { margin-bottom:6px }
.journey-constraints label { margin-top:22px }
#custom-heading { margin-bottom:20px }

/* Arrive by: a typeable time set large, 15-minute steps and a slider across the window */
.arrival-picker { max-width:480px; padding:18px 20px 14px; border:1px solid var(--card-edge); border-radius:16px; background:linear-gradient(180deg,rgb(255 255 255 / .03),transparent 60%),var(--surface); box-shadow:inset 0 1px 0 rgb(240 244 238 / .05),0 18px 40px -30px rgb(0 0 0 / .7) }
.arrival-face { display:grid; grid-template-columns:auto auto auto minmax(0,1fr); align-items:center; gap:6px }
.arrival-face input[type='time'] { width:auto; min-height:0; padding:2px 6px; border:0; border-radius:8px; background:transparent; color:var(--ink); font:400 46px/1.05 var(--serif); letter-spacing:-.01em; font-variant-numeric:tabular-nums; transition:color 150ms var(--ease-out) }
.arrival-face input[type='time']:focus-visible { outline-offset:0; background:rgb(0 0 0 / .14) }
.arrival-face input[type='time']::-webkit-calendar-picker-indicator { display:none }
.arrival-face input[type='time']::-webkit-datetime-edit-hour-field:focus,.arrival-face input[type='time']::-webkit-datetime-edit-minute-field:focus,.arrival-face input[type='time']::-webkit-datetime-edit-ampm-field:focus { background:rgb(187 220 244 / .24); color:var(--ink); border-radius:4px }
.arrival-step { width:38px; height:38px; min-height:38px; padding:0; border-radius:50%; border-color:rgb(240 244 238 / .24); background:transparent; color:var(--ink); box-shadow:none; transition:transform 120ms var(--ease-out),background-color 150ms var(--ease-out),border-color 150ms var(--ease-out); touch-action:manipulation }
.arrival-step { position:relative }
.arrival-step::after { content:''; position:absolute; top:50%; left:50%; width:44px; height:44px; transform:translate(-50%,-50%); border-radius:50% }
.arrival-face>* { margin:0 }
.arrival-step .icon { width:16px; height:16px }
.arrival-step:active { transform:scale(.96) }
@media (hover:hover) and (pointer:fine) { .arrival-step:hover { background:rgb(240 244 238 / .06); border-color:rgb(240 244 238 / .42) } }
.arrival-day { margin:0 0 0 14px; font-size:14px; line-height:1.4; color:var(--muted); text-wrap:balance }
.arrival-range { display:block; width:100%; height:26px; min-height:0; margin:14px 0 2px; padding:0; border:0; background:transparent; -webkit-appearance:none; appearance:none; cursor:pointer; touch-action:pan-y }
.arrival-range::-webkit-slider-runnable-track { height:4px; border-radius:2px; background:linear-gradient(90deg,var(--action) var(--fill,50%),rgb(240 244 238 / .14) var(--fill,50%)) }
.arrival-range::-moz-range-track { height:4px; border-radius:2px; background:linear-gradient(90deg,var(--action) var(--fill,50%),rgb(240 244 238 / .14) var(--fill,50%)) }
.arrival-range::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; margin-top:-8px; border-radius:50%; border:0; background:var(--ink); box-shadow:0 0 0 4px var(--surface),0 2px 8px rgb(0 0 0 / .45); transition:transform 120ms var(--ease-out) }
.arrival-range::-moz-range-thumb { width:20px; height:20px; border-radius:50%; border:0; background:var(--ink); box-shadow:0 0 0 4px var(--surface),0 2px 8px rgb(0 0 0 / .45) }
.arrival-range:active::-webkit-slider-thumb { transform:scale(1.1) }
.arrival-range:focus-visible { outline:none }
.arrival-range:focus-visible::-webkit-slider-thumb { box-shadow:0 0 0 4px var(--surface),0 0 0 6px var(--action) }
.arrival-range:focus-visible::-moz-range-thumb { box-shadow:0 0 0 4px var(--surface),0 0 0 6px var(--action) }
.arrival-scale { display:flex; justify-content:space-between; gap:12px; font-size:12.5px; color:var(--quiet) }
.arrival-picker.is-outside .arrival-face input { color:var(--attention) }
@media (max-width:520px) {
  .arrival-picker { padding:16px 16px 12px }
  .arrival-face { grid-template-columns:auto 1fr auto }
  .arrival-face input[type='time'] { justify-self:center; font-size:42px }
  .arrival-day { grid-column:1 / -1; margin:6px 0 0; text-align:center }
}
@media (prefers-reduced-motion:reduce) { .arrival-step,.arrival-range::-webkit-slider-thumb { transition:none } }

/* Mexico card: one short line, and a small flag that ripples out from its pole */
.case-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; margin-top:6px }
.case-examples .case-actions button { margin-top:0 }
.case-examples .case-origin { display:inline-flex; align-items:center; gap:12px; margin:0; font-size:13.5px; color:var(--muted); letter-spacing:.01em }
.case-examples .case-story { font-size:17px; max-width:60ch }
.mx-flag { position:relative; display:inline-flex; flex:none; width:27px; height:18px; margin-inline-start:4px; filter:drop-shadow(0 2px 3px rgb(0 0 0 / .35)) }
.mx-flag::before { content:''; position:absolute; inset-inline-start:-3.5px; top:-3px; width:1.5px; height:27px; border-radius:1px; background:rgb(240 244 238 / .5) }
.mx-flag i { position:relative; flex:none; width:3px; height:18px; background:radial-gradient(circle at 13.5px 9px,#b88a45 0 2.3px,transparent 2.8px),linear-gradient(90deg,#1f7f54 0 9px,#eef2ea 9px 18px,#cf4049 18px 27px); background-size:27px 18px; background-repeat:no-repeat }
.mx-flag i::after { content:''; position:absolute; inset:0; background:#08181a; opacity:0 }
.mx-flag i:first-child { border-radius:1.5px 0 0 1.5px }
.mx-flag i:last-child { border-radius:0 1.5px 1.5px 0 }
.mx-flag i:nth-child(2) { background-position:-3px 0; --a:.3; --d:60ms }
.mx-flag i:nth-child(3) { background-position:-6px 0; --a:.6; --d:120ms }
.mx-flag i:nth-child(4) { background-position:-9px 0; --a:.9; --d:180ms }
.mx-flag i:nth-child(5) { background-position:-12px 0; --a:1.2; --d:240ms }
.mx-flag i:nth-child(6) { background-position:-15px 0; --a:1.5; --d:300ms }
.mx-flag i:nth-child(7) { background-position:-18px 0; --a:1.75; --d:360ms }
.mx-flag i:nth-child(8) { background-position:-21px 0; --a:2; --d:420ms }
.mx-flag i:nth-child(9) { background-position:-24px 0; --a:2.2; --d:480ms }
.mx-flag.is-waving i { animation:mx-wave 1.2s cubic-bezier(.37,0,.63,1) var(--d,0ms) 2 }
.mx-flag.is-waving i::after { animation:mx-fold 1.2s cubic-bezier(.37,0,.63,1) var(--d,0ms) 2 }
@keyframes mx-wave { 0%,100% { transform:none } 25% { transform:translateY(calc(var(--a,0) * -1px)) } 75% { transform:translateY(calc(var(--a,0) * 1px)) } }
@keyframes mx-fold { 0%,100% { opacity:0 } 50% { opacity:.2 } }
@media (prefers-reduced-motion:reduce) { .mx-flag.is-waving i,.mx-flag.is-waving i::after { animation:none } }
.journey-constraints>input,#custom-form select,.review-counts { width:100%; max-width:480px }
#custom-form>button[type='submit']+p { margin-top:10px }
/* Disclosure rows in the visitor flow: a drawn chevron instead of the browser triangle */
:is(#custom-form,#rebooking-result,#plan-evidence,.case-next-actions) details>summary { display:flex; align-items:center; gap:12px; list-style:none }
:is(#custom-form,#rebooking-result,#plan-evidence,.case-next-actions) details>summary::-webkit-details-marker { display:none }
:is(#custom-form,#rebooking-result,#plan-evidence,.case-next-actions) details:not(.evidence-drawer)>summary::before { content:''; flex:none; width:6px; height:6px; margin-inline:2px 4px; border-right:1.5px solid var(--action); border-bottom:1.5px solid var(--action); transform:rotate(-45deg); transition:transform 150ms var(--ease-out) }
:is(#custom-form,#rebooking-result,#plan-evidence,.case-next-actions) details[open]:not(.evidence-drawer)>summary::before { transform:rotate(45deg) }
@media (prefers-reduced-motion:reduce) { details>summary::before { transition:none } }

/* Supplier message: reads like a received note, with highlighter marks the AI picked out */
.supplier-reading .message-heading { padding:20px 24px 0; gap:12px; font-size:14px; color:var(--ink) }
.supplier-reading .supplier-avatar { color:var(--ink); background:linear-gradient(180deg,rgb(255 255 255 / .06),transparent),var(--raised); box-shadow:inset 0 1px 0 var(--line-hover),0 2px 6px rgb(0 0 0 / .25) }
.saved-pill { display:inline-flex; align-items:center; gap:7px; padding:4px 10px; border:1px solid var(--line-hover); border-radius:999px; font-size:12px; color:var(--muted); white-space:nowrap }
.saved-pill::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--good) }
.supplier-reading .supplier-message { padding:10px 28px 26px 68px; letter-spacing:-.003em; color:var(--ink) }
.supplier-message mark { padding:0 2px; margin:0 -2px; border:0; border-radius:3px; color:inherit; background:linear-gradient(transparent 56%,rgb(240 244 238 / .17) 56%) no-repeat 0 0 / 100% 100%; transition:background-color 150ms var(--ease-out) }
.supplier-message mark.fact-linked { background-color:rgb(240 244 238 / .1) }
.reading-summary { padding:18px 24px 22px; background:rgb(0 0 0 / .1) }
.supplier-reading .reading-summary>p { font-size:13px; line-height:1.55; max-width:58ch }
.fact-chip { align-items:center; gap:10px; padding:10px 16px 10px 12px; border-color:rgb(240 244 238 / .3); border-radius:12px; background:rgb(0 0 0 / .14); transition:border-color 150ms var(--ease-out),background-color 150ms var(--ease-out) }
.fact-chip .fact-icon { width:18px; height:18px; flex:none; color:var(--muted) }
.fact-chip dd { font:400 24px/1 var(--serif); letter-spacing:-.01em }
.fact-chip.fact-linked .fact-icon { color:var(--ink) }
.fact-chip.unknown dd { font:400 16px/1 var(--sans) }
@media (prefers-reduced-motion:no-preference) {
  body:not(.reduce-motion) .supplier-message mark { animation:mark-sweep 520ms var(--ease-out) both; animation-delay:calc(var(--mark-i,0) * 140ms + 260ms) }
  .supplier-message mark:nth-of-type(2) { --mark-i:1 }
  .supplier-message mark:nth-of-type(3) { --mark-i:2 }
  .supplier-message mark:nth-of-type(4) { --mark-i:3 }
}
@keyframes mark-sweep { from { background-size:0 100% } to { background-size:100% 100% } }
@media (max-width:820px) {
  .supplier-reading .message-heading { padding:16px 18px 0 }
  .supplier-reading .supplier-message { padding:12px 18px 22px }
  .fact-chip { padding:9px 12px 9px 10px }
  .fact-chip dd { font-size:21px }
}
@media (forced-colors:active) { .supplier-message mark { background:Mark; color:MarkText } }

/* Review fixes: invalid time shows on the face, chooser headings descend, the hover ripple is brief */
.arrival-face input[type='time'][aria-invalid='true'] { color:var(--attention) }
.library-heading h2 { font-size:30px }
.mx-flag.is-waving.is-brief i,.mx-flag.is-waving.is-brief i::after { animation-iteration-count:1 }

/* Manifest header: a word state ("Group unconfirmed") drops under the label instead of squeezing beside it */
.manifest-top { flex-wrap:wrap; column-gap:16px; row-gap:4px }
.manifest-top>span:first-child { white-space:nowrap }
#confirmed-guests { white-space:nowrap }

/* Missing details: open questions read as a short to-ask list, in the same band as the reading */
.supplier-reading .reading-questions { padding:4px 24px 22px; background:rgb(0 0 0 / .1) }
.supplier-reading .reading-summary:has(+ .reading-questions) { padding-bottom:14px }
.reading-questions>p { font-size:13px; color:var(--muted) }
.reading-questions .questions { list-style:none; padding:0; display:grid; gap:10px; font-size:16px; line-height:1.5 }
.reading-questions .questions li { display:flex; gap:12px; align-items:baseline }
.reading-questions .questions li::before { content:''; flex:none; width:12px; height:12px; border:1.5px solid var(--muted); border-radius:50%; transform:translateY(1px) }
.fact-chip.unknown { border-color:rgb(240 244 238 / .45); background:transparent }
.fact-chip.unknown dd { color:var(--muted) }
.count-caution { display:inline-block; vertical-align:2px; margin-inline-start:8px; padding:3px 9px; border:1px solid var(--line-hover); border-radius:999px; background:rgb(0 0 0 / .14); font:500 12px/1.3 var(--sans); color:var(--muted) }
.not-a-count { text-decoration:underline dashed rgb(240 244 238 / .55); text-decoration-thickness:1.5px; text-underline-offset:5px }
.evidence-drawer h2 { font-size:20px }

/* Landing page: the copy beside the saved Mexico example, played once as the page opens */
.project .project-intro { max-width:1180px; display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); gap:64px; align-items:center; margin:clamp(48px,10vh,120px) auto 96px; padding:0 40px }
.project .project-intro h1 { font-size:clamp(42px,4.1vw,60px); line-height:1.04; letter-spacing:-.028em; max-width:none }
.project .project-intro p { font-size:18px; max-width:44ch }
.project .project-board { margin:0 }
.project-board .hero-board { padding:26px 26px 20px }
.project-board .hero-row.is-gone strong { position:relative; text-decoration:none; color:var(--muted) }
.project-board .hero-row.is-gone strong::after { content:''; position:absolute; inset-inline:0; top:54%; height:1.5px; border-radius:1px; background:var(--attention); transform-origin:left center }
@media (prefers-reduced-motion:no-preference) {
  body.project:not(.reduce-motion) .project-board .hero-board { animation:pb-rise 700ms var(--ease-out) 150ms backwards }
  body.project:not(.reduce-motion) .project-board .is-gone strong::after { animation:pb-draw 420ms var(--ease-out) 1150ms backwards }
  body.project:not(.reduce-motion) .project-board .is-gone small { animation:pb-quiet 300ms var(--ease-out) 1150ms backwards }
  body.project:not(.reduce-motion) .project-board .is-gone i { animation:pb-lose 320ms var(--ease-out) 1150ms backwards }
  body.project:not(.reduce-motion) .project-board .is-new { animation:pb-rise 520ms var(--ease-out) 1650ms backwards }
  body.project:not(.reduce-motion) .project-board .is-new i { animation:pb-fill 260ms var(--ease-out) backwards; animation-delay:calc(1950ms + var(--k,0) * 32ms) }
  body.project:not(.reduce-motion) .project-board .hero-total { animation:pb-fade 420ms var(--ease-out) 2550ms backwards }
}
@keyframes pb-rise { from { opacity:0; transform:translateY(10px) } }
@keyframes pb-draw { from { transform:scaleX(0) } }
@keyframes pb-quiet { from { color:var(--muted) } }
@keyframes pb-lose { from { background:var(--good); border-color:var(--good); border-style:solid; color:var(--bg) } }
@keyframes pb-fill { from { background:transparent; border-color:rgb(240 244 238 / .3); color:rgb(240 244 238 / .3) } }
@keyframes pb-fade { from { opacity:0 } }
.project-board .is-new i:nth-child(2) { --k:1 }
.project-board .is-new i:nth-child(3) { --k:2 }
.project-board .is-new i:nth-child(4) { --k:3 }
.project-board .is-new i:nth-child(5) { --k:4 }
.project-board .is-new i:nth-child(6) { --k:5 }
.project-board .is-new i:nth-child(7) { --k:6 }
.project-board .is-new i:nth-child(8) { --k:7 }
.project-board .is-new i:nth-child(9) { --k:8 }
.project-board .is-new i:nth-child(10) { --k:9 }
.project-board .is-new i:nth-child(11) { --k:10 }
.project-board .is-new i:nth-child(12) { --k:11 }
.project-board .is-new i:nth-child(13) { --k:12 }
.project-board .is-new i:nth-child(14) { --k:13 }
.project-board .is-new i:nth-child(15) { --k:14 }
.project-board .is-new i:nth-child(16) { --k:15 }
@media (max-width:1000px) {
  .project .project-intro { grid-template-columns:minmax(0,1fr); gap:48px; padding:0 24px; margin:56px auto 72px }
  .project .project-board { max-width:560px }
}
@media (max-width:520px) {
  .project .project-intro p { font-size:16px }
  .project-board .hero-board { padding:18px 16px 14px }
}

/* Signature: the S is a route, set as an app tile. It draws from pickup to drop-off, snags once (amber),
   holds, recovers to a green end, and a small light then runs the finished route once. */
.project .project-board { grid-area:auto }
.app-mark { position:relative; display:grid; place-items:center; width:112px; height:112px; margin:0 0 36px; border-radius:30px; background:radial-gradient(120% 90% at 30% 10%,rgb(255 255 255 / .1),transparent 55%),linear-gradient(160deg,#21494f,#123236 70%); box-shadow:inset 0 1px 0 rgb(255 255 255 / .12),inset 0 -1px 0 rgb(0 0 0 / .3),0 1px 2px rgb(0 0 0 / .4),0 24px 48px -18px rgb(0 0 0 / .75),0 0 0 1px rgb(240 244 238 / .06) }
.app-mark::after { content:''; position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 1px rgb(169 209 181 / .5),0 0 36px 4px rgb(169 209 181 / .25); opacity:0; pointer-events:none }
.route-mark { width:66px; height:66px; overflow:visible }
.route-mark path { fill:none; stroke-width:4.6; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1 1 }
.route-track { stroke:rgb(240 244 238 / .1) }
.route-line { stroke:var(--ink); stroke-dashoffset:0 }
.route-start,.route-end,.route-snag,.route-ring { transform-box:fill-box; transform-origin:center }
.route-start { fill:var(--ink) }
.route-end { fill:var(--good) }
.route-ring { fill:none; stroke:var(--good); stroke-width:1; opacity:0 }
.route-snag { fill:var(--attention); opacity:0 }
.route-car { fill:#fff; opacity:0; offset-path:path('M33 7H18c-11 0-14 13-3 15l13 2c11 2 8 13-3 13H10'); offset-rotate:0deg; filter:drop-shadow(0 0 2px #fff) }
@media (prefers-reduced-motion:no-preference) {
  body.project:not(.reduce-motion) .app-mark { animation:mark-in 700ms var(--ease-out) 60ms backwards }
  body.project:not(.reduce-motion) .app-mark::after { animation:mark-glow 1400ms var(--ease-out) 2350ms }
  body.project:not(.reduce-motion) .route-start { animation:route-pop 360ms var(--ease-out) 350ms backwards }
  body.project:not(.reduce-motion) .route-line { animation:route-draw 1900ms cubic-bezier(.45,.05,.25,1) 450ms backwards }
  body.project:not(.reduce-motion) .route-snag { animation:route-snag 1000ms var(--ease-out) 1100ms }
  body.project:not(.reduce-motion) .route-end { animation:route-land 460ms cubic-bezier(.34,1.56,.64,1) 2300ms backwards }
  body.project:not(.reduce-motion) .route-ring { animation:route-ring 900ms var(--ease-out) 2400ms }
  body.project:not(.reduce-motion) .route-car { animation:route-car 1500ms cubic-bezier(.65,0,.35,1) 2900ms }
}
@keyframes mark-in { from { opacity:0; transform:translateY(8px) scale(.94) } }
@keyframes mark-glow { 0% { opacity:0 } 30% { opacity:1 } 100% { opacity:0 } }
@keyframes route-draw { 0% { stroke-dashoffset:1 } 36% { stroke-dashoffset:.52 } 62% { stroke-dashoffset:.52 } 100% { stroke-dashoffset:0 } }
@keyframes route-pop { from { opacity:0; transform:scale(.5) } }
@keyframes route-snag { 0% { opacity:0; transform:scale(.4) } 18% { opacity:1; transform:scale(1.3) } 60% { opacity:1; transform:scale(1) } 100% { opacity:0; transform:scale(.5) } }
@keyframes route-land { from { opacity:0; transform:scale(.3) } }
@keyframes route-ring { 0% { opacity:.9; transform:scale(1) } 100% { opacity:0; transform:scale(3.4) } }
@keyframes route-car { 0% { offset-distance:0%; opacity:0 } 12% { opacity:1 } 88% { opacity:1 } 100% { offset-distance:100%; opacity:0 } }
@media (max-width:520px) { .app-mark { width:88px; height:88px; border-radius:24px; margin-bottom:28px } .route-mark { width:52px; height:52px } }