#mission-objective { position: fixed; left: 1rem; bottom: 1rem; max-width: min(36rem, calc(100vw - 2rem)); padding: .75rem 1rem; background: #fff7dc; color: #29262a; border: 2px solid #29262a; border-radius: .75rem; z-index: 10; }
#mission-objective button { margin-left: .6rem; }
#mission-objective[hidden] { display: none; }
.mission-set { margin-block: 1rem; padding: .8rem; border: 2px solid #29262a; border-radius: .8rem; background: #fff7dc; }
.mission-set ul { list-style: none; padding: 0; }
.mission-set li { border-top: 1px solid #d9cdb1; padding-block: .65rem; }
@media (pointer: coarse) { #mission-objective { bottom: 11rem; font-size: .95rem; } }

#jobs-panel { background: #f6f2e9; z-index: 25; }
.jobs-card { width: 100%; max-width: 780px; min-width: 0; max-height: calc(100svh - 48px); overflow: auto; }
.jobs-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.jobs-heading h2 { margin: 0; }
.jobs-heading button { flex-shrink: 0; min-height: 44px; }
.mission-progress { font-weight: bold; }
#jobs-list .mission-set { margin-block: .75rem; }
#jobs-list summary { cursor: pointer; min-height: 44px; }
#jobs-list summary h3 { display: inline; margin: 0; font-size: 1.15rem; }
#jobs-list summary .mission-context { margin: .3rem 0 0; }
#jobs-list summary:focus-visible { outline: 3px solid #3479a9; outline-offset: 5px; border-radius: 4px; }
#jobs-list button { min-height: 44px; margin-top: .3rem; }
#jobs-list .mission-context { font-size: .85rem; }
#jobs-list ul { margin-bottom: 0; }
@media (max-width: 600px) {
  #jobs-panel { padding: 12px; }
  .jobs-card { padding: 16px; max-height: calc(100svh - 24px); }
  .jobs-heading { flex-wrap: wrap; gap: 12px; }
  .jobs-heading h2 { font-size: 1.6rem; }
}