:root {
  color-scheme: dark;
  color: #fff4c2;
  background: #071a15;
  font-family: "Fusion Pixel 12px Monospaced SC", "Microsoft YaHei", monospace;
  --checkin-ink: #173a31;
  --checkin-deep: #071a15;
  --checkin-hud: rgba(13, 40, 33, .93);
  --checkin-paper: rgba(255, 244, 194, .95);
  --checkin-paper-light: #fffaf0;
  --checkin-line: #315b48;
  --checkin-wood: #66422d;
  --checkin-gold: #f5c84f;
  --checkin-coral: #e77d63;
  --checkin-mint: #8ed5cf;
  --checkin-leaf: #6ea843;
  --checkin-shadow: #0d211b;
}

* { box-sizing: border-box; }
html, body { min-width: 320px; }

body.pixel-page.pixel-checkin {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  margin: 0;
  overflow-x: clip;
  background-color: var(--checkin-deep);
  background-image: url("/assets/pixel-greenhouse-interior.png");
  background-position: center top;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

body.pixel-page.pixel-checkin::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  background: rgba(5, 19, 15, .36);
  content: "";
  pointer-events: none;
}

button,
input,
select { font: inherit; }

button,
a,
input,
select { -webkit-tap-highlight-color: transparent; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 3px solid var(--checkin-gold);
  outline-offset: 3px;
}

.pixel-page.pixel-checkin .checkin-app {
  position: relative;
  z-index: 1;
  width: min(1440px, calc(100% - 32px));
  min-height: 100vh;
  margin: 0 auto;
  padding: 16px 0 26px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.pixel-page.pixel-checkin .checkin-header {
  position: sticky;
  z-index: 20;
  top: 12px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 68px;
  margin: 0 16px;
  padding: 10px 18px;
  border: 4px solid var(--checkin-shadow);
  border-bottom: 5px solid var(--checkin-gold);
  background: rgba(10, 42, 33, .96);
  color: #fff8dc;
  box-shadow: 6px 6px 0 rgba(4, 17, 13, .9);
  backdrop-filter: blur(2px);
}

.checkin-header > p {
  display: grid;
  justify-items: center;
  gap: 3px;
  margin: 0;
  font-size: 12px;
  font-weight: 700;
}

.checkin-header > p span {
  color: var(--checkin-mint);
  font-size: 9px;
  font-weight: 400;
}

.brand {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 9px;
  color: inherit;
  font-weight: 700;
  text-decoration: none;
}

.brand-pixel {
  position: relative;
  width: 24px;
  height: 28px;
  border: 3px solid var(--checkin-shadow);
  background: #8d592f;
  box-shadow: inset 0 -4px 0 #60391f, 3px 3px 0 #04120e;
}

.brand-pixel::before,
.brand-pixel::after {
  position: absolute;
  top: -6px;
  width: 10px;
  height: 13px;
  border: 3px solid var(--checkin-shadow);
  background: var(--checkin-leaf);
  content: "";
}

.brand-pixel::before { left: -2px; }
.brand-pixel::after { right: -2px; background: #a4c84f; }

.back-link {
  justify-self: end;
  padding: 8px 11px;
  border: 3px solid var(--checkin-shadow);
  background: var(--checkin-paper-light);
  color: var(--checkin-ink);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.checkin-workspace {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 18px;
  min-height: calc(100vh - 112px);
  padding: 26px 16px 0;
}

.pixel-page.pixel-checkin .capture-panel,
.pixel-page.pixel-checkin .judgment-workspace {
  position: relative;
  min-width: 0;
  border: 4px solid var(--checkin-shadow);
  box-shadow: 8px 8px 0 rgba(4, 17, 13, .88);
}

.pixel-page.pixel-checkin .capture-panel {
  padding: 24px 20px;
  border-right: 4px solid var(--checkin-shadow);
  background: var(--checkin-paper);
  color: var(--checkin-ink);
  box-shadow: 8px 8px 0 rgba(4, 17, 13, .88), inset 0 0 0 4px #d3b871;
}

.pixel-page.pixel-checkin .capture-panel::before,
.pixel-page.pixel-checkin .capture-panel::after,
.pixel-page.pixel-checkin .judgment-workspace::before,
.pixel-page.pixel-checkin .judgment-workspace::after {
  position: absolute;
  width: 12px;
  height: 12px;
  border: 3px solid var(--checkin-shadow);
  background: var(--checkin-gold);
  content: "";
  pointer-events: none;
}

.capture-panel::before,
.judgment-workspace::before { top: 7px; left: 7px; }
.capture-panel::after,
.judgment-workspace::after { right: 7px; bottom: 7px; }

.pixel-page.pixel-checkin .judgment-workspace {
  padding: 24px;
  background: var(--checkin-hud);
  color: #fff4c2;
  backdrop-filter: blur(3px);
}

.section-heading h1,
.section-heading h2,
.section-heading p { margin: 0; }

.section-heading h1 {
  margin-top: 5px;
  color: var(--checkin-ink);
  font-size: 25px;
  line-height: 1.25;
}

.section-heading h2 {
  margin-top: 5px;
  font-size: 21px;
  line-height: 1.25;
}

.judgment-workspace .section-heading h2 { color: #fff4c2; }

.section-heading > p:last-child {
  margin-top: 10px;
  color: #536b60;
  font-size: 11px;
  line-height: 1.75;
}

.section-index {
  color: #a24335;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

#checkin-form {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.text-field,
.file-field,
.task-field {
  display: grid;
  min-width: 0;
  gap: 7px;
}

.text-field > span,
.file-field > span,
.task-field > span {
  font-size: 11px;
  font-weight: 700;
}

.text-field input,
.task-field select {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 8px 10px;
  border: 3px solid var(--checkin-line);
  background: var(--checkin-paper-light);
  color: var(--checkin-ink);
  box-shadow: inset 3px 3px 0 #e1d2a7;
}

.pixel-page.pixel-checkin .file-field {
  min-width: 0;
  padding: 14px;
  overflow: hidden;
  border: 3px dashed var(--checkin-line);
  background: rgba(255, 250, 240, .84);
  box-shadow: 4px 4px 0 #b79a62;
}

.file-field small {
  color: #5f7469;
  font-size: 9px;
  line-height: 1.6;
}

.file-field input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  font-size: 10px;
}

.pixel-page.pixel-checkin .file-field input::file-selector-button {
  margin-right: 8px;
  padding: 7px 9px;
  border: 3px solid var(--checkin-shadow);
  background: #28634d;
  color: #fff8dc;
  box-shadow: 3px 3px 0 var(--checkin-shadow);
  font-weight: 700;
}

.pixel-page.pixel-checkin .privacy-state,
.pixel-page.pixel-checkin .checkin-status,
.pixel-page.pixel-checkin .authority-badge,
.pixel-page.pixel-checkin .override-field,
.pixel-page.pixel-checkin .resolution-note {
  border: 3px solid var(--checkin-line);
  box-shadow: 4px 4px 0 rgba(8, 28, 22, .35);
}

.privacy-state {
  min-height: 60px;
  margin: 0;
  padding: 10px 11px;
  border-left: 7px solid var(--checkin-gold) !important;
  background: #fff8dc;
  color: #455f55;
  font-size: 10px;
  line-height: 1.7;
}

.primary-command,
.secondary-command,
.confirm-command {
  min-height: 44px;
  padding: 8px 12px;
  border: 3px solid var(--checkin-shadow);
  box-shadow: 4px 4px 0 var(--checkin-shadow);
  font-weight: 700;
  cursor: pointer;
}

.pixel-page.pixel-checkin .primary-command,
.pixel-page.pixel-checkin .confirm-command {
  background: #2b6b50;
  color: #fff8dc;
}

.pixel-page.pixel-checkin .secondary-command {
  border-color: #5e2f27;
  background: #f4c4ad;
  color: #5e2f27;
}

.primary-command:disabled,
.secondary-command:disabled,
.confirm-command:disabled,
input:disabled,
select:disabled {
  cursor: not-allowed;
  opacity: .5;
}

.pixel-page.pixel-checkin .checkin-status {
  min-height: 58px;
  margin: 19px 0 0;
  padding: 11px 12px;
  background: #dce9d6;
  color: #244c3e;
  font-size: 10px;
  line-height: 1.65;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="error"] {
  border-color: #8d3b31;
  background: #f7ddd2;
  color: #792d2a;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="success"] {
  border-color: #397555;
  background: #d4ead8;
  color: #174b38;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="loading"] {
  border-color: #8b7029;
  background: #f4e8b9;
  color: #4c3f18;
}

.judgment-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 0 0 17px;
  border-bottom: 4px solid var(--checkin-wood);
}

.pixel-page.pixel-checkin .authority-badge {
  padding: 7px 10px;
  border-color: var(--checkin-shadow);
  background: var(--checkin-gold);
  color: var(--checkin-ink);
  font-size: 10px;
  font-weight: 700;
}

.pixel-page.pixel-checkin .judgment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 16px 0 0;
  border: 4px solid var(--checkin-shadow);
  background: var(--checkin-paper-light);
  box-shadow: 5px 5px 0 rgba(4, 17, 13, .72);
}

.pixel-page.pixel-checkin .judgment-grid > div {
  min-width: 0;
  min-height: 106px;
  padding: 17px;
  border-right: 3px solid #8c6c44;
  border-bottom: 3px solid #8c6c44;
  background: #fff8d8;
  color: var(--checkin-ink);
}

.judgment-grid > div:nth-child(2n) { border-right: 0; }
.judgment-grid > div:nth-last-child(-n + 2) { border-bottom: 0; }
.judgment-grid dt { color: #64766d; font-size: 9px; font-weight: 700; }
.judgment-grid dd {
  margin: 9px 0 0;
  overflow-wrap: anywhere;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
}

#confidence-state[data-confidence="high"] { color: #176046; }
#confidence-state[data-confidence="medium"] { color: #8b5b19; }
#confidence-state[data-confidence="low"] { color: #a34335; }

.decision-form {
  display: grid;
  gap: 15px;
  max-width: 780px;
  margin-top: 18px;
  padding: 18px;
  border: 4px solid var(--checkin-shadow);
  background: var(--checkin-paper);
  color: var(--checkin-ink);
  box-shadow: 5px 5px 0 rgba(4, 17, 13, .7), inset 0 0 0 3px #d7be7b;
}

.override-field {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border-color: #9d4c3d !important;
  background: #f8e2d7;
  color: #6f342c;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.65;
}

.override-field input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: #b94f3b;
}

.resolution-note {
  min-height: 52px;
  margin: 0;
  padding: 10px 12px;
  border-left: 7px solid var(--checkin-leaf) !important;
  background: #e8efdf;
  color: #566c63;
  font-size: 10px;
  line-height: 1.7;
}

.decision-commands {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 11px;
}

.progression-panel {
  height: 360px;
  margin-top: 22px;
  padding: 18px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.pixel-page.pixel-checkin .progression-panel {
  border: 4px solid var(--checkin-shadow);
  background: rgba(255, 244, 194, .96);
  color: var(--checkin-ink);
  box-shadow: 5px 5px 0 rgba(4, 17, 13, .72), inset 0 0 0 3px #d6bd78;
}

.progression-heading,
.progression-icon-commands,
.progression-meta,
.decoration-controls {
  display: flex;
  align-items: center;
}

.progression-heading { justify-content: space-between; gap: 12px; }
.progression-heading h2 { margin: 3px 0 0; font-size: 17px; }
.progression-icon-commands { gap: 6px; }

.icon-command,
.icon-text-command {
  min-width: 38px;
  height: 38px;
  border: 3px solid var(--checkin-shadow);
  background: #285d4b;
  color: #fff8dc;
  box-shadow: 3px 3px 0 var(--checkin-shadow);
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
}

.icon-command:disabled,
.icon-text-command:disabled { cursor: not-allowed; opacity: .45; }

.icon-text-command {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding-inline: 9px;
  font-size: 12px;
}

.progression-phase-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 13px;
}

.pixel-page.pixel-checkin .progression-phase {
  min-width: 0;
  min-height: 62px;
  padding: 8px;
  border: 3px solid var(--checkin-line);
  border-left: 7px solid var(--checkin-leaf);
  background: #fff8d8;
}

.progression-phase span {
  display: block;
  color: #64766d;
  font-size: 9px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.progression-phase strong { display: block; margin-top: 5px; font-size: 15px; }

.progression-meta {
  gap: 13px;
  min-height: 52px;
  margin-top: 9px;
  flex-wrap: wrap;
}

.progression-meta p { min-width: 100px; margin: 0; }
.progression-meta p span,
.progression-meta p strong { display: block; }
.progression-meta p span { color: #64766d; font-size: 9px; font-weight: 700; }
.progression-meta p strong {
  max-width: 220px;
  margin-top: 4px;
  font-size: 10px;
  overflow-wrap: anywhere;
}

.unlocked-decorations {
  display: flex;
  flex: 1;
  gap: 5px;
  min-width: 0;
  padding-block: 4px;
  overflow-x: auto;
}

.decoration-swatch {
  flex: 0 0 auto;
  min-height: 28px;
  padding: 4px 6px;
  border: 2px solid var(--checkin-shadow);
  color: var(--checkin-ink);
  font-size: 9px;
  font-weight: 700;
}

.decoration-controls { gap: 7px; margin-top: 9px; }
.decoration-controls label { display: grid; flex: 1; min-width: 0; gap: 3px; }
.decoration-controls label span { color: #64766d; font-size: 9px; font-weight: 700; }
.decoration-controls select {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding-inline: 7px;
  border: 2px solid var(--checkin-line);
  background: var(--checkin-paper-light);
  color: var(--checkin-ink);
  font-size: 10px;
}

.progression-status {
  min-height: 32px;
  margin: 8px 0 0;
  color: #566c63;
  font-size: 10px;
  line-height: 16px;
  overflow-wrap: anywhere;
}

.progression-status[data-kind="error"] { color: #8c392f; }
.progression-status[data-kind="success"] { color: #176046; }
[hidden] { display: none !important; }

@media (max-width: 900px) {
  .pixel-page.pixel-checkin .checkin-app { width: min(100% - 20px, 1440px); }
  .checkin-workspace { grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); gap: 12px; padding-inline: 10px; }
  .pixel-page.pixel-checkin .capture-panel { padding: 20px 16px; }
  .pixel-page.pixel-checkin .judgment-workspace { padding: 20px 16px; }
  .pixel-page.pixel-checkin .judgment-grid > div { padding: 14px; }
}

@media (max-width: 760px) {
  body.pixel-page.pixel-checkin {
    background-position: 54% top;
    background-attachment: scroll;
    overflow-x: clip;
  }

  body.pixel-page.pixel-checkin::before { background: rgba(5, 19, 15, .46); }

  .pixel-page.pixel-checkin .checkin-app {
    width: 100%;
    padding-top: 0;
  }

  .pixel-page.pixel-checkin .checkin-header {
    top: 0;
    grid-template-columns: 1fr auto;
    margin: 0;
    padding-inline: 14px;
    border-right: 0;
    border-left: 0;
  }

  .checkin-header > p { display: none; }

  .checkin-workspace {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px 12px 0;
  }

  .pixel-page.pixel-checkin .capture-panel {
    padding: 20px 16px;
    border-right: 4px solid var(--checkin-shadow);
    border-bottom: 4px solid var(--checkin-shadow);
  }

  .pixel-page.pixel-checkin .judgment-workspace { padding: 20px 16px; }
  .progression-panel { height: 420px; }
  .progression-meta { flex-wrap: wrap; }
  .unlocked-decorations { flex-basis: 100%; }
  .decoration-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto auto; }
}

@media (max-width: 420px) {
  .pixel-page.pixel-checkin .checkin-header { min-height: 58px; }
  .brand { font-size: 13px; }
  .back-link { padding: 7px 8px; font-size: 10px; }
  .checkin-workspace { padding-inline: 8px; }
  .pixel-page.pixel-checkin .capture-panel,
  .pixel-page.pixel-checkin .judgment-workspace { padding: 18px 12px; }
  .judgment-heading { align-items: start; flex-direction: column; }
  .pixel-page.pixel-checkin .judgment-grid { grid-template-columns: 1fr; }
  .pixel-page.pixel-checkin .judgment-grid > div {
    min-height: 86px;
    border-right: 0;
    border-bottom: 3px solid #8c6c44;
  }
  .judgment-grid > div:nth-last-child(-n + 2) { border-bottom: 3px solid #8c6c44; }
  .judgment-grid > div:last-child { border-bottom: 0; }
  .decision-form { padding: 14px 11px; }
  .decision-commands { grid-template-columns: 1fr; }
  .progression-panel { height: 480px; padding: 13px; }
  .progression-phase-list { gap: 5px; }
  .pixel-page.pixel-checkin .progression-phase { min-height: 68px; padding: 6px; }
  .decoration-controls { grid-template-columns: 1fr 1fr; }
  .icon-text-command { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}

/* Consolidated scene-first layout and control hierarchy. */
body.pixel-page.pixel-checkin::before {
  background: rgba(5, 19, 15, .14);
}

.pixel-page.pixel-checkin {
  --checkin-control-brown: #4a2e1d;
  --checkin-control-brown-deep: #2d1b12;
  --checkin-control-cream: #fff1c7;
  --checkin-control-cream-light: #fff9e8;
  --checkin-control-gold: #e5b84a;
  --checkin-control-cyan: #69c9c7;
  --checkin-state-green: #5ca85f;
  --checkin-state-red: #d96050;
  font-size: 13px;
}

.pixel-page.pixel-checkin :where(button, input, select) {
  font-size: 13px;
}

.pixel-page.pixel-checkin :where(button, a, input, select):focus-visible {
  outline-color: var(--checkin-control-cyan);
}

.pixel-page.pixel-checkin .checkin-app {
  width: min(1320px, calc(100% - 24px));
  min-height: 100vh;
  padding: 10px 0 28px;
}

.pixel-page.pixel-checkin .checkin-header {
  top: 8px;
  min-height: 56px;
  margin: 0;
  padding: 8px 14px;
  border: 2px solid rgba(4, 17, 13, .92);
  border-bottom: 3px solid var(--checkin-control-gold);
  background: rgba(9, 42, 33, .86);
  box-shadow: 3px 3px 0 rgba(4, 17, 13, .68);
}

.pixel-page.pixel-checkin .brand {
  font-size: 14px;
}

.pixel-page.pixel-checkin .brand-pixel {
  width: 21px;
  height: 24px;
}

.pixel-page.pixel-checkin .checkin-header > p {
  font-size: 14px;
}

.pixel-page.pixel-checkin .checkin-header > p span,
.pixel-page.pixel-checkin .section-index {
  font-size: 12px;
}

.pixel-page.pixel-checkin .checkin-header > p span {
  color: #c8d7c7;
}

.pixel-page.pixel-checkin .section-index {
  color: #b7c8b5;
}

.pixel-page.pixel-checkin .back-link {
  padding: 8px 10px;
  border-width: 2px;
  background: rgba(255, 249, 232, .94);
  box-shadow: 2px 2px 0 rgba(4, 17, 13, .68);
  font-size: 13px;
}

.pixel-page.pixel-checkin .checkin-workspace {
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  min-height: calc(100vh - 88px);
  padding: 18px 0 0;
}

.pixel-page.pixel-checkin .capture-panel,
.pixel-page.pixel-checkin .judgment-workspace {
  align-self: start;
  min-height: 0;
}

.pixel-page.pixel-checkin .capture-panel {
  padding: 18px;
  border: 1px solid rgba(74, 46, 29, .48);
  background: rgba(255, 247, 211, .9);
  box-shadow: 0 3px 0 rgba(4, 17, 13, .26);
}

.pixel-page.pixel-checkin .capture-panel::before,
.pixel-page.pixel-checkin .capture-panel::after {
  display: none;
}

.pixel-page.pixel-checkin .capture-panel > .section-heading {
  position: relative;
  min-height: 126px;
  margin: -18px -18px 18px;
  padding: 18px 108px 16px 18px;
  overflow: hidden;
  border-bottom: 3px solid var(--checkin-control-gold);
  background: rgba(18, 57, 45, .94);
}

.pixel-page.pixel-checkin .capture-panel > .section-heading::before {
  position: absolute;
  inset: auto 0 0;
  height: 24px;
  background: rgba(91, 139, 77, .38);
  content: "";
  pointer-events: none;
}

.pixel-page.pixel-checkin .capture-panel > .section-heading::after {
  position: absolute;
  right: 6px;
  bottom: -2px;
  width: 94px;
  height: 122px;
  background-image: url("/assets/artist/character-states-cutout.png");
  background-position: 59.85% 36.28%;
  background-repeat: no-repeat;
  background-size: 650% 487%;
  content: "";
  filter: drop-shadow(3px 3px 0 rgba(40, 29, 18, .42));
  image-rendering: pixelated;
  pointer-events: none;
}

.pixel-page.pixel-checkin .capture-panel > .section-heading h1 {
  position: relative;
  z-index: 1;
  color: #fff8dc;
  font-size: 27px;
}

.pixel-page.pixel-checkin .capture-panel > .section-heading .section-index {
  position: relative;
  z-index: 1;
  color: #f2c65b;
}

.pixel-page.pixel-checkin .capture-panel > .section-heading > p:last-child {
  position: relative;
  z-index: 1;
  color: #d5e8dc;
}

.pixel-page.pixel-checkin .section-heading h2 {
  font-size: 23px;
}

.pixel-page.pixel-checkin .section-heading > p:last-child {
  font-size: 13px;
  line-height: 1.65;
}

.pixel-page.pixel-checkin #checkin-form {
  gap: 13px;
  margin-top: 0;
}

.pixel-page.pixel-checkin :where(.text-field > span, .file-field > span, .task-field > span) {
  font-size: 13px;
}

.pixel-page.pixel-checkin :where(.text-field input, .task-field select) {
  min-height: 44px;
  border: 2px solid var(--checkin-control-brown);
  background: var(--checkin-control-cream-light);
  box-shadow: inset 2px 2px 0 #e1d2a7;
}

.pixel-page.pixel-checkin .file-field {
  padding: 12px 0 2px;
  border: 0;
  border-top: 1px solid rgba(74, 46, 29, .32);
  background: transparent;
  box-shadow: none;
}

.pixel-page.pixel-checkin .file-field small,
.pixel-page.pixel-checkin .file-field input {
  font-size: 12px;
}

.pixel-page.pixel-checkin .file-field input::file-selector-button {
  min-height: 36px;
  border-width: 2px;
  background: var(--checkin-control-cream);
  color: var(--checkin-control-brown-deep);
  box-shadow: 2px 2px 0 var(--checkin-control-brown);
}

.pixel-page.pixel-checkin :where(.privacy-state, .checkin-status, .resolution-note) {
  min-height: 0;
  margin-block: 0;
  padding: 9px 10px 9px 13px;
  border: 0 !important;
  border-left: 3px solid #8a9c82 !important;
  background: rgba(255, 249, 232, .62) !important;
  box-shadow: none;
  color: #455f55;
  font-size: 13px;
  line-height: 1.6;
}

.pixel-page.pixel-checkin :where(.privacy-state, .checkin-status, .resolution-note)::before,
.pixel-page.pixel-checkin :where(.privacy-state, .checkin-status, .resolution-note)::after {
  display: none;
}

.pixel-page.pixel-checkin .checkin-status {
  margin-top: 12px;
  border-left-color: var(--checkin-state-green) !important;
  background: rgba(220, 233, 214, .82) !important;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="loading"] {
  border-left-color: #b69338 !important;
  background: rgba(244, 232, 185, .9) !important;
  color: #4c3f18;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="success"] {
  border-left-color: var(--checkin-state-green) !important;
  background: rgba(212, 234, 216, .9) !important;
  color: #174b38;
}

.pixel-page.pixel-checkin .checkin-status[data-kind="error"],
.pixel-page.pixel-checkin .progression-status[data-kind="error"] {
  border-left-color: var(--checkin-state-red) !important;
  background: rgba(247, 221, 210, .94) !important;
  color: #792d2a;
}

.pixel-page.pixel-checkin .resolution-note {
  border-left-color: #78966c !important;
  background: rgba(232, 239, 223, .72) !important;
}

.pixel-page.pixel-checkin :where(.primary-command, .secondary-command, .confirm-command) {
  min-height: 44px;
  border: 2px solid var(--checkin-control-brown-deep);
  box-shadow: 3px 3px 0 var(--checkin-control-brown-deep);
  font-size: 13px;
}

.pixel-page.pixel-checkin :where(.primary-command, .confirm-command) {
  background: var(--checkin-control-gold);
  color: var(--checkin-control-brown-deep);
}

.pixel-page.pixel-checkin .secondary-command {
  border-color: var(--checkin-control-brown-deep);
  background: var(--checkin-control-cream);
  color: var(--checkin-control-brown-deep);
}

.pixel-page.pixel-checkin :where(.primary-command, .secondary-command, .confirm-command):not(:disabled):active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--checkin-control-brown-deep);
}

.pixel-page.pixel-checkin .judgment-workspace {
  padding: 20px;
  border: 3px solid var(--checkin-shadow);
  background: rgba(9, 38, 30, .79);
  box-shadow: 5px 5px 0 rgba(4, 17, 13, .72), inset 0 0 0 1px rgba(142, 213, 207, .16);
  backdrop-filter: blur(2px);
}

.pixel-page.pixel-checkin .judgment-workspace::before,
.pixel-page.pixel-checkin .judgment-workspace::after {
  width: 8px;
  height: 8px;
  border-width: 2px;
}

.pixel-page.pixel-checkin .judgment-heading {
  align-items: end;
  padding-bottom: 12px;
  border-bottom: 2px solid rgba(229, 184, 74, .62);
}

.pixel-page.pixel-checkin .authority-badge {
  padding: 6px 9px;
  border: 1px solid rgba(229, 184, 74, .62);
  background: rgba(255, 241, 199, .94);
  color: var(--checkin-control-brown-deep);
  box-shadow: none;
  font-size: 12px;
}

.pixel-page.pixel-checkin .judgment-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 12px;
  border: 1px solid rgba(229, 184, 74, .32);
  background: rgba(255, 248, 216, .9);
  box-shadow: none;
}

.pixel-page.pixel-checkin .judgment-grid > div {
  min-height: 82px;
  padding: 12px 14px;
  border-right: 1px solid rgba(74, 46, 29, .28);
  border-bottom: 1px solid rgba(74, 46, 29, .28);
  background: rgba(255, 248, 216, .74);
}

.pixel-page.pixel-checkin .judgment-grid dt {
  color: #64766d;
  font-size: 12px;
}

.pixel-page.pixel-checkin .judgment-grid dd {
  margin-top: 6px;
  font-size: 16px;
}

.pixel-page.pixel-checkin .decision-form {
  max-width: none;
  margin-top: 15px;
  padding: 16px 0 0;
  border: 0;
  border-top: 2px solid rgba(229, 184, 74, .5);
  background: transparent;
  box-shadow: none;
}

.pixel-page.pixel-checkin .task-field {
  position: relative;
  gap: 7px;
  padding: 12px;
  border: 1px solid rgba(74, 46, 29, .38);
  background: rgba(255, 244, 194, .92);
  box-shadow: none;
  clip-path: none;
  filter: none;
}

.pixel-page.pixel-checkin .task-field > span {
  width: auto;
  padding: 0;
  color: var(--checkin-ink);
  background: transparent;
  clip-path: none;
}

.pixel-page.pixel-checkin .task-field > span::before {
  color: #89704b;
  content: "◆";
}

.pixel-page.pixel-checkin .task-field select {
  appearance: auto;
  padding: 9px 11px;
  border: 2px solid var(--checkin-control-brown) !important;
  background: var(--checkin-control-cream-light) !important;
  box-shadow: inset 2px 2px 0 #e1d2a7;
  clip-path: none;
}

.pixel-page.pixel-checkin .task-field::after {
  display: none;
}

.pixel-page.pixel-checkin .override-field {
  grid-template-columns: 22px minmax(0, 1fr);
  min-height: 0;
  padding: 10px 12px;
  border: 0 !important;
  border-left: 3px solid #a27a3a !important;
  background: rgba(245, 235, 201, .82);
  box-shadow: none;
  clip-path: none;
  filter: none;
  font-size: 13px;
}

.pixel-page.pixel-checkin .override-field::after {
  display: none;
}

.pixel-page.pixel-checkin .override-field:has(input:checked) {
  border-left-color: var(--checkin-control-cyan) !important;
  background: rgba(217, 234, 215, .9);
  box-shadow: none;
}

.pixel-page.pixel-checkin .override-field input {
  appearance: none;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  border: 2px solid var(--checkin-control-brown-deep);
  background: var(--checkin-control-cream-light);
  box-shadow: none;
  cursor: pointer;
}

.pixel-page.pixel-checkin .override-field input:checked {
  background: var(--checkin-control-cyan);
  box-shadow: inset 0 0 0 4px #dff6f3;
}

.pixel-page.pixel-checkin #confidence-state[data-confidence="low"] {
  color: #9a641f;
}

.pixel-page.pixel-checkin .decision-commands {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
}

.pixel-page.pixel-checkin .progression-panel {
  height: auto;
  max-height: 360px;
  margin-top: 18px;
  padding: 15px;
  border: 1px solid rgba(49, 91, 72, .52);
  background: rgba(255, 244, 194, .92);
  box-shadow: none;
}

.pixel-page.pixel-checkin :where(.progression-heading h2, .progression-phase strong) {
  font-size: 15px;
}

.pixel-page.pixel-checkin :where(
  .progression-phase span,
  .progression-meta p span,
  .decoration-controls label span,
  .decoration-swatch
) {
  font-size: 12px;
}

.pixel-page.pixel-checkin :where(.progression-meta p strong, .decoration-controls select, .progression-status) {
  font-size: 13px;
}

.pixel-page.pixel-checkin .progression-phase {
  border: 1px solid rgba(49, 91, 72, .5);
  border-left: 3px solid #78966c;
  background: rgba(255, 248, 216, .76);
}

.pixel-page.pixel-checkin :where(.icon-command, .icon-text-command) {
  border: 2px solid var(--checkin-control-brown-deep);
  background: var(--checkin-control-cream);
  color: var(--checkin-control-brown-deep);
  box-shadow: 2px 2px 0 var(--checkin-control-brown);
}

.pixel-page.pixel-checkin .icon-text-command {
  font-size: 13px;
}

.pixel-page.pixel-checkin .progression-status[data-kind="success"] {
  color: #176046;
}

@media (max-width: 760px) {
  body.pixel-page.pixel-checkin {
    background-position: 54% top;
    background-attachment: scroll;
  }

  body.pixel-page.pixel-checkin::before {
    background: rgba(5, 19, 15, .24);
  }

  .pixel-page.pixel-checkin .checkin-app {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-top: 0;
    overflow-x: clip;
  }

  .pixel-page.pixel-checkin .checkin-header {
    top: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border-right: 0;
    border-left: 0;
  }

  .pixel-page.pixel-checkin .brand {
    min-width: 0;
    overflow: hidden;
  }

  .pixel-page.pixel-checkin .back-link {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .pixel-page.pixel-checkin .checkin-workspace {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 12px;
    padding: 12px 10px 0;
  }

  .pixel-page.pixel-checkin .capture-panel,
  .pixel-page.pixel-checkin .judgment-workspace {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 16px 14px;
  }

  .pixel-page.pixel-checkin .capture-panel > .section-heading {
    min-height: 118px;
    margin: -16px -14px 16px;
    padding: 16px 102px 14px 14px;
  }

  .pixel-page.pixel-checkin .capture-panel > .section-heading::after {
    width: 88px;
    height: 114px;
  }
}

@media (max-width: 420px) {
  .pixel-page.pixel-checkin .checkin-header {
    min-height: 58px;
  }

  .pixel-page.pixel-checkin .checkin-header > p {
    display: none;
  }

  .pixel-page.pixel-checkin .brand,
  .pixel-page.pixel-checkin .back-link {
    font-size: 13px;
  }

  .pixel-page.pixel-checkin .capture-panel,
  .pixel-page.pixel-checkin .judgment-workspace {
    padding: 14px 12px;
  }

  .pixel-page.pixel-checkin .capture-panel > .section-heading {
    min-height: 112px;
    margin: -14px -12px 14px;
    padding: 15px 88px 12px 12px;
  }

  .pixel-page.pixel-checkin .capture-panel > .section-heading::after {
    right: 2px;
    width: 78px;
    height: 104px;
  }

  .pixel-page.pixel-checkin .capture-panel > .section-heading h1 {
    font-size: 24px;
  }

  .pixel-page.pixel-checkin .judgment-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 9px;
  }

  .pixel-page.pixel-checkin .judgment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pixel-page.pixel-checkin .judgment-grid > div {
    min-height: 88px;
    padding: 10px;
  }

  .pixel-page.pixel-checkin .judgment-grid > div:nth-child(2n) {
    border-right: 0;
  }

  .pixel-page.pixel-checkin .judgment-grid > div:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .pixel-page.pixel-checkin .decision-form {
    padding-top: 14px;
  }

  .pixel-page.pixel-checkin .decision-commands {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  }

  .pixel-page.pixel-checkin .progression-panel {
    max-height: 440px;
    padding: 12px;
  }

  .pixel-page.pixel-checkin .progression-phase-list {
    grid-template-columns: 1fr;
  }

  .pixel-page.pixel-checkin .decoration-controls {
    grid-template-columns: 1fr 1fr;
  }
}