:root {
  color-scheme: only light;
  supported-color-schemes: light;
  background: #ffffff;

  /* 2026-08-18 지시서 단계2(바) -- 큐레이터 "지금 할 일" 화면에서
     뽑아낸 공통 부품. Blueprint/DESIGN_RULES.md 2~5장(글자·버튼·색·
     간격) 값을 변수로 고정해 다른 화면도 나중에 그대로 가져다 쓸 수
     있게 한다. ★ 이번 세션에서는 curator-next-task.css 외 다른 화면에
     실제로 적용하지 않는다(A조 작업과 충돌 방지) -- 값만 여기 둔다. */
  --h24-space-1: 4px;
  --h24-space-2: 8px;
  --h24-space-3: 16px;
  --h24-space-4: 24px;
  --h24-space-5: 32px;
  --h24-space-6: 48px;

  --h24-font-body: 18px;
  --h24-font-button: 20px;
  --h24-font-title: 22px;
  --h24-font-display: 28px;

  --h24-button-height: 56px;

  --h24-color-text: #17202a;
  --h24-color-brand: #10233f;
  --h24-color-surface: #ffffff;
  --h24-color-surface-muted: #f7f9fc;
  --h24-color-border: #e2e8f0;
  --h24-color-turn-manager-bg: #e2e8f0;
  --h24-color-turn-manager-text: #4b5563;
  --h24-color-turn-stuck-bg: #fef3c7;
  --h24-color-turn-stuck-text: #92400e;
}

html {
  min-height: 100%;
  background-color: #ffffff;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Arial, "Noto Sans KR", sans-serif;
  background: #f4f6f8;
  color: #1f2933;
}

header {
  background: linear-gradient(135deg, #167a4a, #2e8b57);
  color: white;
  padding: 18px 24px;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.5px;
}

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px;
  background: white;
  border-bottom: 1px solid #dde3ea;
  position: sticky;
  top: 0;
  z-index: 10;
}

button {
  border: 0;
  border-radius: 10px;
  padding: 11px 16px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  background: #167a4a;
  color: white;
  box-shadow: 0 2px 5px rgba(0,0,0,0.12);
}

button:hover {
  background: #0f623a;
}

button.secondary {
  background: #e9eef3;
  color: #1f2933;
}

button.warning {
  background: #d64545;
}

input,
textarea,
select {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccd6e0;
  border-radius: 10px;
  font-size: 15px;
  margin-top: 6px;
}

#map {
  width: 100%;
  height: 540px;
  border-bottom: 1px solid #d8dee6;
}

.box {
  padding: 18px;
}

h2 {
  margin: 18px 0 12px;
  font-size: 22px;
}

h3 {
  margin: 22px 0 10px;
  font-size: 19px;
}

h4 {
  margin: 14px 0 10px;
  font-size: 17px;
}

.survey-item,
.building-item,
.timeline-card {
  background: white;
  border: 1px solid #dce4ec;
  border-radius: 14px;
  padding: 14px;
  margin: 10px 0;
  box-shadow: 0 2px 7px rgba(31, 41, 51, 0.06);
}

.building-section {
  display: grid;
  grid-template-columns: 42% 58%;
  gap: 18px;
  align-items: start;
}

.building-list-box,
.building-detail-box {
  background: #f8fafc;
  border-radius: 16px;
}

.building-detail-box {
  position: sticky;
  top: 76px;
  background: white;
  border: 1px solid #dce4ec;
  padding: 18px;
  max-height: calc(100vh - 90px);
  overflow-y: auto;
}

#buildingList .building-item {
  border-left: 6px solid #2e8b57;
}

#buildingDetail {
  line-height: 1.55;
}

#buildingDetail p {
  margin: 7px 0;
}

#energySurveyBox {
  margin-top: 12px;
}

#energySurveyBox .building-item {
  border-left: 6px solid #2563eb;
}

#energySurveyBox button {
  margin: 5px 6px 5px 0;
  background: #2563eb;
}

#energySurveyBox button:hover {
  background: #1d4ed8;
}

#policyListBox .building-item {
  border-left: 6px solid #f59e0b;
}

.connect-status {
  margin: 6px 0 4px;
  font-size: 14px;
  color: #64748b;
}

.connect-status-error {
  color: #dc2626;
  font-weight: 700;
}

.connect-loading,
.connect-empty {
  color: #64748b;
  font-size: 14px;
}

.connect-error {
  color: #dc2626;
  font-weight: 700;
  font-size: 14px;
}

.connect-count {
  margin: 4px 0 10px;
}

.connect-area-active {
  border-left: 6px solid #2e8b57;
  background: #f0fbf5;
}

.progress-card {
  background: white;
  border-radius: 16px;
  padding: 16px;
  border: 1px solid #dce4ec;
  margin: 12px 0;
}

.progress-bar {
  width: 100%;
  height: 18px;
  background: #e5eaf0;
  border-radius: 999px;
  overflow: hidden;
  margin: 10px 0;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #2e8b57, #22c55e);
  border-radius: 999px;
}

.status-red {
  color: #dc2626;
  font-weight: 800;
}

.status-yellow {
  color: #ca8a04;
  font-weight: 800;
}

.status-green {
  color: #16a34a;
  font-weight: 800;
}

.status-gray {
  color: #64748b;
  font-weight: 800;
}

.mission-card {
  background: white;
  border-radius: 18px;
  padding: 18px;
  border: 1px solid #dce4ec;
  box-shadow: 0 4px 12px rgba(31, 41, 51, 0.08);
  margin: 12px 0;
}

.mission-title {
  font-size: 20px;
  font-weight: 900;
  margin-bottom: 8px;
}

.mission-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.mission-step {
  background: #f8fafc;
  border-radius: 14px;
  padding: 14px;
  border: 1px solid #e2e8f0;
}

@media (max-width: 900px) {
  .building-section {
    grid-template-columns: 1fr;
  }

  .building-detail-box {
    position: static;
    max-height: none;
  }

  #map {
    height: 430px;
  }

  button {
    width: 100%;
    margin-right: 0;
  }

  .toolbar button {
    width: auto;
    flex: 1 1 140px;
  }

  .mission-grid {
    grid-template-columns: 1fr;
  }
}

.welfare-recommendation-panel {
  position: fixed;
  inset: 5% 5% auto auto;
  z-index: 10000;
  width: min(520px, 90vw);
  max-height: 88vh;
  overflow-y: auto;
  padding: 20px;
  border: 2px solid #1b7f4b;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.22);
}

.welfare-recommendation-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.welfare-recommendation-header h3 {
  margin: 0;
}

.welfare-recommendation-warning {
  padding: 12px;
  border-radius: 8px;
  background: #fff4d6;
  color: #684c00;
}

.welfare-recommendation-card {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #d7dfda;
  border-radius: 8px;
  background: #f8fbf9;
}

.welfare-recommendation-card h4 {
  margin: 0 0 10px;
}

.welfare-recommendation-card p {
  margin: 6px 0;
}


.consultation-outcome-form {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #d7dfda;
}

.consultation-outcome-form h5 {
  margin: 0 0 10px;
}

.consultation-outcome-form label {
  display: block;
  margin: 10px 0;
  font-weight: 600;
}

.consultation-outcome-form select,
.consultation-outcome-form textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin-top: 5px;
  padding: 8px;
  font: inherit;
}

.consultation-outcome-message {
  min-height: 1.4em;
  margin-bottom: 0;
}


.consultation-history-title {
  margin: 24px 0 8px;
  padding-top: 16px;
  border-top: 2px solid #d7dfda;
}

.consultation-history-item {
  position: relative;
  margin: 10px 0 10px 10px;
  padding: 12px 14px;
  border-left: 3px solid #1b7f4b;
  background: #f8fbf9;
}

.consultation-history-item::before {
  position: absolute;
  top: 15px;
  left: -8px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #1b7f4b;
  content: "";
}

.consultation-history-item h4 {
  margin: 0 0 8px;
}

.consultation-history-item p {
  margin: 5px 0;
}


.map-load-error {
  display: grid;
  min-height: 360px;
  place-items: center;
  padding: 24px;
  border: 2px dashed #dc2626;
  background: #fff7f7;
  color: #991b1b;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}


.energy-survey-launch {
  /* 2026-08-30 지시서 1순위: #roleCockpitDetailClose와 같은 패턴 --
     position:fixed에 width를 지정하지 않으면 이 파일의
     "@media(max-width:900px){button{width:100%}}" 규칙을 그대로
     상속받아 히트박스가 뷰포트 전체 폭으로 퍼진다(직전 세션에서 확정한
     원인, docs/demo/progress/2026-08-28-A조-큐레이터클릭막힘.md 4절).
     이 버튼은 URL에 household_id 쿼리가 있을 때만 나타나는 딥링크
     진입 버튼(frontend/energy-field-survey.js)이라 감사 크롤은 지나가지
     않지만 같은 함정이라 미리 막는다. */
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 500;
  width: auto;
  min-height: 54px;
  background: #123e68;
}

.energy-field-dialog {
  width: min(720px, 100%);
  max-width: 100%;
  max-height: 100dvh;
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: 22px;
  background: #f7f9fc;
  color: #17202a;
}

.energy-field-dialog::backdrop {
  background: rgba(9, 24, 39, 0.7);
}

.energy-field-dialog form {
  display: flex;
  min-height: min(760px, 94dvh);
  flex-direction: column;
  padding: 22px;
}

.energy-field-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.energy-field-header h2 {
  margin: 3px 0 6px;
  color: #123e68;
}

.energy-field-header p {
  margin: 0;
}

.energy-field-eyebrow {
  color: #b51f32;
  font-size: 14px;
  font-weight: 800;
}

.energy-field-progress {
  height: 12px;
  margin-top: 20px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfe7ef;
}

#energyFieldProgressBar {
  height: 100%;
  border-radius: inherit;
  background: #123e68;
  transition: width 180ms ease;
}

.energy-field-step-label {
  margin: 12px 0 5px;
  color: #123e68;
  font-size: 18px;
  font-weight: 900;
}

.energy-field-message {
  min-height: 25px;
  margin-bottom: 8px;
  color: #216e45;
  font-weight: 700;
}

.energy-field-message.is-error {
  color: #b42318;
}

#energyFieldStep {
  flex: 1;
}

#energyFieldStep > fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

#energyFieldStep > fieldset > legend {
  margin-bottom: 14px;
  font-size: 23px;
  font-weight: 900;
}

#energyFieldStep label {
  display: block;
  margin: 15px 0;
  font-size: 17px;
  font-weight: 800;
}

#energyFieldStep input,
#energyFieldStep select {
  min-height: 52px;
  background: #fff;
  font-size: 17px;
}

.energy-choice {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
  padding: 14px;
  border: 1px solid #cbd7e3;
  border-radius: 14px;
  background: #fff;
}

.energy-choice legend {
  grid-column: 1 / -1;
  padding: 0 4px;
  font-size: 17px;
  font-weight: 900;
}

.energy-choice label {
  display: flex !important;
  min-height: 52px;
  align-items: center;
  gap: 9px;
  margin: 0 !important;
  padding: 10px;
  border: 1px solid #d7e0e8;
  border-radius: 12px;
  background: #f8fafc;
}

.energy-choice input {
  width: 24px !important;
  min-height: 24px !important;
  margin: 0;
}

.energy-file {
  padding: 14px;
  border: 2px dashed #89a1b8;
  border-radius: 14px;
  background: #fff;
}

.energy-field-help,
.energy-missing,
.energy-ready {
  margin: 16px 0;
  padding: 14px;
  border-radius: 12px;
  line-height: 1.55;
}

.energy-field-help {
  background: #edf4fa;
  color: #29465f;
}

.energy-missing {
  border: 1px solid #f1b8b2;
  background: #fff2f0;
  color: #8a1c12;
}

.energy-ready {
  border: 1px solid #9fd3b7;
  background: #edf9f2;
  color: #17633e;
  font-weight: 800;
}

.energy-field-actions {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 10px;
  position: sticky;
  bottom: -22px;
  margin: 18px -22px -22px;
  padding: 14px 22px;
  border-top: 1px solid #dbe3eb;
  background: #fff;
}

.energy-field-actions button {
  min-height: 56px;
  font-size: 17px;
}

@media (max-width: 600px) {
  .energy-field-dialog {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
  }

  .energy-field-dialog form {
    min-height: 100dvh;
    padding: 16px;
  }

  .energy-field-header h2 {
    font-size: 21px;
  }

  .energy-field-header .secondary {
    width: auto;
    min-width: 82px;
  }

  .energy-choice {
    grid-template-columns: 1fr;
  }

  .energy-field-actions {
    bottom: -16px;
    margin: 16px -16px -16px;
    padding: 12px 16px max(12px, env(safe-area-inset-bottom));
  }
}


/* Happy24 responsive splash and authentication */
[hidden] { display: none !important; }

body.auth-pending { overflow: hidden; background: #fff; }

.auth-splash {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  min-height: 100dvh;
  padding: max(24px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));
  background: #fff;
}
.auth-splash img { display: block; width: min(420px, 64vw); max-height: 34vh; object-fit: contain; }
.auth-page {
  min-height: 100dvh;
  display: grid;
  grid-template-rows: 1fr auto;
  padding: max(28px, env(safe-area-inset-top)) 22px max(18px, env(safe-area-inset-bottom));
  background: linear-gradient(160deg, #fff 0%, #f5f7fa 100%);
}
.auth-panel { width: min(100%, 460px); margin: auto; }
.auth-brand { display: block; width: min(330px, 72vw); margin: 0 auto 18px; }
.auth-brand img { display: block; width: 100%; max-height: 150px; object-fit: contain; }
.auth-card {
  padding: 28px;
  border: 1px solid #e2e7ed;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 52px rgba(18, 48, 77, .12);
}
.auth-eyebrow { margin: 0 0 5px; color: #b3213d; font-size: 13px; font-weight: 800; }
.auth-card h1 { margin: 0; color: #183f67; font-size: 30px; }
.auth-description { margin: 8px 0 22px; color: #566473; line-height: 1.55; }
.auth-card label { display: block; margin-top: 14px; color: #273746; font-weight: 800; }
.auth-card input { min-height: 52px; border-radius: 10px; background: #fff; }
.auth-card button { width: 100%; min-height: 52px; margin-top: 22px; background: #174f7d; }
.auth-card button:hover { background: #103e64; }
.auth-message { min-height: 22px; margin: 12px 0 0; font-size: 14px; font-weight: 700; }
.auth-message[data-kind="error"] { color: #b42336; }
.auth-message[data-kind="success"] { color: #146c43; }
.auth-help { margin: 4px 0 0; padding-top: 16px; border-top: 1px solid #e7ebef; color: #687684; text-align: center; font-size: 14px; line-height: 1.55; }
.auth-footer { padding-top: 30px; color: #7a8793; text-align: center; font-size: 12px; }
.app-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 116px;
  padding: 8px 20px;
  background: #fff;
  border-bottom: 1px solid #dde3ea;
}
.app-header > img { width: 352px; height: 104px; max-width: 42vw; object-fit: contain; object-position: left center; }
.app-session { display: flex; align-items: center; gap: 12px; }
.app-session span { color: #30475d; font-size: 14px; font-weight: 800; }
.app-session button { box-shadow: none; }

@media (max-width: 640px) {
  .auth-splash img { width: min(245px, 62vw); max-height: 38vh; }
  .auth-page { padding-inline: 16px; }
  .auth-brand { width: min(220px, 58vw); margin-bottom: 10px; }
  .auth-card { padding: 22px 18px; border-radius: 15px; }
  .auth-card h1 { font-size: 27px; }
  .auth-description { font-size: 14px; }
  .app-header { min-height: 82px; padding: 5px 12px; }
  .app-header > img { width: 240px; height: 72px; max-width: calc(100vw - 120px); }
  .app-session span { display: none; }
  .app-session button { min-height: 42px; padding: 8px 11px; }
}

@media (min-width: 700px) and (max-width: 1100px) {
  .auth-splash img { width: min(430px, 52vw); }
  .auth-page { padding: max(36px, env(safe-area-inset-top)) 32px 24px; }
  .auth-panel { width: min(100%, 520px); }
  .auth-card { padding: 34px; }
  .energy-field-dialog { width: min(920px, 94vw); max-height: 92dvh; }
  .energy-field-dialog form { padding: 28px 30px; }
  #energyFieldStep > fieldset {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 22px;
  }
  #energyFieldStep > fieldset > legend,
  #energyFieldStep > fieldset > .energy-choice,
  #energyFieldStep > fieldset > .energy-file,
  #energyFieldStep > fieldset > .energy-field-help,
  #energyFieldStep > fieldset > .energy-field-missing,
  #energyFieldStep > fieldset > .energy-field-ready { grid-column: 1 / -1; }
  .energy-field-actions { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
}

@media (min-width: 1101px) {
  .auth-panel { width: min(100%, 500px); }
  .auth-card { padding: 34px 38px; }
}

@media (prefers-reduced-motion: no-preference) {
  .auth-splash img { animation: happy24-arrive .55s ease-out both; }
  @keyframes happy24-arrive {
    from { opacity: 0; transform: translateY(8px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
  }
}


/* Keep authentication surfaces consistent when mobile browsers force dark mode. */
.auth-splash,
.auth-page {
  background-color: #ffffff !important;
  color: #1f2933 !important;
}

.auth-splash img,
.auth-brand img {
  background-color: #ffffff !important;
  filter: none !important;
  mix-blend-mode: normal;
}

.auth-card {
  background-color: #ffffff !important;
  color: #1f2933 !important;
}

.auth-card input {
  background-color: #ffffff !important;
  color: #1f2933 !important;
  -webkit-text-fill-color: #1f2933;
  caret-color: #174f7d;
}

.auth-card input::placeholder {
  color: #7b8794 !important;
  opacity: 1;
}


/* FE-DASH-01: considerate mobile curator work board */
.curator-dashboard {
  width: min(100%, 980px);
  margin: 0 auto;
  padding: 24px 18px 90px;
}
.curator-welcome,
.curator-progress-heading,
.curator-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.curator-welcome h1 { margin: 4px 0; color: #173f66; font-size: clamp(25px, 4vw, 36px); }
.curator-eyebrow,
.curator-card-label {
  margin: 0;
  color: #b3213d;
  font-size: 13px;
  font-weight: 900;
}
.curator-date { margin: 5px 0 0; color: #607080; }
.curator-welcome button { width: auto; box-shadow: none; }
.curator-dashboard-message {
  margin: 18px 0;
  padding: 14px 16px;
  border-radius: 12px;
  background: #edf4fa;
  color: #29465f;
  font-weight: 700;
}
.curator-dashboard-message[data-kind="error"] { background: #fff0ef; color: #9d261e; }
.curator-next-work {
  margin-top: 24px;
  padding: 24px;
  border-radius: 22px;
  background: linear-gradient(140deg, #123e68, #1c5d8d);
  color: #fff;
  box-shadow: 0 15px 35px rgba(18, 62, 104, .2);
}
.curator-next-work .curator-card-label { color: #ffd2da; }
.curator-next-work h2 { margin: 8px 0; font-size: 29px; }
.curator-next-work p:not(.curator-card-label) { margin: 0 0 20px; color: #e2edf6; line-height: 1.55; }
.curator-next-work button { width: 100%; min-height: 58px; background: #fff; color: #123e68; box-shadow: none; font-size: 18px; }
.curator-progress-card,
.curator-task-section,
.curator-help-card {
  margin-top: 18px;
  padding: 22px;
  border: 1px solid #dde5ec;
  border-radius: 20px;
  background: #fff;
}
.curator-progress-heading h2 { margin: 6px 0 0; color: #173f66; font-size: 27px; }
#curatorAchievementRate { color: #173f66; font-size: 28px; }
.curator-progress-track { height: 15px; margin: 18px 0 12px; overflow: hidden; border-radius: 99px; background: #e3eaf0; }
#curatorProgressFill { width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #1b5b88, #2f9271); transition: width .25s ease; }
#curatorProgressSentence { color: #526577; line-height: 1.5; }
.curator-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 18px; }
.curator-stat-grid article { display: grid; min-height: 88px; place-items: center; padding: 12px 8px; border-radius: 14px; background: #f4f7fa; text-align: center; }
.curator-stat-grid strong { color: #173f66; font-size: 25px; }
.curator-stat-grid span { color: #637383; font-size: 13px; font-weight: 800; }
.curator-section-heading h2 { margin: 5px 0 0; color: #173f66; }
.curator-section-heading > span { color: #70808f; font-size: 12px; text-align: right; }
.curator-task-list { display: grid; gap: 10px; margin-top: 18px; }
.curator-task-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 70px; padding: 13px 14px; border-left: 5px solid #8aa0b3; border-radius: 12px; background: #f7f9fb; }
.curator-task-item.is-in_progress { border-left-color: #246a99; }
.curator-task-item.is-completed { border-left-color: #28805a; }
.curator-task-item.is-blocked { border-left-color: #b42318; }
.curator-task-item > div { display: grid; gap: 5px; }
.curator-task-item strong { color: #243b50; }
.curator-task-item span { color: #6b7986; font-size: 13px; }
.curator-task-status { flex: 0 0 auto; padding: 6px 9px; border-radius: 99px; background: #e7edf2; color: #3d5367 !important; font-weight: 800; }
.curator-task-blocked-reason { color: #b42318 !important; font-weight: 700; }
.curator-empty { margin: 0; padding: 24px; border-radius: 12px; background: #f6f8fa; color: #647482; text-align: center; }
.curator-help-card { border-color: #e6d7a7; background: #fffaf0; }
.curator-help-card strong { color: #684f12; }
.curator-help-card p { margin: 7px 0 0; color: #6f6242; line-height: 1.55; }

@media (max-width: 640px) {
  .curator-dashboard { padding: 18px 14px 80px; }
  .curator-welcome { align-items: flex-start; }
  .curator-welcome button { min-width: 96px; padding-inline: 10px; }
  .curator-next-work,
  .curator-progress-card,
  .curator-task-section,
  .curator-help-card { padding: 18px; border-radius: 17px; }
  .curator-next-work h2 { font-size: 26px; }
  .curator-stat-grid { grid-template-columns: repeat(2, 1fr); }
  .curator-section-heading { align-items: flex-start; }
}

@media (min-width: 700px) and (max-width: 1100px) {
  .curator-dashboard { padding: 32px 28px 90px; }
  .curator-stat-grid { gap: 14px; }
  .curator-task-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* FE-AUTH-REG-01: account application and recovery pages */
.auth-secondary-actions {
  display: grid;
  grid-template-columns: 1fr 1.45fr;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e7ebef;
}
.auth-card .auth-link-button,
.auth-card .auth-back-button {
  width: 100%;
  min-height: 46px;
  margin: 0;
  box-shadow: none;
}
.auth-card .auth-link-button {
  border: 1px solid #cdd9e3;
  background: #f4f7fa;
  color: #173f66;
  font-size: 14px;
}
.auth-card .auth-back-button {
  width: auto;
  min-height: 40px;
  margin-bottom: 18px;
  padding: 7px 10px;
  background: transparent;
  color: #365a78;
  font-size: 14px;
}
.account-request-page .auth-panel { width: min(100%, 560px); }
.account-request-page .auth-card h1 { margin: 5px 0 0; }
.account-request-form select { min-height: 52px; background: #fff; }
.auth-consent {
  display: flex !important;
  min-height: 48px;
  align-items: flex-start;
  gap: 10px;
  margin-top: 16px !important;
  padding: 12px;
  border-radius: 10px;
  background: #f6f8fa;
  font-size: 14px;
  line-height: 1.45;
}
.auth-consent input {
  flex: 0 0 22px;
  width: 22px !important;
  height: 22px;
  margin: 0;
}
.account-request-message {
  min-height: 24px;
  margin-top: 14px;
  padding: 0;
  border-radius: 11px;
  line-height: 1.55;
  font-weight: 700;
}
.account-request-message[data-kind="success"] { padding: 14px; background: #edf9f2; color: #17633e; }
.account-request-message[data-kind="error"] { padding: 14px; background: #fff0ef; color: #9d261e; }

@media (max-width: 640px) {
  .auth-secondary-actions { grid-template-columns: 1fr; }
  .account-request-page { align-items: start; overflow-y: auto; }
  .account-request-page .auth-brand { margin-bottom: 6px; }
  .account-request-page .auth-card { padding: 20px 18px; }
}

/* FE-UX-09: one-screen curator sector command board */
/* 2026-08-20 지시서(큐레이터 클릭막힘 1순위): .curator-sector-detail
   .curator-sector-active의 위쪽 padding을 20px(모바일 12px)에서
   role-cockpit.css의 .role-cockpit-detail-target과 같은
   clamp(56px,7vh,76px)로 맞췄다. #roleCockpitDetailClose("← 한 화면
   관제로")가 항상 화면 상단(대략 y10~56)에 떠 있는 상태로만 이 패널이
   열리는데(sample-role-experience.js/role-cockpit.js의 activateDetail
   경유), 예전 20px 여백으로는 패널 자신의 "← 오늘 할 일로" 되돌아가기
   버튼(.curator-sector-close, sticky top:0)이 바로 그 자리에서 시작해
   완전히 겹쳤다(실측: Playwright document.elementFromPoint로 그 밴드
   전체가 #roleCockpitDetailClose로 찍힘, 아래 되돌아가기 버튼은 전혀
   눌리지 않음). 패널 내용을 그 아래로 내려서 겹침을 없앤다 -- z-index나
   pointer-events로 임시 처리하지 않는다. */
.curator-sector-board{margin-top:18px;padding:20px;border:1px solid #dce3ed;border-radius:20px;background:#f7fafc}.curator-sector-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}.curator-sector-heading p{margin:0;color:#0b4e83;font-weight:850}.curator-sector-heading h2{margin:3px 0 0;color:#173f66}.curator-sector-heading>span{color:#657287;font-size:.9rem}.curator-sector-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.curator-sector-card{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"icon copy count" "action action action";align-items:center;gap:8px;min-width:0;min-height:138px;padding:14px;border:1px solid #d8e1e9;border-radius:16px;background:#fff;color:#243b50;text-align:left;box-shadow:0 5px 14px rgba(23,63,102,.06)}.curator-sector-card:hover{border-color:#77a9cb;transform:translateY(-1px)}.curator-sector-card:focus-visible{outline:3px solid #91c6e8;outline-offset:2px}.curator-sector-icon{grid-area:icon;display:grid;width:34px;height:34px;place-items:center;border-radius:11px;background:#e8f2f8;color:#0b4e83;font-size:1.15rem;font-weight:900}.curator-sector-copy{grid-area:copy;display:grid;min-width:0;gap:3px}.curator-sector-copy strong{font-size:1rem}.curator-sector-copy small{overflow:hidden;color:#657287;text-overflow:ellipsis;white-space:nowrap}.curator-sector-count{grid-area:count;color:#0b4e83;font-size:1.7rem;font-weight:900}.curator-sector-action{grid-area:action;padding-top:9px;border-top:1px solid #e6ebf0;color:#0b4e83;font-size:.88rem;font-weight:850}.curator-sector-card.needs-attention{border-color:#efb9bf;background:#fff7f7}.curator-sector-card.needs-attention .curator-sector-count,.curator-sector-card.needs-attention .curator-sector-action{color:#a2202b}.curator-sector-board-ready>.curator-next-work,.curator-sector-board-ready>.curator-progress-card,.curator-sector-board-ready>.curator-task-section,.curator-sector-board-ready>.curator-help-card,.curator-sector-board-ready>#curatorOutreachPanel,.curator-sector-board-ready>#fieldVisitPanel,.curator-sector-board-ready>#fieldCorrectionPanel,.curator-sector-board-ready>#curatorHandoffPanel,.curator-sector-board-ready>#supportDenialNoticePanel,.curator-sector-board-ready>#curatorStatusBoardPanel{display:none!important}.curator-sector-detail.curator-sector-active{display:block!important;position:fixed;inset:0;z-index:1000;margin:0!important;padding:clamp(56px,7vh,76px) max(20px,calc((100vw - 980px)/2)) max(24px,env(safe-area-inset-bottom))!important;overflow-y:auto;border:0!important;border-radius:0!important;background:#f7fafc!important}#curatorOutreachPanel.curator-sector-active,#fieldVisitPanel.curator-sector-active,#fieldCorrectionPanel.curator-sector-active,#curatorHandoffPanel.curator-sector-active,#supportDenialNoticePanel.curator-sector-active,#curatorStatusBoardPanel.curator-sector-active{display:block!important}.curator-sector-close{position:sticky;top:0;z-index:5;width:auto;min-height:46px;margin:0 0 16px;padding:0 16px;border:1px solid #b9c8d6;border-radius:999px;background:#fff;color:#173f66;box-shadow:0 4px 12px rgba(23,63,102,.12)}.curator-sector-bridge{display:block;width:auto;min-height:40px;margin:0 0 16px;padding:0 16px;border:1px solid #d8e1e9;border-radius:999px;background:#f7fafc;color:#0b4e83;font-weight:800}body.curator-sector-detail-open{overflow:hidden}.curator-dashboard.curator-sector-board-ready{max-height:calc(100dvh - 92px);overflow:hidden}.curator-dashboard.curator-sector-board-ready .curator-welcome{margin-bottom:0}
@media(max-width:900px){.curator-sector-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.curator-sector-card{min-height:126px}}
@media(max-width:640px){.curator-dashboard.curator-sector-board-ready{height:calc(100dvh - 72px);max-height:none;padding:12px 12px max(12px,env(safe-area-inset-bottom));overflow:hidden}.curator-dashboard.curator-sector-board-ready .curator-welcome h1{font-size:1.25rem}.curator-dashboard.curator-sector-board-ready .curator-welcome .curator-eyebrow,.curator-dashboard.curator-sector-board-ready .curator-date{font-size:.78rem}.curator-sector-board{height:calc(100% - 82px);margin-top:10px;padding:12px;overflow-y:auto;border-radius:16px}.curator-sector-heading{align-items:flex-start;margin-bottom:10px}.curator-sector-heading h2{font-size:1.15rem}.curator-sector-heading>span{display:none}.curator-sector-grid{grid-template-columns:1fr 1fr;gap:8px}.curator-sector-card{min-height:108px;padding:10px;border-radius:13px}.curator-sector-icon{width:29px;height:29px}.curator-sector-copy strong{font-size:.92rem}.curator-sector-copy small{font-size:.72rem}.curator-sector-count{font-size:1.4rem}.curator-sector-action{padding-top:6px;font-size:.78rem}.curator-sector-detail.curator-sector-active{padding:clamp(56px,7vh,76px) 12px max(18px,env(safe-area-inset-bottom))!important}.curator-sector-close{top:0;width:100%;margin-bottom:12px}}
@media(max-width:360px){.curator-sector-card{min-height:100px}.curator-sector-copy small{display:none}}