:root {
  color-scheme: light;
  --ink: #1e2934;
  --muted: #526374;
  --line: #dce4eb;
  --paper: #fff;
  --canvas: #f3f6f8;
  --accent: #07586b;
  --accent-dark: #034451;
  --danger: #a13928;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 15px;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); color: var(--ink); line-height: 1.55; }
a { color: var(--accent); text-underline-offset: .2em; }
a:hover { color: var(--accent-dark); }
:focus-visible { outline: 3px solid #47a0b2; outline-offset: 3px; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(1.65rem, 4.5vw, 2.45rem); letter-spacing: -.035em; line-height: 1.23; overflow-wrap: anywhere; }
h2 { font-size: 1.16rem; line-height: 1.35; }
h3 { font-size: 1rem; }
p + p { margin-top: .45rem; }
.shell { width: min(1120px, calc(100% - 3rem)); margin-inline: auto; }
.main { padding-block: clamp(1.5rem, 4vw, 3.2rem) 4rem; }
.topbar { background: var(--paper); border-bottom: 1px solid var(--line); }
.topbar-inner { min-height: 63px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; gap: .65rem; align-items: center; color: var(--ink); font-weight: 730; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 2rem; height: 2rem; background: var(--accent); color: #fff; border-radius: 7px; font-size: .98rem; }
nav, .inline { display: flex; align-items: center; flex-wrap: wrap; gap: .85rem; }
nav a, .text-button, .subtle-link { font-size: .92rem; }
nav a { text-decoration: none; }
nav form, .actions form { margin: 0; }
.nav-user, .muted { color: var(--muted); }
.skip { position: absolute; transform: translateY(-150%); background: var(--paper); padding: .5rem; }
.skip:focus { transform: translateY(0); z-index: 4; }
.heading { display: flex; align-items: end; justify-content: space-between; gap: 1.1rem; margin-bottom: 1.35rem; }
.heading h1 { margin: .22rem 0 .45rem; }
.kicker { color: var(--accent); font-size: .8rem; font-weight: 700; letter-spacing: .08em; }
.sheet { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1rem, 2.7vw, 1.65rem); margin-bottom: 1rem; min-width: 0; }
.sheet > h1 + p, .sheet > .kicker + h1, .auth > h1 { margin-top: .45rem; }
.narrow { max-width: 700px; }
.auth { max-width: 440px; margin: 4vh auto; }
.section-title { display: flex; justify-content: space-between; align-items: baseline; gap: .7rem; margin-bottom: .9rem; flex-wrap: wrap; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; }
.compact { margin-top: .8rem; }
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: .3rem; min-height: 42px;
  padding: .52rem .92rem; border: 1px solid transparent; border-radius: 7px; text-decoration: none;
  cursor: pointer; font: inherit; font-weight: 650; line-height: 1.25; white-space: nowrap;
}
.primary { background: var(--accent); color: #fff; }
.primary:hover { background: var(--accent-dark); color: #fff; }
.secondary { background: var(--paper); color: var(--accent); border-color: #aebfc9; }
.secondary:hover { background: #edf6f7; }
.button:disabled { opacity: .5; cursor: default; }
.text-button { font: inherit; background: none; border: 0; padding: .15rem .25rem; cursor: pointer; color: var(--accent); }
.danger-text { color: var(--danger); }
.back { display: inline-block; margin-bottom: 1rem; font-weight: 550; }
.fields { display: grid; gap: .9rem; margin-top: 1rem; }
.fields > .button { justify-self: start; }
.fields label, .filters label { display: block; font-weight: 630; }
.fields label + input, .fields label + select, .fields label + textarea, label > input, label > select, label > textarea { margin-top: .28rem; }
input, select, textarea { font: inherit; color: var(--ink); }
input:not([type="checkbox"],[type="radio"],[type="file"],[type="hidden"]), select, textarea {
  display: block; width: 100%; min-height: 42px; background: #fff; border: 1px solid #aebfc9;
  border-radius: 7px; padding: .48rem .6rem; outline-offset: 2px;
}
textarea { resize: vertical; min-height: 80px; }
input[type="checkbox"], input[type="radio"] { width: 1.1rem; height: 1.1rem; margin: .1rem .35rem 0 0; accent-color: var(--accent); flex: none; }
.check { display: flex !important; align-items: flex-start; gap: .22rem; font-weight: 500 !important; }
.fields [id$="_hazards"] { display: grid; gap: .55rem; margin-top: .45rem; }
.fields [id$="_hazards"] label { display: flex; align-items: start; gap: .35rem; padding: .65rem; border: 1px solid var(--line); border-radius: 7px; font-weight: 500; }
.helptext { margin-top: .25rem; color: var(--muted); font-size: .87rem; }
.errorlist { padding-left: 1.1rem; margin: 0 0 .3rem; color: var(--danger); }
.filters { display: flex; align-items: end; flex-wrap: wrap; gap: .65rem; margin-bottom: .9rem; }
.filters > label { min-width: 135px; flex: 1; }
.filters > label:first-child { flex: 1.5; }
.filters .subtle-link { padding-block: .55rem; }
.table-wrap { overflow: auto; }
.list-table { width: 100%; border-collapse: collapse; text-align: left; min-width: 490px; }
.list-table td, .list-table th { padding: .65rem .55rem; border-bottom: 1px solid var(--line); }
.list-table th { color: var(--muted); font-size: .86rem; background: #f5f8fa; }
.list-table td:not(:first-child) { white-space: nowrap; }
.list-table tbody tr:last-child td { border-bottom: 0; }
.rows { padding: 0; margin: 0; list-style: none; }
.rows li + li { border-top: 1px solid var(--line); }
.rows li a { display: flex; align-items: center; gap: .7rem; padding-block: .8rem; text-decoration: none; }
.rows li a > strong { margin-right: auto; overflow-wrap: anywhere; }
.empty { color: var(--muted); padding: .75rem .3rem; }
.pill { display: inline-block; padding: .16rem .55rem; border-radius: 4px; font-size: .81rem; font-weight: 680; background: #edf1f4; color: #445462; white-space: nowrap; }
.pill.success { background: #e2f4ea; color: #24583a; }
.pill.waiting { background: #e3f1f5; color: #15526a; }
.pill.danger { background: #fbece2; color: #8e4627; }
.notice { background: #e6f2f5; border-left: 3px solid #4f8fa0; padding: .7rem .9rem; border-radius: 4px; margin-bottom: 1rem; overflow-wrap: anywhere; }
.notice.error { background: #fcebe7; border-color: var(--danger); }
.notice.success { background: #e8f6ee; border-color: #588b69; }
.copy-field { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.copy-field input { flex: 1; min-width: min(200px, 100%); }
.public-wrap { max-width: 850px; margin-inline: auto; }
.public-heading { align-items: center; }
.entry { padding-block: 1rem; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.entry:last-child { padding-bottom: 0; }
.entry-head { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.description { font-size: 1.035rem; font-weight: 540; white-space: pre-wrap; margin: .52rem 0; }
.detail { white-space: pre-wrap; }
.detail strong { color: var(--muted); margin-right: .3rem; font-size: .9rem; }
.entry-controls { display: flex; flex-wrap: wrap; align-items: start; gap: .7rem; margin-top: .8rem; }
.entry-controls details { width: min(100%, 280px); }
.entry-controls details:not([open]) { width: auto; }
details summary { cursor: pointer; font-weight: 650; color: var(--accent); }
.entry-controls summary { padding: .45rem .65rem; border: 1px solid var(--line); border-radius: 7px; }
.feedback[open] { padding: .55rem; border: 1px solid var(--line); border-radius: 8px; }
.feedback[open] summary { padding: 0; border: 0; }
.history { margin-top: .75rem; font-size: .9rem; }
.history li + li { margin-top: .35rem; }
.photos { display: flex; flex-wrap: wrap; gap: .65rem; }
.photos:not(:empty), .sheet > [data-photo-picker] { margin-top: .8rem; }
.photos img { display: block; width: min(140px, 38vw); height: 99px; object-fit: cover; border: 1px solid var(--line); border-radius: 7px; background: var(--canvas); }
.photo > form { margin-top: .2rem; }
.photo-error { border: 1px solid var(--line); border-radius: 7px; padding: .55rem; }
.photo-error strong { display: block; color: var(--danger); margin-bottom: .4rem; }
.file-control { position: relative; cursor: pointer; }
.file-control input { position: absolute; inset: 0; width: 100%; margin: 0; opacity: 0; cursor: pointer; }
.file-control:focus-within { outline: 3px solid #47a0b2; outline-offset: 2px; }
.upload-queue:not(:empty) { display: grid; gap: .4rem; margin-top: .55rem; }
.upload-row { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; color: var(--muted); overflow-wrap: anywhere; }
@media (max-width: 680px) {
  .shell { width: calc(100% - 1.5rem); }
  .heading { align-items: start; flex-direction: column; }
  .public-heading { flex-direction: row; align-items: center; }
  .topbar-inner { min-height: 55px; }
  .nav-user { display: none; }
  .rows li a { flex-wrap: wrap; }
  .rows li a > strong { flex: 1 1 55%; }
}
.event { padding-block: .55rem; color: var(--muted); }

[hidden] { display: none !important; }
.voice { margin-top: -.35rem; }
.voice-help, .voice-status { font-size: .88rem; margin-top: .3rem; }
.voice-status { color: var(--accent); }
.voice-status:empty { display: none; }

.company-picker-message:empty { display: none; }
.company-choices { display: grid; gap: .45rem; }
.company-choices:empty { display: none; }
.company-choice {
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: .65rem .85rem;
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-weight: 650;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.company-choice::after {
  content: "";
  flex: none;
  width: .45rem;
  height: .45rem;
  border: solid var(--accent);
  border-width: 1.5px 1.5px 0 0;
  transform: rotate(45deg);
}
.company-choice:hover { border-color: var(--accent); }
.company-choice:disabled { opacity: .55; cursor: wait; }
