:root {
  color-scheme: light;
  --paper: #f5f2ed;
  --card: #fcfaf6;
  --text: #1d201d;
  --subtle: #56574d;
  --line: #d9d4cb;
  --orange: #ff732b;
  --rust: #a33c11;
  --dark: #171917;
  background: var(--paper);
  color: var(--text);
  font: 1rem/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; }
:where(h1, h2, h3, p, ol) { margin: 0; }
a { color: inherit; text-underline-offset: .18em; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled, select:disabled { cursor: default; opacity: .55; }
:focus-visible { outline: 2px solid var(--rust); outline-offset: .22rem; }
.wrap { width: min(100% - 2rem, 68rem); margin-inline: auto; }
.skip { position: absolute; top: .75rem; left: .75rem; z-index: 10; transform: translateY(-150%); background: var(--card); padding: .75rem 1rem; }
.skip:focus { transform: none; }
.site-header { border-bottom: 1px solid var(--line); }
.header-inner { min-height: 4.55rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.header-inner img { width: 9.2rem; }
.header-inner nav { display: flex; align-items: center; gap: .8rem 1.2rem; flex-wrap: wrap; }
.header-inner nav a { padding: .65rem 0; font-size: .88rem; font-weight: 700; text-decoration: none; }
.header-inner nav a:hover { text-decoration: underline; }
.message { margin-bottom: 1.15rem; border: 1px solid #9eac98; padding: .7rem .9rem; border-radius: .4rem; background: #e8efe5; color: #223d29; }
.message.error { background: #ffebe3; color: #70270d; border-color: #dcac96; }
.access { display: grid; grid-template-columns: 1fr minmax(19rem, .88fr); gap: 1rem; align-items: stretch; }
.account-aside {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: .9rem;
  padding: clamp(1.45rem, 5.2vw, 3.65rem);
  background: radial-gradient(ellipse at 99% 12%, #3f2b20, transparent 67%), var(--dark);
  color: #faf6ef;
}
.eyebrow { color: var(--rust); font: 700 .72rem/1.4 ui-monospace, monospace; letter-spacing: .11em; text-transform: uppercase; }
.account-aside .eyebrow { color: #ffae83; }
h1 { font-size: clamp(2.15rem, 4.6vw, 4.1rem); line-height: .99; letter-spacing: -.058em; font-weight: 750; margin: .72rem 0 .9rem; }
h2 { font-size: clamp(1.55rem, 3.2vw, 2.3rem); letter-spacing: -.045em; line-height: 1.14; margin: .2rem 0 .55rem; }
h3 { font-size: 1.05rem; overflow-wrap: anywhere; }
.account-aside > p:not(.eyebrow) { color: #ded2c5; max-width: 25rem; }
.account-aside ol { display: grid; gap: .7rem; list-style: none; padding: 0; margin-top: 1.6rem; font-size: .92rem; }
.account-aside li span { color: #ffae83; font: 700 .7rem/1 ui-monospace, monospace; margin-right: .6rem; }
.panel { background: var(--card); border: 1px solid var(--line); border-radius: .85rem; }
.account-card { padding: clamp(1.3rem, 3.6vw, 2.35rem); }
.account-card > p:not(.eyebrow), .workspace-heading p:not(.eyebrow), .workspace-card > p { color: var(--subtle); }
form { display: grid; gap: .7rem; margin-top: 1.15rem; }
form label, .site-selection label { font-size: .88rem; font-weight: 700; }
label > input, label > select, label > textarea { display: block; width: 100%; margin-top: .28rem; }
input, select, textarea {
  min-width: 0;
  min-height: 2.75rem;
  background: #fffdf8;
  color: var(--text);
  padding: .53rem .63rem;
  border: 1px solid #aaa69a;
  border-radius: .35rem;
}
textarea { resize: vertical; }
.primary, .secondary, .quiet, .danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .58rem;
  min-height: 2.75rem;
  border: 1px solid transparent;
  padding: .58rem .9rem;
  border-radius: .37rem;
  font-size: .89rem;
  line-height: 1.2;
  font-weight: 750;
  text-decoration: none;
}
.primary { background: var(--orange); color: #191511; }
.primary:hover:not(:disabled) { background: #ff975f; }
.secondary { background: #f2ebe1; color: var(--text); border-color: var(--line); }
.quiet { padding-inline: .54rem; color: var(--rust); background: transparent; }
.quiet:hover:not(:disabled) { text-decoration: underline; }
.danger { background: #8d2d15; color: #fffdf8; }
.danger:hover:not(:disabled) { background: #732412; }
.account-switch { font-size: .88rem; margin-top: 1rem; }
.account-switch a { color: var(--rust); font-weight: 720; }
.workspace-heading, .section-heading { display: flex; align-items: center; justify-content: space-between; gap: .8rem 1.2rem; flex-wrap: wrap; }
.workspace-heading { margin-bottom: 1.35rem; }
.workspace-card { margin-block: .85rem; padding: clamp(1rem, 3vw, 1.8rem); }
.site-selection { display: flex; gap: .65rem; align-items: center; flex-wrap: wrap; }
.site-selection select { max-width: 100%; }
#equipment-groups { display: grid; gap: .75rem; }
.equipment-group { min-inline-size: 0; border: 1px solid var(--line); border-radius: .45rem; margin: 0; padding: .65rem .9rem .85rem; }
.equipment-group legend { font-size: .9rem; padding-inline: .35rem; font-weight: 740; }
.field-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .62rem; }
.remove-equipment { margin-top: .25rem; }
.form-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.empty { border: 1px dashed var(--line); border-radius: .5rem; margin-top: .8rem; padding: 1.25rem; }
.empty p { color: var(--subtle); margin-top: .3rem; }
.request { border-top: 1px solid var(--line); margin-top: .7rem; }
.request > summary { display: flex; align-items: center; justify-content: space-between; gap: .65rem; padding: .8rem 0; cursor: pointer; list-style: none; font-weight: 700; overflow-wrap: anywhere; }
.request > summary::-webkit-details-marker { display: none; }
.request > summary::after { content: "+"; color: var(--rust); font-weight: 740; }
.request[open] > summary::after { content: "−"; }
.request > summary > span:first-child { margin-right: auto; }
.status { background: #eeeae2; color: #3e3d34; border-radius: 1rem; padding: .2rem .58rem; font-size: .78rem; }
.site-footer { display: flex; gap: .55rem 1rem; justify-content: space-between; flex-wrap: wrap; border-top: 1px solid var(--line); margin-block: 1.5rem 0; padding-block: .8rem 1.4rem; color: var(--subtle); font-size: .81rem; }
@media (max-width: 47rem) {
  .access { grid-template-columns: 1fr; }
  .account-aside { padding-block: 1.6rem; }
  .account-aside ol { display: none; }
}
@media (max-width: 28rem) {
  .header-inner { gap: .45rem; }
  .header-inner img { width: 6.5rem; }
  .header-inner nav { gap: .28rem; }
}
main { padding-block: clamp(1rem, 4vw, 2.4rem); }
.header-inner nav a.secondary { padding: .58rem .9rem; }
.account-card > .account-switch { line-height: 1.55; }
.account-card > .privacy-note { margin-top: 1rem; font-size: .8rem; line-height: 1.55; }
.message { overflow-wrap: anywhere; }
form label, .site-selection { min-inline-size: 0; }
#invite-form, #draft-form > label { max-width: 29rem; }
#invite-form button { justify-self: start; }
.request-count { color: var(--subtle); margin-top: .45rem; }
.equipment-list { display: grid; gap: .2rem; margin: .4rem 0 .8rem; padding-left: 1.2rem; }
.workspace-heading > div { min-width: 0; overflow-wrap: anywhere; }
.status { flex: none; }
.password-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem; }
.password-field input { width: 100%; }
.password-toggle { min-width: 3.4rem; }
.credential-fields { display: grid; gap: .55rem; }
.field-hint { color: var(--subtle); font-size: .81rem; }
.text-button { justify-content: flex-start; padding-inline: 0; }
.account-switch .primary { color: var(--text); }
.security-actions { margin-block: .9rem; }
.security-form { max-width: 32rem; }
.security-detail {
  border-top: 1px solid var(--line);
  padding-top: 1rem;
  margin-top: .8rem;
}
.security-detail > p { color: var(--subtle); margin-top: .3rem; }
.authenticator-key {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  margin-top: .85rem;
}
.authenticator-key > div { min-width: 0; }
.mfa-qr { width: min(100%, 10.5rem); padding: .15rem; background: #fff; border: 1px solid var(--line); }
.mfa-qr svg { display: block; width: 100%; height: auto; }
#mfa-secret {
  display: block;
  color: var(--text);
  font-size: .98rem;
  margin-block: .3rem;
  overflow-wrap: anywhere;
  user-select: all;
}
.recovery-codes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: .3rem .75rem;
  max-width: 35rem;
  padding: 0;
  margin: .8rem 0;
  list-style: none;
}
.recovery-codes li {
  background: #f2ebe1;
  border-radius: .3rem;
  padding: .36rem .55rem;
  color: var(--text);
  overflow-wrap: anywhere;
  user-select: all;
}
.draft-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: .7rem;
  border-top: 1px solid var(--line);
  padding-block: .2rem;
}
.draft-details { border: 0; margin: 0; }
.draft-actions { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .2rem; }
.draft-delete-dialog { width: min(100% - 2rem, 27rem); padding: 1.35rem; color: var(--text); }
.draft-delete-dialog::backdrop { background: rgb(23 25 23 / .55); }
.draft-delete-dialog p { overflow-wrap: anywhere; }
.draft-photo-section { border-top: 1px solid var(--line); margin-top: 1.4rem; padding-top: 1rem; }
.draft-photo-section h3 { margin-bottom: .25rem; }
.group-photos { border-top: 1px solid var(--line); margin: .75rem 0 .35rem; padding-top: .65rem; }
.group-photos > label { display: block; max-width: 30rem; }
.group-photos input[type=file] { display: block; max-width: 100%; margin-top: .25rem; }
.group-photo-count { margin: .35rem 0; }
.group-pending-photos { list-style: none; margin: .35rem 0; padding: 0; }
.group-pending-photos:empty, #draft-photo-summary:empty { display: none; }
.group-pending-photos li { display: flex; align-items: center; gap: .45rem; overflow-wrap: anywhere; }
.remove-equipment-help { margin: .15rem 0 0; }
.photo-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 7rem), 9rem));
  gap: .6rem;
  list-style: none;
  margin: .65rem 0;
  padding: 0;
}
.photo-gallery:empty { display: none; }
.photo-tile { border: 1px solid var(--line); border-radius: .45rem; background: #fffdf8; padding: .35rem; }
.photo-tile a { display: block; }
.photo-tile img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; border-radius: .25rem; background: #f2ebe1; }
.photo-tile button { margin-top: .2rem; }
.request-form, .request-action-form { max-width: 38rem; }
.request-form > button, .request-action-form > button { justify-self: start; }
.collection-location { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.availability-picker {
  min-inline-size: 0;
  border: 1px solid var(--line);
  border-radius: .55rem;
  padding: .85rem;
  background: #fffdf8;
}
.availability-picker > p { margin-top: .25rem; }
#availability-choices { display: grid; gap: .65rem; margin-top: .7rem; }
.availability-choice {
  min-inline-size: 0;
  display: grid;
  gap: .5rem;
  border: 1px solid var(--line);
  border-radius: .4rem;
  margin: 0;
  padding: .5rem .65rem;
}
.availability-choice legend { padding-inline: .3rem; font-size: .87rem; font-weight: 750; }
.availability-choice button { justify-self: start; }
.availability-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.availability-actions { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; margin-top: .65rem; }
.request-heading { min-width: 0; }
.request-reference { display: block; color: var(--subtle); font-size: .82rem; font-weight: 650; }
.collection-request-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: .7rem;
  border-top: 1px solid var(--line);
  padding-block: .2rem;
}
.collection-request-row > .request { border: 0; margin: 0; }
.collection-request-row > button, .handover-verified { margin-top: .2rem; justify-self: start; }
.handover-verified { color: #365b3c; padding-block: .55rem; font-size: .86rem; font-weight: 700; }
.agreed-collection-time { display: block; color: #365b3c; font-size: .83rem; }
.handover-dialog {
  width: min(100% - 2rem, 28rem);
  max-height: calc(100dvh - 2rem);
  padding: 1.25rem;
  color: var(--text);
  overflow: auto;
}
.handover-dialog::backdrop { background: rgb(23 25 23 / .55); }
.handover-dialog p + p, .handover-dialog .form-actions { margin-top: .55rem; }
.handover-dialog #handover-message { font-weight: 700; margin-block: .75rem; }
.handover-qr { width: min(100%, 15rem); margin: .6rem auto; background: #fff; }
.handover-qr svg { display: block; width: 100%; height: auto; fill: #000; }
.handover-code-detail { margin-top: .55rem; }
.handover-code-detail summary { cursor: pointer; color: var(--rust); font-weight: 700; }
.handover-code-detail code {
  display: block;
  overflow-wrap: anywhere;
  user-select: all;
  background: #f2ebe1;
  padding: .38rem .5rem;
  margin-block: .3rem;
}
.request-note { white-space: pre-wrap; overflow-wrap: anywhere; }
.estimate-panel, .request-next, .request-activity, .withdraw-confirmation, .request-schedule {
  margin-block: .9rem;
  padding: .85rem 1rem;
  border: 1px solid var(--line);
  border-radius: .55rem;
  background: #fffdf8;
}
.estimate-panel strong { display: block; margin-block: .3rem; font-size: 1.2rem; }
.request-schedule h4 { margin: 0 0 .25rem; }
.request-schedule.agreed { background: #eef4eb; border-color: #9eac98; }
.request-schedule > p + p { margin-top: .3rem; }
.schedule-choices { display: grid; gap: .42rem; border: 0; margin: 0; padding: 0; min-width: 0; }
.schedule-choices legend { font-weight: 700; font-size: .88rem; margin-bottom: .4rem; }
.schedule-choices label {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .65rem;
  border: 1px solid var(--line);
  border-radius: .4rem;
  cursor: pointer;
}
.schedule-choices label:has(input:checked) { border-color: var(--rust); background: #fff1e8; }
.schedule-choices label > input { width: 1rem; min-height: auto; margin: 0; flex: none; accent-color: var(--rust); }
.schedule-preferences { margin-top: .65rem; }
.schedule-preferences summary { color: var(--rust); cursor: pointer; font-weight: 700; font-size: .88rem; }
.schedule-list { margin: .3rem 0 0; padding-left: 1.2rem; font-size: .88rem; }
.schedule-summary { display: block; color: var(--rust); font-size: .79rem; }
.request-activity h4 { margin: 0 0 .6rem; }
.activity-list { list-style: none; padding: 0; margin: 0; }
.activity-list > li + li { border-top: 1px solid var(--line); padding-top: .55rem; margin-top: .55rem; }
.activity-list > li > time { display: block; font-size: .82rem; color: var(--subtle); }
.activity-list .request-note { margin-top: .25rem; }
.withdraw-confirmation > summary { cursor: pointer; color: var(--rust); font-weight: 700; }
.withdraw-confirmation[open] > summary { margin-bottom: .45rem; }
@media (max-width: 47rem) {
  .account-aside { grid-row: 2; }
}
@media (max-width: 28rem) {
  .field-grid, .draft-row { grid-template-columns: minmax(0, 1fr); }
  .draft-row { gap: .2rem; padding-bottom: .55rem; }
  .draft-actions { margin: 0; }
  .header-inner nav a.secondary { padding-inline: .55rem; }
}
@media (max-width: 36rem) {
  .collection-request-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .collection-request-row > button, .handover-verified { margin-block: 0 .4rem; }
}