:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #172332; background: #e8edf0; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: linear-gradient(145deg, #e6eef0 0%, #f7f9f7 46%, #e8e5dc 100%); min-height: 100vh; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.app-shell { width: min(100%, 900px); min-height: 100vh; margin: auto; padding: 28px 24px 44px; display: flex; flex-direction: column; }
.app-header { display: flex; align-items: center; gap: 14px; margin: 0 auto 30px; max-width: 720px; }
.app-header-text { flex: 1; min-width: 0; }
.app-logo { width: 56px; height: auto; margin-left: auto; flex: 0 0 auto; display: block; object-fit: contain; }
.brand-mark { display: grid; place-items: center; width: 56px; height: 46px; border-radius: 14px; color: #fff; background: #0c4267; font-weight: 800; font-size: 24px; box-shadow: 0 7px 18px #0c42672b; }
h1, h2, p { margin: 0; } h1 { color: #0f2f49; font-size: clamp(22px, 4vw, 30px); letter-spacing: -0.03em; } h2 { font-size: clamp(23px, 4vw, 31px); letter-spacing: -0.035em; }
.eyebrow { color: #607383; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.intro, .object-title, #check-form { max-width: 720px; margin: auto; }
.intro-copy { margin-bottom: 23px; color: #536372; font-size: 17px; line-height: 1.45; }
.field-label, .controller-field > span, .select-field > span { display: block; color: #243746; font-size: 14px; font-weight: 700; margin-bottom: 8px; }
.search, .controller-field input, select { width: 100%; min-height: 50px; border: 1px solid #c6d0d5; border-radius: 12px; padding: 0 15px; color: #172332; background: #fff; outline: none; }
.search:focus, .controller-field input:focus, select:focus { border-color: #0c6fa4; box-shadow: 0 0 0 3px #0c6fa426; }
.object-list { display: grid; max-width: 720px; margin: 18px auto; gap: 12px; }
.object-card { display: grid; grid-template-columns: 48px 1fr 28px; gap: 12px; align-items: center; width: 100%; min-height: 76px; border: 1px solid #d7dfe1; border-radius: 16px; padding: 12px; text-align: left; color: #183347; background: #fff; box-shadow: 0 2px 4px #122d3910; transition: transform .15s, border-color .15s; }
.object-card:hover, .object-card:focus-visible { transform: translateY(-1px); border-color: #4c8caf; outline: none; }.object-card strong { display: block; font-size: 17px; }.object-card small { display: block; margin-top: 3px; color: #657581; font-size: 13px; }.object-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #e8f2f5; color: #116893; font-size: 25px; }.arrow { justify-self: end; color: #5081a0; font-size: 32px; font-weight: 300; }
.back-link { min-height: 44px; margin: 0 0 14px; border: 0; padding: 0; color: #176188; background: transparent; font-weight: 700; }.object-title { padding: 15px 0 23px; }.object-title h2 { margin: 4px 0 5px; }.object-title p { color: #647583; }
#check-form { display: grid; gap: 18px; }.controller-field { display: block; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #d7dfe1; }.controller-field b, .required { color: #c6382e; }.checklist { display: grid; gap: 14px; }.check-field { margin: 0; border: 1px solid #d7dfe1; border-radius: 16px; padding: 18px; background: #fff; }.check-field legend { float: left; width: 100%; padding: 0; color: #1c3243; font-size: 17px; font-weight: 750; line-height: 1.3; }.check-field legend + * { clear: both; }.answer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding-top: 18px; }.answer { min-height: 52px; border: 1px solid #b9c8cf; border-radius: 11px; color: #233845; background: #fff; font-weight: 750; }.answer.selected.yes { color: #08683d; border-color: #0a9e60; background: #dff5e8; }.answer.selected.no { color: #a62824; border-color: #d54d46; background: #ffebea; }.answer.selected.neutral { color: #4a5460; border-color: #75828b; background: #eff2f3; }.select-field { display: block; }.select-field select { margin-top: 12px; }.save-button { min-height: 58px; border: 0; border-radius: 14px; color: #fff; background: #0c557d; font-size: 18px; font-weight: 800; box-shadow: 0 5px 12px #0c557d30; }.save-button:hover:not(:disabled) { background: #083e5c; }.save-button:disabled { cursor: wait; opacity: .7; }.form-message { min-height: 1.2em; margin: -4px 0 0; font-weight: 650; line-height: 1.35; }.form-message.error { color: #af2f27; }.form-message.success { color: #08703f; }.loading, .empty { max-width: 720px; margin: 80px auto; color: #576a76; text-align: center; }
.object-secs { display: block; margin-top: 6px; color: #4c8caf; font-size: 12px; font-weight: 700; }
.header-card, #accordion-root, .tab-bar, .mode-tabs { max-width: 720px; margin-left: auto; margin-right: auto; }
.header-card { padding: 18px 20px 22px; border: 1px solid #d7dfe1; border-radius: 16px; background: #fff; margin-bottom: 16px; }
.header-card h3 { margin: 0 0 14px; color: #0f2f49; font-size: 18px; letter-spacing: -0.01em; }
.header-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.header-field { display: block; }
.header-field-wide { grid-column: 1 / -1; }
.object-icon.new { background: #0c557d; color: #fff; }
.inspection-new { border-color: #9ec3d6; background: #f3f9fc; }
.inspection-row { display: grid; grid-template-columns: 1fr 52px; gap: 8px; align-items: stretch; }
.inspection-row .object-card { min-width: 0; }
.download-excel {
  display: grid;
  place-items: center;
  min-height: 76px;
  border: 1px solid #d7dfe1;
  border-radius: 16px;
  background: #fff;
  color: #0c557d;
  text-decoration: none;
  font-size: 22px;
  box-shadow: 0 2px 4px #122d3910;
}
.download-excel:hover, .download-excel:focus-visible {
  border-color: #4c8caf;
  background: #e8f3f8;
  outline: none;
}
.header-field > span { display: block; color: #243746; font-size: 14px; font-weight: 700; margin-bottom: 8px; }
.header-field input, .header-field select { width: 100%; min-height: 46px; border: 1px solid #c6d0d5; border-radius: 11px; padding: 0 14px; color: #172332; background: #fff; outline: none; }
.header-field input:focus, .header-field select:focus { border-color: #0c6fa4; box-shadow: 0 0 0 3px #0c6fa426; }
.field-hint { display: block; margin-top: 6px; color: #657581; font-size: 12px; font-weight: 600; }
.tab-bar {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin: 0 auto 12px;
  padding-bottom: 4px;
  position: relative;
  -webkit-overflow-scrolling: touch;
}
.tab {
  flex: 0 0 auto;
  display: grid;
  gap: 2px;
  min-height: 52px;
  border: 1px solid #d7dfe1;
  border-radius: 14px;
  padding: 8px 14px;
  background: #fff;
  color: #183347;
  font-weight: 750;
  text-align: left;
}
.tab small { color: #657581; font-weight: 650; }
.tab.active { border-color: #0c6fa4; background: #e8f3f8; color: #0c4267; }
.mode-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 auto 16px; }
.mode-tab { min-height: 48px; border: 1px solid #d7dfe1; border-radius: 12px; background: #fff; font-weight: 750; color: #243746; }
.mode-tab.active { background: #0c557d; color: #fff; border-color: #0c557d; }
#accordion-root { display: grid; gap: 14px; }
.accordion-category { border: 1px solid #d7dfe1; border-radius: 16px; background: #fff; overflow: hidden; }
.accordion-stage { border-top: 1px solid #e3eaec; }
.accordion-header { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; border: 0; background: transparent; padding: 16px 18px; color: #172332; font: inherit; }
.accordion-header:hover { background: #f4f8fa; }
.category-header { background: linear-gradient(180deg, #eef6f9 0%, #e6f0f4 100%); }
.category-header strong { font-size: 18px; letter-spacing: -0.01em; color: #0f2f49; }
.stage-header { padding-left: 30px; background: #fbfcfc; }
.stage-header span { font-weight: 700; color: #1c3243; font-size: 15px; }
.accordion-header > span:first-child { display: inline-flex; align-items: center; gap: 10px; }
.acc-chevron { display: inline-block; width: 20px; text-align: center; color: #5081a0; font-size: 13px; }
.acc-badge { min-width: 28px; height: 28px; display: grid; place-items: center; padding: 0 10px; border-radius: 999px; background: #0c4267; color: #fff; font-weight: 800; font-size: 13px; }
.acc-badge.small { background: #e8f2f5; color: #0c4267; font-size: 12px; }
.stage-body { padding: 6px 14px 18px 30px; }
.task-title { margin: 0 0 12px; color: #1c3243; font-size: 16px; font-weight: 750; line-height: 1.35; }
.task-num { display: inline-block; margin-right: 6px; color: #5081a0; }
.answer-grid { padding-top: 4px; }
.answer-grid.cols-2 { grid-template-columns: 1fr 1fr; }
.answer-grid.cols-5 { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.answer.selected { color: #0c4267; border-color: #0c6fa4; background: #e8f3f8; }
.quant-row { display: flex; align-items: center; gap: 8px; }
.quant-row select { flex: 1; min-height: 48px; }
.stepper { width: 48px; min-height: 48px; border: 1px solid #b9c8cf; border-radius: 11px; background: #fff; font-size: 22px; font-weight: 700; }
.quant-max { color: #657581; font-size: 13px; white-space: nowrap; }
.task-hint { margin: 0 0 12px; color: #3e5363; font-size: 14px; line-height: 1.45; }
.task-hint.muted, .muted { color: #7a8a94; }
.remark-comment, .visual-marker { width: 100%; border: 1px solid #c6d0d5; border-radius: 11px; padding: 10px 14px; color: #172332; background: #fff; resize: vertical; }
.photo-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.photo-button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 11px; background: #e8f2f5; color: #116893; font-weight: 750; cursor: pointer; }
.photo-button input { display: none; }
.photo-preview { width: 88px; height: 88px; object-fit: cover; border-radius: 10px; border: 1px solid #d7dfe1; }
.save-status { max-width: 720px; margin: 18px auto 0; min-height: 1.3em; color: #657581; font-weight: 650; }
.save-status.ok { color: #08703f; }
.save-status.error { color: #af2f27; }
.admin-entry {
  display: inline-block;
  margin: 28px 0 0 auto;
  max-width: 720px;
  width: fit-content;
  align-self: flex-end;
  color: #657581;
  font-size: 13px;
  font-weight: 650;
  text-decoration: none;
}
.admin-entry:hover, .admin-entry:focus-visible { color: #0c557d; text-decoration: underline; outline: none; }
.admin-panel { max-width: 720px; margin: 0 auto; display: grid; gap: 18px; }
.admin-card { padding: 18px 20px; border: 1px solid #d7dfe1; border-radius: 16px; background: #fff; }
.admin-card h3 { margin: 0 0 8px; color: #0f2f49; font-size: 18px; }
.admin-card p { margin: 0 0 14px; color: #657581; font-size: 14px; line-height: 1.4; }
.admin-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.admin-button {
  min-height: 44px;
  border: 1px solid #c6d0d5;
  border-radius: 11px;
  padding: 0 14px;
  background: #fff;
  color: #183347;
  font-weight: 750;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}
.admin-button.primary { background: #0c557d; border-color: #0c557d; color: #fff; }
.admin-button.danger { color: #a62824; border-color: #e0a7a3; background: #fff7f6; }
.admin-button:disabled { opacity: .6; cursor: wait; }
.admin-file { display: none; }
.admin-meta { margin: 0 0 12px; color: #3e5363; font-size: 13px; font-weight: 650; }
.admin-list { display: grid; gap: 8px; }
.admin-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid #e3eaec;
  border-radius: 12px;
  background: #fbfcfc;
}
.admin-row strong { display: block; color: #183347; font-size: 15px; }
.admin-row small { display: block; margin-top: 3px; color: #657581; font-size: 12px; }
.admin-row-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.admin-status { min-height: 1.3em; margin: 0; font-weight: 650; color: #657581; }
.admin-status.ok { color: #08703f; }
.admin-status.error { color: #af2f27; }
.object-editor {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #cfe0e8;
  border-radius: 14px;
  background: #f4f9fb;
}
.object-editor h4 { margin: 0 0 14px; color: #0f2f49; font-size: 16px; }
.object-editor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.object-editor input[readonly] { background: #e8eef1; color: #536372; }
.sections-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.sections-editor-list { display: grid; gap: 10px; }
.section-editor-row {
  display: grid;
  grid-template-columns: 110px 1fr 100px 44px;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid #d7dfe1;
  border-radius: 12px;
  background: #fff;
}
.section-editor-row .admin-button { min-height: 46px; padding: 0; justify-content: center; }
@media (max-width: 540px) {
  .app-shell { padding: 20px 16px 32px; }
  .answer-grid { gap: 7px; }
  .answer { font-size: 15px; }
  .check-field { padding: 16px; }
  .stage-body { padding-left: 14px; }
  .stage-header { padding-left: 16px; }
  .admin-row { grid-template-columns: 1fr; }
  .section-editor-row { grid-template-columns: 1fr 1fr; }
  .section-editor-row .admin-button { grid-column: 1 / -1; }
}
