@charset "utf-8";

/* 아코디언 견적. 1단계 .addr-grid / .customer-info-grid 레이아웃은 건드리지 않는다. */

.gut-est-chrome {
  max-width: 1200px;
  margin: 0 auto 12px;
  padding: 0 10px;
}

.gut-est-chrome-kicker {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.5;
  color: #64748b;
}

.gut-est-stepper {
  margin: 0 0 8px;
}

.gut-est-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gut-est-step {
  position: relative;
  min-width: 0;
}

.gut-est-step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 11px;
  left: calc(50% + 14px);
  width: calc(100% - 28px);
  height: 3px;
  background: #e2e8f0;
  z-index: 0;
  pointer-events: none;
}

.gut-est-step.is-complete:not(:last-child)::after {
  background: #334155;
}

.gut-est-step-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: 0 2px 2px;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font: inherit;
  text-align: center;
  cursor: pointer;
}

.gut-est-step-btn[aria-disabled="true"] {
  cursor: not-allowed;
}

.gut-est-step-mark {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
}

.gut-est-step-box {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background: #e2e8f0;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

.gut-est-step.is-complete .gut-est-step-box {
  background: #16a34a;
  color: #fff;
  font-weight: 800;
}

.gut-est-step.is-current .gut-est-step-box {
  background: #dc2626;
  color: #fff;
  font-weight: 900;
  border-radius: 3px;
}

.gut-est-step-light {
  display: none;
  position: absolute;
  left: calc(100% + 3px);
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  border-radius: 50%;
  background: #dc2626;
  box-shadow: 0 0 0 2px #fff;
}

.gut-est-step.is-current .gut-est-step-light {
  display: block;
  animation: gut-est-light-blink 1.8s ease-in-out infinite;
}

@keyframes gut-est-light-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.22; }
}

@media (prefers-reduced-motion: reduce) {
  .gut-est-step.is-current .gut-est-step-light {
    animation: none;
    opacity: 1;
  }
}

.gut-est-step-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  min-width: 0;
  max-width: 100%;
}

.gut-est-step-name {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
  color: #64748b;
  word-break: keep-all;
}

.gut-est-step.is-current .gut-est-step-name {
  font-weight: 900;
  color: #0f172a;
}

.gut-est-step.is-complete .gut-est-step-name {
  font-weight: 700;
  color: #166534;
}

.gut-est-step.is-pending .gut-est-step-name {
  font-weight: 500;
  color: #94a3b8;
}

.gut-est-step-name-full {
  display: none;
}

.gut-est-step-name-sub {
  display: block;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  color: #94a3b8;
}

.gut-est-step-badge {
  display: none;
}

.gut-est-step-hint {
  display: none;
}

.gut-est-step-optional {
  display: block;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  color: #64748b;
}

.gut-est-step-bar {
  position: relative;
  height: 6px;
  margin: 8px 2px 0;
  overflow: visible;
  border-radius: 999px;
  background: #e2e8f0;
}

.gut-est-step-bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: #334155;
  transition: width 0.2s ease;
}

.gut-est-step-bar-marker {
  position: absolute;
  top: 50%;
  left: 0%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-radius: 2px;
  background: #dc2626;
  transform: translateY(-50%);
  box-shadow: 0 0 0 2px #fff;
  transition: left 0.2s ease;
}

.gut-after-simple {
  max-width: 1200px;
  margin: 0 auto 20px;
  padding: 8px 12px 16px;
  box-sizing: border-box;
}

.gut-after-simple-title {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.gut-after-simple-lead {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.55;
  color: #334155;
}

.gut-after-simple-actions {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.gut-est-optional-flag {
  display: inline-block;
  margin: 0 0 8px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}

.gut-est-sticky-submit {
  position: sticky;
  bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  z-index: 18;
  margin: 12px 0 0;
  padding: 10px 0 4px;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 28%);
}

.gut-est-sticky-submit .gut-est-btn {
  width: 100%;
}

#gutProgressRail {
  display: none !important;
}

.gut-basic-save-wrap,
.gut-panel-save {
  max-width: 1200px;
  margin: 0 auto 16px;
  padding: 0 10px 8px;
}

.gut-save-hint {
  margin: 0 0 8px;
  font-size: 13px;
  color: #64748b;
}

.gut-sum-card {
  max-width: 1200px;
  margin: 0 auto 12px;
  padding: 14px 16px;
  border: 1px solid #dbe5f4;
  border-radius: 16px;
  background: #fff;
  box-sizing: border-box;
}

.gut-sum-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.gut-sum-card-body {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #334155;
}

.gut-sum-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.gut-after-basic {
  max-width: 1200px;
  margin: 0 auto 20px;
  padding: 8px 12px 16px;
  box-sizing: border-box;
}

.gut-after-basic-title {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.03em;
}

.gut-after-basic-lead {
  margin: 0 0 16px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  color: #334155;
}

.gut-after-basic-actions {
  display: grid;
  gap: 10px;
}

.gut-after-basic-skip {
  width: 100%;
  margin-top: 12px;
}

.gut-path-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 120px;
  padding: 18px 16px;
  border: 1px solid #dbe5f4;
  border-radius: 16px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.gut-path-card strong {
  font-size: 18px;
  color: #0f172a;
}

.gut-path-card span {
  font-size: 14px;
  line-height: 1.5;
  color: #64748b;
}

.gut-path-card em {
  margin-top: 4px;
  font-style: normal;
  font-weight: 800;
  color: #2563eb;
}

.gut-path-card:hover,
.gut-path-card:focus {
  border-color: #2563eb;
  background: #eff6ff;
}

.gut-est-btn {
  min-height: 46px;
  padding: 0 16px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}

.gut-est-btn--ghost {
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
}

.gut-est-btn--next {
  border: 0;
  background: #2563eb;
  color: #fff;
}

.gut-est-back {
  margin: 0 0 10px;
}

.gut-est-back-btn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 4px;
  border: 0;
  background: transparent;
  color: #1e40af;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  word-break: keep-all;
}

.gut-simple-panel,
.gut-step2-panel,
.gut-est-chrome {
  width: 100%;
  max-width: 100%;
  margin: 0 auto 24px;
  padding: 16px;
  box-sizing: border-box;
  overflow-x: hidden;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.gut-s2-screen {
  margin-bottom: 22px;
}

.gut-s2-screen h3 {
  margin: 0 0 8px;
  font-size: 20px;
  font-weight: 900;
  color: #0f172a;
  word-break: keep-all;
}

.gut-s2-lead {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.5;
  color: #64748b;
  word-break: keep-all;
}

/* SPACE UI: flex-wrap. 고정 열 없음. 내용 너비, 1행 우선 후 2행만. */
.space-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.space-btn {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: auto;
  min-height: 36px;
  min-width: 0;
  padding: 4px 8px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  color: #1e293b;
  cursor: pointer;
  white-space: nowrap;
  word-break: keep-all;
  box-sizing: border-box;
}

.space-btn-icon {
  flex: 0 0 auto;
  font-size: 15px;
  line-height: 1;
}

.space-btn-label {
  flex: 0 0 auto;
  line-height: 1.2;
  white-space: nowrap;
}

.space-btn.is-on {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

@media (max-width: 359px) {
  .space-grid { gap: 3px; }
  .space-btn { padding: 4px 6px; }
}

.space-picked-line {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 30px;
  height: 32px;
  margin: 8px 0 6px;
  padding: 4px 8px;
  border: 0;
  background: transparent;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 24px;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: keep-all;
  pointer-events: none;
}

.item-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

/* #13 §4 물품 선택 그리드. .item-grid 는 대상이 아님.
   정본: 모바일 2 / 태블릿 3 / PC 4. request.php 인라인에서 열 수 재선언 금지. */
.item-select-box,
#itemSelectBox.item-select-box.gut-item-sheets,
#itemSelectBox.item-select-box {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin-top: 10px;
}

@media (min-width: 768px) {
  .item-select-box,
  #itemSelectBox.item-select-box.gut-item-sheets,
  #itemSelectBox.item-select-box {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1024px) {
  .item-select-box,
  #itemSelectBox.item-select-box.gut-item-sheets,
  #itemSelectBox.item-select-box {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

.item-cell {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
}

.item-btn {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: auto;
  min-height: 30px;
  min-width: 0;
  padding: 3px 7px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  color: #1e293b;
  cursor: pointer;
  white-space: nowrap;
  word-break: keep-all;
  box-sizing: border-box;
}

.item-btn-icon {
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1;
}

.item-btn-label {
  flex: 0 0 auto;
  min-width: 0;
  line-height: 1.2;
  text-align: left;
}

.item-btn.is-on {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.item-cell .gut-s2-mini {
  padding: 0;
  justify-content: center;
}

.item-cell .gut-s2-qty {
  margin-left: 0;
  width: auto;
  justify-content: center;
}

.item-cell .gut-s2-qty button {
  width: 28px;
  height: 28px;
}

.gut-s2-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.gut-s2-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

.gut-s2-card.is-on {
  border-color: #2563eb;
  background: #f8fbff;
}

.gut-s2-card-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 110px;
  padding: 12px 8px 10px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.gut-s2-thumb {
  font-size: 32px;
  line-height: 1;
}

.gut-s2-card-main strong {
  font-size: 14px;
  color: #0f172a;
}

.gut-s2-pick {
  font-size: 12px;
  font-weight: 800;
  color: #2563eb;
}

.gut-s2-mini {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 0 8px 10px;
}

.gut-s2-size {
  height: 32px;
  padding: 0 10px;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.gut-s2-size.is-on {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}

.gut-s2-qty {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.gut-s2-qty button {
  width: 44px;
  height: 44px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  font-weight: 800;
  cursor: pointer;
}

.gut-sm-acc {
  margin: 0 0 10px;
  border: 1px solid #dbe5f4;
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}

#gutSmSpecialAcc {
  margin-top: 10px;
}

.gut-sm-acc.is-open {
  border-color: #2563eb;
}

.gut-sm-acc.is-active .gut-sm-acc-head {
  background: #eff6ff;
}

.gut-space-progress {
  margin: 0 0 12px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #f1f5f9;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

/* 공간 칩(탐색) + 활성 공간 물품 그리드
   [P0-6] gap 을 좁혀 「칩 = 탐색, 바로 아래 = 그 공간의 물품」이
   하나의 묶음으로 보이게 합니다. 코드상 같은 컨테이너인 것과
   사용자가 같은 묶음으로 인식하는 것은 별개입니다. */
.gut-room-workspace {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.gut-room-selector {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.gut-room-chip {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 46px;
  padding: 8px 10px;
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  word-break: keep-all;
}

.gut-room-chip.is-picked {
  border-color: #93c5fd;
  background: #f8fbff;
}

.gut-room-chip.is-active {
  border-color: #2864ff;
  background: #f2f6ff;
  box-shadow: 0 0 0 1px #2864ff inset;
}

.gut-room-chip-mark {
  flex: 0 0 auto;
  color: #64748b;
  font-size: 12px;
}

.gut-room-chip.is-picked .gut-room-chip-mark,
.gut-room-chip.is-active .gut-room-chip-mark {
  color: #2563eb;
}

.gut-room-chip-icon {
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1;
}

.gut-room-chip-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gut-room-chip-count {
  flex: 0 0 auto;
  min-width: 1.2em;
  color: #2563eb;
  font-weight: 800;
  text-align: right;
}

.gut-active-room-panel {
  border: 1px solid #dbe5f4;
  border-radius: 14px;
  background: #fff;
  padding: 12px;
}

.gut-active-room-head {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  margin: 0 0 10px;
}

/* [P0-6] 1단 = 공간명 + 종수·총점 */
.gut-active-room-head-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

/* [P0-6] 2단 = 주요물품 요약. 최대 3종 + 외 */
.gut-active-room-sum {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #64748b;
  word-break: keep-all;
}

.gut-active-room-head strong {
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
}

.gut-active-room-head span {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  color: #2563eb;
  white-space: nowrap;
}

/* [글자압축 수정 2026-08-27] 고정 6열은 좁은 폭에서 수량컨트롤(−/+)이
   물품명을 밀어내 "침.." 처럼 잘렸습니다. 칸 최소폭을 보장하는 auto-fill 로 교체.
   모바일 2열 고정(#14 §2-2F)은 그대로 둡니다. */
.gut-room-item-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(172px, 1fr));
  gap: 8px;
}

.gut-room-item {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 6px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.gut-room-item.is-on {
  border-color: #93c5fd;
  background: #f8fbff;
}

.gut-room-item-main {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  cursor: pointer;
}

.gut-room-item-check {
  flex: 0 0 auto;
  font-size: 14px;
  color: #64748b;
}

.gut-room-item.is-on .gut-room-item-check {
  color: #2563eb;
}

.gut-room-item-icon {
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1;
}

.gut-room-item-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.gut-room-item-qty {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.gut-room-item-qty button {
  width: 28px;
  height: 28px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  font-weight: 800;
  cursor: pointer;
  line-height: 1;
}

.gut-room-item-qty em {
  min-width: 1.1em;
  text-align: center;
  font-style: normal;
  font-weight: 800;
  font-size: 13px;
}

/* [글자압축 수정] PC 는 마우스라 수량버튼을 줄여 물품명 폭을 확보.
   모바일(터치)은 28px 유지. */
@media (min-width: 768px) {
  .gut-room-item-qty button {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    font-size: 13px;
  }
}

/* [요청 2026-08-27] 간편체크 패널 하단 다음단계 안내 */
.gut-simple-next-guide {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #dbe5f4;
}

.gut-simple-next-guide p {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}

.gut-simple-next-guide-btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.gut-simple-next-guide-btns .gut-est-btn {
  flex: 1 1 180px;
}

.gut-active-room-nav {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

.gut-room-item-grid > .gut-space-more,
.gut-room-item-grid > .gut-space-custom {
  grid-column: 1 / -1;
}

.gut-space-more,
.gut-space-custom {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 10px 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}

@media (max-width: 1023px) {
  .gut-room-selector {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .gut-room-selector {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* #14 §2-2F: 모바일 물품 2열 고정 (긴 이름 대비) */
  .gut-room-item-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* [글자압축 수정 2026-08-27] 2열 카드(~133px)에 28px 수량버튼 2개가 들어가면
     물품명 폭이 0 이 됩니다(실측). 선택 시 수량 컨트롤을 둘째 줄로 내립니다.
     2열·28px 터치타깃은 유지. */
  .gut-room-item {
    flex-wrap: wrap;
  }

  .gut-room-item-main {
    flex: 1 1 100%;
  }

  .gut-room-item-qty {
    margin-left: auto;
  }
}

@media (max-width: 420px) {
  .gut-room-selector {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* 특수물품 아코디언(공간 칩 아래) — 유지 */
.gut-sm-acc-icon {
  flex: 0 0 auto;
  font-size: 18px;
  line-height: 1;
}

.gut-sm-acc-titles {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.gut-sm-acc-titles strong {
  font-size: 15px;
  font-weight: 800;
  color: #0f172a;
}

.gut-sm-acc-titles em {
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gut-sm-acc-meta {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  color: #2563eb;
  white-space: nowrap;
}

.gut-sm-acc-head {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 52px;
  padding: 10px 12px;
  border: 0;
  background: #f8fbff;
  text-align: left;
  cursor: pointer;
  word-break: keep-all;
}

.gut-sm-acc-check {
  flex: 0 0 auto;
  color: #2563eb;
  font-weight: 900;
}

.gut-sm-acc-head strong {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 16px;
  color: #0f172a;
}

.gut-sm-acc-chevron {
  flex: 0 0 auto;
  margin-left: auto;
  min-width: 1.1em;
  font-size: 18px;
  font-weight: 900;
  color: #64748b;
  text-align: center;
}

.gut-sm-acc-body {
  display: none;
  padding: 10px;
  border-top: 1px solid #e2e8f0;
}

/* 단일 OPEN: is-open 인 공간만 본문을 연다. 열기 ≠ 물품 선택. */
.gut-sm-acc.is-open .gut-sm-acc-body {
  display: block;
}

.gut-sm-stack {
  margin: 0 0 18px;
}

.gut-sm-stack h4 {
  margin: 0 0 8px;
  font-size: 16px;
}

.gut-s2-living {
  display: grid;
  gap: 10px;
}

.gut-s2-live {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 56px;
  padding: 12px 14px;
  border: 1px solid #dbe5f4;
  border-radius: 14px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.gut-s2-live strong { font-size: 16px; }
.gut-s2-live span { color: #64748b; font-size: 13px; }
.gut-s2-live.is-on { border-color: #2563eb; background: #eff6ff; }

/* 생활짐·특수물품 공통 칩. space-grid 는 유지. */
.household-size-options {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 4px;
  width: 100%;
}

.household-size-chip {
  display: inline-flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 0;
  min-height: 34px;
  padding: 4px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  box-sizing: border-box;
}

.household-size-chip.is-on {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.household-size-check {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.household-size-label {
  min-width: 0;
  white-space: nowrap;
}

.household-size-options--special {
  flex-wrap: wrap;
  align-items: center;
}

.household-size-options--special .household-size-chip {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 3px 7px;
  font-size: 12px;
}

.gut-s2-special {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.gut-s2-ask-title {
  margin: 0;
  grid-column: 1 / -1;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
}

@media (max-width: 767px) {
  .household-size-options--single {
    flex-wrap: wrap;
  }
  .household-size-options--single .household-size-chip {
    flex: 1 1 calc(50% - 4px);
  }
}

.gut-s2-ask {
  display: grid;
  gap: 8px;
  padding: 8px 10px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.gut-s2-ask label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: #475569;
}

.gut-s2-ask input,
.gut-s2-ask select {
  height: 40px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 0 10px;
}

.gut-s2-summary {
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
  border: 1px solid #dbe5f4;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}

.gut-s2-summary li {
  display: flex;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid #f1f5f9;
  font-size: 15px;
}

.gut-s2-summary li:last-child { border-bottom: 0; }

.gut-final-summary {
  max-width: 1200px;
  margin: 24px auto 32px;
  padding: 16px 12px;
  box-sizing: border-box;
}

.gut-final-edit {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.gut-est-rail {
  display: none;
}

.gut-s1-stage,
.gut-s1-label {
  display: none;
}

.gut-est-mobile-bar {
  display: none;
}

.step-actions {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 12px -16px 0;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid #e2e8f0;
  box-sizing: border-box;
}

.step-actions .gut-est-btn {
  min-height: 44px;
  word-break: keep-all;
}

.gut-est-toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 80;
  transform: translateX(-50%);
  padding: 12px 18px;
  border-radius: 999px;
  background: #166534;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.18);
}

.gut-step3-note {
  margin: 8px 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fff7ed;
  color: #9a3412;
  font-size: 13px;
  font-weight: 700;
}

.gut-step3-inherit {
  margin: 8px 0 16px;
  padding: 14px 16px;
  border-radius: 12px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #065f46;
}

.gut-step3-inherit-title {
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.4;
}

.gut-step3-inherit-lead {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
  color: #047857;
}

.gut-step3-inherit-count {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 800;
}

.gut-step3-inherit-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gut-step3-inherit-chip {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 6px 12px;
  border: 1px solid #6ee7b7;
  border-radius: 999px;
  background: #fff;
  color: #065f46;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
}

.gut-step3-inherit-chip:hover,
.gut-step3-inherit-chip:focus {
  background: #d1fae5;
  outline: none;
}

/* 장면: 기본정보만 펼침 */
body.gut-est-open-basic #gutAfterBasic,
body.gut-est-open-basic #gutAfterSimple,
body.gut-est-open-basic #gutSimplePanel,
body.gut-est-open-basic #gutSimpleSummary,
body.gut-est-open-basic #gutPrecisePanel,
body.gut-est-open-basic #gutPreciseSummary,
body.gut-est-open-basic #step2,
body.gut-est-open-basic .request-extra-card,
body.gut-est-open-basic .memo-section,
body.gut-est-open-basic .classic-submit-wrap,
body.gut-est-open-basic #gutFinalSummary {
  display: none !important;
}

body:not(.gut-est-step1-saved) #gutProgressRail,
body:not(.gut-est-step1-saved) #gutMobileBar,
body:not(.gut-est-step1-saved) #gutBasicSummary {
  display: none !important;
}

/* 저장 후 접힌 기본정보 — DOM은 유지 */
body.gut-est-step1-saved:not(.gut-est-open-basic) .classic-request > form > .classic-section:first-of-type,
body.gut-est-step1-saved:not(.gut-est-open-basic) .classic-request > form > .addr-grid,
body.gut-est-step1-saved:not(.gut-est-open-basic) #gutBasicSaveWrap {
  display: none !important;
}

body.gut-est-open-none #gutSimplePanel,
body.gut-est-open-none #gutAfterSimple,
body.gut-est-open-none #gutPrecisePanel,
body.gut-est-open-none #step2,
body.gut-est-open-none .classic-submit-wrap {
  display: none !important;
}

body.gut-est-open-none #gutAfterBasic {
  display: block;
}

body.gut-est-open-choice #gutAfterBasic,
body.gut-est-open-choice #gutSimplePanel,
body.gut-est-open-choice #gutPrecisePanel,
body.gut-est-open-choice #step2,
body.gut-est-open-choice .classic-submit-wrap,
body.gut-est-open-choice .classic-request > form > .classic-section:first-of-type,
body.gut-est-open-choice .classic-request > form > .addr-grid,
body.gut-est-open-choice #gutBasicSaveWrap {
  display: none !important;
}

body.gut-est-open-choice #gutAfterSimple {
  display: block !important;
}

body.gut-est-open-confirm #gutAfterBasic,
body.gut-est-open-confirm #gutAfterSimple,
body.gut-est-open-confirm #gutSimplePanel,
body.gut-est-open-confirm #gutPrecisePanel,
body.gut-est-open-confirm #step2,
body.gut-est-open-confirm .classic-submit-wrap,
body.gut-est-open-confirm .classic-request > form > .classic-section:first-of-type,
body.gut-est-open-confirm .classic-request > form > .addr-grid,
body.gut-est-open-confirm #gutBasicSaveWrap,
body.gut-est-open-confirm .gut-s1-stage,
body.gut-est-open-confirm .gut-s1-label {
  display: none !important;
}

body.gut-est-open-confirm #gutFinalSummary {
  display: block !important;
}

body.gut-est-open-simple #gutAfterBasic,
body.gut-est-open-simple #gutAfterSimple,
body.gut-est-open-simple #gutPrecisePanel,
body.gut-est-open-simple #step2,
body.gut-est-open-simple .classic-submit-wrap {
  display: none !important;
}

body.gut-est-open-simple #gutSimplePanel {
  display: block !important;
}

/* 상세 펼침: 간편은 숨기지 않고 요약 카드로 남김 */
body.gut-est-open-detail #gutAfterBasic,
body.gut-est-open-detail #gutAfterSimple,
body.gut-est-open-detail #gutSimplePanel,
body.gut-est-open-detail .classic-submit-wrap {
  display: none !important;
}

body.gut-est-open-detail #gutPrecisePanel,
body.gut-est-open-detail #step2 {
  display: block !important;
}

/* 정밀견적 공간: 내용 너비 칩. 1행을 가득 채운 뒤 다음 행. 고정 열 없음. */
body.gut-est-open-detail #step2 .pick-stage-room .step2-room-tabs,
body.gut-est-open-detail #step2 .step2-room-tabs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center;
  align-content: flex-start;
  justify-content: flex-start;
  gap: 6px !important;
  width: 100% !important;
  grid-template-columns: none !important;
  grid-auto-flow: unset !important;
  grid-template-rows: none !important;
  grid-auto-columns: unset !important;
}

body.gut-est-open-detail #step2 .pick-stage-room .step2-room-tab,
body.gut-est-open-detail #step2 .step2-room-tabs .step2-room-tab {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center;
  justify-content: center !important;
  gap: 4px;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 10px !important;
  white-space: nowrap !important;
}

body.gut-est-step1-saved .request-extra-card,
body.gut-est-step1-saved .memo-section {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

.classic-request .memo-section,
.classic-request .memo-field,
.classic-request .memo-field textarea,
.classic-request textarea[name="memo_text"] {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.classic-request .memo-field textarea,
.classic-request textarea[name="memo_text"] {
  width: 100% !important;
  max-width: none !important;
  height: 80px !important;
  min-height: 70px !important;
  max-height: 90px !important;
  resize: none;
}

/* PHASE 1: 모바일 고정 하단. 사이트 퀵메뉴(56px) 위로 올린다. */
body.gut-est-open-simple #gutSimpleActions {
  display: none;
}

body.gut-est-open-simple #gutMobileBar {
  display: grid;
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  z-index: 20;
  margin: 0;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid #e2e8f0;
}

body.gut-est-open-detail #gutMobileBar {
  display: none !important;
}

body.gut-est-open-simple .gut-simple-panel,
body.gut-est-open-detail #step2,
body.gut-est-open-detail .gut-step2-panel {
  padding-bottom: 88px;
}

body.gut-est-open-detail .gut-est-sticky-submit {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  z-index: 21;
  margin: 0;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid #e2e8f0;
}

body.gut-est-open-simple .gut-est-toast,
body.gut-est-open-detail .gut-est-toast {
  bottom: calc(120px + env(safe-area-inset-bottom, 0px));
}

/* PHASE 2: 같은 DOM, CSS만 확장 */
@media (min-width: 768px) {
  .gut-est-step-name-full { display: inline; }
  .gut-est-step-name-short,
  .gut-est-step-name-sub { display: none; }
  .gut-est-step-name { font-size: 12px; }
  .space-grid { gap: 4px; }
  .gut-s2-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gut-simple-panel,
  .gut-step2-panel,
  .gut-est-chrome {
    padding: 24px;
  }
  .gut-after-basic-actions { grid-template-columns: 1fr 1fr; }
  body.gut-est-open-simple #gutSimpleActions {
    display: grid;
    position: static;
    margin: 12px 0 0;
    padding: 12px 0 0;
    border-top: 1px solid #e2e8f0;
    background: transparent;
  }
  body.gut-est-open-simple #gutMobileBar,
  body.gut-est-open-detail #gutMobileBar {
    display: none;
  }
  body.gut-est-open-simple .gut-simple-panel,
  body.gut-est-open-detail #step2,
  body.gut-est-open-detail .gut-step2-panel {
    padding-bottom: 24px;
  }
  body.gut-est-open-detail .gut-est-sticky-submit {
    position: sticky;
    left: auto;
    right: auto;
    bottom: 8px;
    margin: 12px 0 0;
    padding: 10px 0 4px;
    border-top: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 28%);
  }
}

/* PHASE 3: 같은 DOM, CSS만 확장. */
@media (min-width: 1200px) {
  .gut-simple-panel,
  .gut-step2-panel,
  .gut-est-chrome,
  .gut-after-basic,
  .gut-after-simple,
  .gut-sum-card,
  .gut-basic-save-wrap,
  .gut-panel-save,
  .gut-final-summary {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  .space-grid { gap: 3px; }
  .space-btn {
    min-height: 28px;
    padding: 2px 6px;
    font-size: 11px;
    gap: 3px;
    width: auto;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .space-btn-icon { font-size: 14px; }
  .gut-s2-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .space-picked-line {
    display: flex;
    flex-wrap: nowrap;
    min-height: 32px;
    height: 32px;
    padding: 4px 8px;
    font-size: 12px;
  }
  .classic-request .memo-section,
  .classic-request .memo-field,
  .classic-request .memo-field textarea,
  .classic-request textarea[name="memo_text"] {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
  }
  .classic-request .memo-field textarea,
  .classic-request textarea[name="memo_text"] {
    width: 100% !important;
    max-width: none !important;
    height: 80px !important;
    min-height: 70px !important;
    max-height: 90px !important;
  }
}

/* PHASE 4: PC 전용 컨트롤 센터. 모바일 DOM 유지, 1200px+ Grid만 확장. */
@media (min-width: 1200px) {
  .zim-req-container.classic-request {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    column-gap: 24px;
    align-items: start;
    max-width: 1520px;
  }

  .classic-request .zim-header {
    grid-column: 1 / -1;
    text-align: left;
    margin-bottom: 16px;
  }

  .classic-request #requestForm.move-form {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .classic-request .addr-grid {
    max-width: none;
    width: 100%;
  }

  #gutEstChrome,
  #gutBasicSaveWrap {
    display: none !important;
  }

  body.gut-est-open-none #gutAfterBasic,
  body.gut-est-open-none #gutBasicSummary {
    display: block !important;
  }

  body:not(.gut-est-open-confirm) #gutFinalSummary {
    display: none !important;
  }

  .gut-s1-stage,
  .gut-s1-label {
    display: block;
    margin: 0 0 10px;
    font-weight: 900;
    color: #0f172a;
    letter-spacing: -0.02em;
  }

  .gut-s1-stage {
    font-size: 22px;
    margin: 0 0 18px;
  }

  .gut-s1-label {
    font-size: 15px;
    color: #1e3a8a;
  }

  .classic-request .addr-grid > .addr-card:first-of-type .addr-head h3::before {
    content: "03  ";
    font-weight: 900;
    color: #1e3a8a;
  }

  .classic-request .addr-grid > .addr-card:last-of-type .addr-head h3::before {
    content: "04  ";
    font-weight: 900;
    color: #1e3a8a;
  }

  #gutProgressRail.estimate-sidebar,
  body:not(.gut-est-step1-saved) #gutProgressRail.estimate-sidebar,
  body.gut-est-open-basic #gutProgressRail.estimate-sidebar {
    display: block !important;
    grid-column: 2;
    grid-row: 2;
    position: sticky;
    top: 90px;
    align-self: start;
    z-index: 12;
    width: 100%;
    max-width: none;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    background: transparent;
  }

  .estimate-sidebar-inner {
    padding: 16px 16px 18px;
    border: 1px solid #dbe5f4;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
  }

  .est-side-kicker {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 800;
    color: #64748b;
  }

  .est-side-now {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 900;
    color: #0f172a;
  }

  .estimate-sidebar-inner .gut-est-stepper {
    margin: 0 0 14px;
  }

  .gut-est-step.is-current .gut-est-step-badge {
    display: inline-block;
    margin-top: 2px;
    padding: 1px 6px;
    border-radius: 999px;
    background: #fee2e2;
    color: #b91c1c;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.3;
  }

  .gut-est-step-hint {
    display: block;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.3;
    color: #64748b;
  }

  .est-side-bar {
    height: 6px;
    margin: 0 0 14px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
  }

  .est-side-bar span {
    display: block;
    height: 100%;
    width: 20%;
    border-radius: 999px;
    background: #2563eb;
    transition: width 0.2s ease;
  }

  .est-side-steps {
    display: grid;
    gap: 6px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
  }

  .est-side-step {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    padding: 6px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    color: #64748b;
    font-size: 13px;
    font-weight: 800;
    text-align: left;
    cursor: pointer;
  }

  .est-side-step.is-on {
    border-color: #2563eb;
    background: #eff6ff;
    color: #1e3a8a;
  }

  .est-side-step.is-saved {
    border-color: #86efac;
    background: #f0fdf4;
    color: #166534;
  }

  .est-side-step.is-locked {
    opacity: 0.5;
    cursor: not-allowed;
  }

  .est-side-mark {
    display: inline-flex;
    min-width: 1.2em;
    justify-content: center;
  }

  .est-side-todo,
  .est-side-checks,
  .est-side-mine {
    margin: 0 0 14px;
  }

  .est-side-todo h3,
  .est-side-checks h3,
  .est-side-mine h3 {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 900;
    color: #0f172a;
  }

  .est-side-todo p,
  .est-side-mine-line,
  .gut-est-rail-status {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: #334155;
  }

  .est-side-mine-line {
    margin: 6px 0;
    color: #64748b;
  }

  #gutPcChecks {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #gutPcChecks li {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    font-size: 13px;
    font-weight: 700;
    color: #64748b;
  }

  #gutPcChecks li.is-ok {
    color: #166534;
  }

  #gutPcChecks li.is-bad {
    color: #b91c1c;
  }

  .est-check-mark {
    min-width: 1.1em;
    text-align: center;
  }

  .est-side-warn {
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid #fecaca;
    border-radius: 10px;
    background: #fef2f2;
    color: #991b1b;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
  }

  .est-side-warn[hidden] {
    display: none !important;
  }

  .gut-est-rail-counts {
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }

  .gut-est-rail-counts li {
    padding: 4px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    font-size: 12px;
    font-weight: 800;
    color: #334155;
  }

  .est-side-actions {
    display: grid;
    gap: 8px;
  }

  .est-side-actions .gut-est-btn {
    width: 100%;
  }

  .gut-est-rail-volume {
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 4px;
  }

  .gut-est-rail-volume li {
    font-size: 13px;
    font-weight: 800;
    color: #0f172a;
  }

  .gut-rail-fold,
  .gut-rail-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 10px;
    padding: 6px 10px;
    border: 1px solid #dbe5f4;
    border-radius: 8px;
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
  }

  .est-side-help-wrap {
    margin: 0 0 8px;
  }

  body.gut-est-open-basic .est-side-help-wrap,
  body.gut-est-open-none .est-side-help-wrap {
    display: none;
  }

  .estimate-sidebar-inner .gut-est-steps {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .estimate-sidebar-inner .gut-est-step:not(:last-child)::after {
    display: none;
  }

  .estimate-sidebar-inner .gut-est-step-bar {
    display: none;
  }

  .estimate-sidebar-inner .gut-est-step-btn {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    text-align: left;
    min-height: 36px;
    padding: 4px 6px;
  }

  .estimate-sidebar-inner .gut-est-step-copy {
    min-width: 0;
  }

  .estimate-sidebar-inner .gut-est-step-hint,
  .estimate-sidebar-inner .gut-est-step-optional {
    display: none;
  }

  body.gut-est-open-simple .est-side-checks,
  body.gut-est-open-detail .est-side-checks,
  body.gut-est-open-choice .est-side-checks,
  body.gut-est-open-none .est-side-checks,
  body.gut-est-open-simple .est-side-mine-line,
  body.gut-est-open-detail .est-side-mine-line {
    display: none;
  }

  body.gut-est-open-detail .est-side-todo,
  body.gut-est-open-simple .est-side-todo {
    display: none;
  }

  body.gut-est-rail-help-on .est-side-todo {
    display: block;
  }

  body.gut-est-open-detail #step2 {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 16px;
    row-gap: 12px;
    align-items: start;
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  body.gut-est-open-detail #step2 > h3,
  body.gut-est-open-detail #step2 > .step-desc,
  body.gut-est-open-detail #step2 > #gutStep3Inherit,
  body.gut-est-open-detail #step2 > .step2-group-tabs,
  body.gut-est-open-detail #step2 > .pick-stage-room,
  body.gut-est-open-detail #step2 > .pick-stage-item,
  body.gut-est-open-detail #step2 > .selected-item-layout,
  body.gut-est-open-detail #step2 > .photo-panel,
  body.gut-est-open-detail #step2 > .gut-est-sticky-submit,
  body.gut-est-open-detail #gutPrecisePanel {
    grid-column: 1 / -1;
  }

  body.gut-est-open-detail #step2 > .pick-stage-room {
    position: static;
    margin: 0 !important;
    padding: 10px 12px !important;
    min-width: 0;
  }

  body.gut-est-open-detail #step2 > .pick-stage-item {
    min-width: 0;
    margin: 0 !important;
  }

  body.gut-est-open-detail #step2 .pick-stage-room .step2-room-tabs,
  body.gut-est-open-detail #step2 .step2-room-tabs {
    gap: 6px !important;
  }

  body.gut-est-open-detail #step2 .pick-stage-room .step2-room-tab,
  body.gut-est-open-detail #step2 .step2-room-tabs .step2-room-tab {
    height: 34px !important;
    padding: 0 8px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }

  body.gut-est-open-detail #step2 .selected-item-layout,
  body.gut-est-open-detail #step2 .step2-layout,
  body.gut-est-open-detail #step2 .step2-bottom {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.gut-est-open-detail #step2 .step2-right,
  body.gut-est-open-detail #step2 .cbm-panel {
    display: none !important;
  }

  body.gut-est-open-detail #step2 .photo-panel {
    min-width: 0 !important;
    width: 100% !important;
  }

  body.gut-est-open-detail #itemSelectBox {
    align-items: start;
  }

  body.gut-est-rail-folded .zim-req-container.classic-request {
    grid-template-columns: minmax(0, 1fr) 48px !important;
  }

  body.gut-est-rail-folded #gutProgressRail.estimate-sidebar {
    width: 48px;
    max-width: 48px;
    overflow: hidden;
  }

  body.gut-est-rail-folded .estimate-sidebar-inner {
    padding: 8px 4px;
    min-height: 160px;
  }

  body.gut-est-rail-folded .estimate-sidebar-inner > *:not(#gutRailFold) {
    display: none !important;
  }

  body.gut-est-rail-folded #gutRailFold {
    width: 100%;
    min-height: 88px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    padding: 12px 0;
  }
}

@media (min-width: 1200px) and (max-width: 1439px) {
  .zim-req-container.classic-request {
    grid-template-columns: minmax(0, 1fr) 260px;
    column-gap: 18px;
  }

  body.gut-est-open-detail #step2 {
    grid-template-columns: minmax(0, 1fr);
    column-gap: 12px;
  }
}

@media (min-width: 1024px) and (max-width: 1199px) {
  body.gut-est-open-simple .zim-req-container.classic-request,
  body.gut-est-open-detail .zim-req-container.classic-request {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    column-gap: 16px;
    align-items: start;
    max-width: 1520px;
  }

  body.gut-est-open-simple .classic-request #requestForm.move-form,
  body.gut-est-open-detail .classic-request #requestForm.move-form {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    width: 100%;
  }

  body.gut-est-open-simple #gutProgressRail.estimate-sidebar,
  body.gut-est-open-detail #gutProgressRail.estimate-sidebar {
    display: block !important;
    grid-column: 2;
    grid-row: 2;
    position: sticky;
    top: 90px;
    align-self: start;
    z-index: 12;
    width: 100%;
    max-width: none;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
  }

  body.gut-est-open-simple .est-side-todo,
  body.gut-est-open-detail .est-side-todo,
  body.gut-est-open-simple .est-side-checks,
  body.gut-est-open-detail .est-side-checks,
  body.gut-est-open-simple .est-side-mine-line,
  body.gut-est-open-detail .est-side-mine-line,
  body.gut-est-open-simple .gut-est-step-hint,
  body.gut-est-open-detail .gut-est-step-hint {
    display: none !important;
  }

  body.gut-est-open-detail #step2 .cbm-panel,
  body.gut-est-open-detail #step2 .step2-right {
    display: none !important;
  }

  body.gut-est-open-detail #step2 .selected-item-layout,
  body.gut-est-open-detail #step2 .step2-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: none !important;
  }

  .gut-rail-fold {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  .gut-rail-fold {
    display: none !important;
  }
}

/* 정밀견적 물품: 카드 안에서만 상세. 접힘 2→3→4열(#13 §4), 펼침은 2칸. */
body.gut-est-open-detail .gut-split-detail-head,
body.gut-est-open-detail #selectedItems {
  display: none !important;
}

body.gut-est-open-detail .item-select-box,
body.gut-est-open-detail #itemSelectBox.gut-item-sheets,
body.gut-est-open-detail #itemSelectBox {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-items: start;
  margin-top: 8px !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet.is-open {
  grid-column: span 2 !important;
}

@media (min-width: 768px) {
  body.gut-est-open-detail .item-select-box,
  body.gut-est-open-detail #itemSelectBox.gut-item-sheets,
  body.gut-est-open-detail #itemSelectBox {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-detail {
    grid-template-columns: 1fr 1fr;
  }

  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .cbm-toggle-btn,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .cbm-dim-row,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-collapse,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-extra,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-flags,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-field-wide,
  body.gut-est-open-detail #step2 .gut-item-sheet.is-open .gut-item-photo-host {
    grid-column: 1 / -1;
  }
}

@media (min-width: 1024px) {
  body.gut-est-open-detail .item-select-box,
  body.gut-est-open-detail #itemSelectBox.gut-item-sheets,
  body.gut-est-open-detail #itemSelectBox {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

body.gut-est-open-detail #itemSelectBox .gut-item-sheet,
body.gut-est-open-detail #step2 .item-card.gut-item-sheet {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: 100% !important;
  min-height: 48px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #dbe5f4 !important;
  border-radius: 12px !important;
  background: #fff !important;
  text-align: left !important;
  cursor: default !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet.is-on {
  border-color: #2563eb !important;
  background: #f8fbff !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet.is-open {
  box-shadow: 0 2px 10px rgba(37, 99, 235, 0.12);
}

body.gut-est-open-detail #step2 .gut-item-sheet.is-done {
  border-color: #86efac !important;
  background: #f0fdf4 !important;
}

.gut-item-head {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  padding: 0 8px 0 10px;
  cursor: pointer;
}

.gut-item-check {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  cursor: pointer;
}

.gut-item-name,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-item-name {
  flex: 1 1 auto;
}

.gut-item-toggle {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  margin: 0;
  accent-color: #2563eb;
}

body.gut-est-open-detail #step2 .gut-item-sheet .item-icon,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-item-icon {
  flex: 0 0 auto !important;
  font-size: 18px !important;
  margin: 0 !important;
  line-height: 1 !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet .item-name,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-item-name {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.gut-item-status {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  color: #64748b;
  white-space: nowrap;
}

.gut-item-sheet.is-on .gut-item-status { color: #1d4ed8; }
.gut-item-sheet.is-done .gut-item-status { color: #15803d; }

.gut-item-fold {
  flex: 0 0 auto;
  width: auto;
  min-width: 32px;
  height: 32px;
  padding: 0 6px;
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}

.gut-item-sheet:not(.is-on) .gut-item-fold {
  display: none;
}

.gut-item-summary {
  margin: 0;
  padding: 0 12px 10px 36px;
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  line-height: 1.35;
}

.gut-item-detail {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 10px 12px 12px;
  border-top: 1px solid #e2e8f0;
}

.gut-item-field {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  font-weight: 800;
  color: #0f172a;
}

.gut-item-field > span {
  color: #64748b;
}

body.gut-est-open-detail #step2 .gut-item-sheet .qty-control {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) 32px !important;
  gap: 4px !important;
  width: 100% !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet .qty-control button {
  width: 32px !important;
  height: 36px !important;
  min-width: 32px !important;
  padding: 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  font-size: 16px !important;
  cursor: pointer;
}

body.gut-est-open-detail #step2 .gut-item-sheet select,
body.gut-est-open-detail #step2 .gut-item-sheet .qty-select,
body.gut-est-open-detail #step2 .gut-item-sheet .size-grade {
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 8px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.gut-est-open-detail #step2 .gut-item-sheet .cbm-toggle-btn {
  width: 100% !important;
  min-height: 36px !important;
  padding: 6px 10px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: left !important;
  cursor: pointer;
}

body.gut-est-open-detail #step2 .gut-item-sheet .cbm-dim-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
}

.gut-item-collapse {
  width: 100%;
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

/* ③ 선택한 이삿짐 확인: 모바일 압축 칩 → PC 6열 */
body.gut-est-open-detail #step2 .selected-all-panel {
  margin-top: 12px !important;
  padding: 10px 10px 12px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

body.gut-est-open-detail #step2 .selected-all-head {
  gap: 8px !important;
  margin-bottom: 8px !important;
  align-items: center !important;
}

body.gut-est-open-detail #step2 .selected-all-head h4 {
  font-size: 14px !important;
  line-height: 1.2 !important;
}

body.gut-est-open-detail #step2 .selected-all-head p {
  display: none !important;
}

body.gut-est-open-detail #step2 #selectedAllTotal,
body.gut-est-open-detail #step2 .selected-all-head > strong {
  padding: 4px 8px !important;
  border-radius: 999px !important;
  background: #0f172a !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

body.gut-est-open-detail #step2 .selected-all-tools {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 96px !important;
  gap: 6px !important;
  margin: 0 0 8px !important;
}

body.gut-est-open-detail #step2 .selected-all-tools input,
body.gut-est-open-detail #step2 .selected-all-tools select {
  height: 34px !important;
  padding: 0 8px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
}

/* #12 확인 C — ③ 선택한 이삿짐 확인.
   [변경 2026-08-28 사용자 지시] PC 6열로 확정 — #12 의 「6열 폐기」 판정을 대체한다.
   ~767 1 / 768~1199 2 / ≥1200 6 */
body.gut-est-open-detail #step2 #selectedAllList.selected-all-list,
body.gut-est-open-detail #step2 #selectedAllList {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 6px !important;
}

body.gut-est-open-detail #step2 #selectedAllList .selected-item-card,
body.gut-est-open-detail #step2 #selectedAllList .gut-all-chip {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 2px !important;
  min-width: 0 !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 6px 8px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.gut-est-open-detail #step2 #selectedAllList .selected-item-card em {
  display: none !important;
}

body.gut-est-open-detail #step2 #selectedAllList .selected-item-card strong {
  display: block !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: #0f172a !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.gut-est-open-detail #step2 #selectedAllList .selected-item-card span {
  display: block !important;
  margin: 0 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #64748b !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (min-width: 768px) {
  body.gut-est-open-detail #step2 #selectedAllList.selected-all-list,
  body.gut-est-open-detail #step2 #selectedAllList {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
}

@media (min-width: 1200px) {
  body.gut-est-open-detail #step2 .selected-all-panel {
    padding: 12px !important;
  }

  body.gut-est-open-detail #step2 #selectedAllList.selected-all-list,
  body.gut-est-open-detail #step2 #selectedAllList {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  body.gut-est-open-detail #step2 #selectedAllList .selected-item-card,
  body.gut-est-open-detail #step2 #selectedAllList .gut-all-chip {
    min-height: 52px !important;
    padding: 7px 8px !important;
  }
}

/* 방별물량 요약 카드. ~767 1 / 768 2 / 1200 6. 선택목록과 같은 PC 밀도. */
body.gut-est-open-detail #step2 .room-summary-panel {
  margin-top: 12px !important;
  padding: 10px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

body.gut-est-open-detail #step2 .room-summary-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin: 0 0 8px !important;
}

body.gut-est-open-detail #step2 .room-summary-head h4 {
  margin: 0 !important;
  font-size: 14px !important;
}

body.gut-est-open-detail #step2 #roomSummaryList.room-summary-list,
body.gut-est-open-detail #step2 #roomSummaryList.room-volume-list,
body.gut-est-open-detail #step2 #roomSummaryList.gut-room-volume-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  flex-direction: unset !important;
}

@media (min-width: 768px) {
  body.gut-est-open-detail #step2 #roomSummaryList.room-summary-list,
  body.gut-est-open-detail #step2 #roomSummaryList.room-volume-list,
  body.gut-est-open-detail #step2 #roomSummaryList.gut-room-volume-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

@media (min-width: 1200px) {
  body.gut-est-open-detail #step2 #roomSummaryList.room-summary-list,
  body.gut-est-open-detail #step2 #roomSummaryList.room-volume-list,
  body.gut-est-open-detail #step2 #roomSummaryList.gut-room-volume-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
}

body.gut-est-open-detail #step2 .gut-room-vol-card,
body.gut-est-open-detail #step2 .room-summary-card.gut-room-vol-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 4px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 10px 10px 8px !important;
  border: 1px solid #dbe5f4 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden !important;
  cursor: pointer;
}

body.gut-est-open-detail #step2 .gut-room-vol-card.is-current {
  border-color: #2563eb !important;
  background: #f8fbff !important;
}

body.gut-est-open-detail #step2 .gut-room-vol-card .room-summary-title {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.gut-est-open-detail #step2 .gut-room-vol-meta {
  margin: 0 !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

body.gut-est-open-detail #step2 .gut-room-vol-open {
  align-self: flex-end;
  min-height: 28px;
  padding: 0 8px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

body.gut-est-open-detail #step2 .gut-room-vol-card.is-current .gut-room-vol-open {
  background: #dbeafe;
}

.gut-item-photo-policy {
  margin: 0 0 8px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  word-break: keep-all;
  list-style: none;
}

.gut-item-photo-policy li {
  margin: 0;
}

.gut-item-photo-park {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

body.gut-est-open-detail #step2 .photo-panel-bottom {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-top: 12px !important;
  padding: 12px !important;
  overflow: visible !important;
}

.gut-shared-photo-host:empty {
  display: none;
}

#photoPanelDetails.gut-shared-photo-panel {
  display: none;
}

body.gut-est-open-simple #photoPanelDetails.gut-shared-photo-panel,
body.gut-est-open-detail #photoPanelDetails.gut-shared-photo-panel {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 12px 0 24px !important;
  padding: 14px 12px !important;
  overflow: visible !important;
  box-sizing: border-box;
  border: 1px solid #dbe5f4;
  border-radius: 14px;
  background: #fff;
}

body.gut-est-open-simple #photoPanelDetails.gut-shared-photo-panel {
  margin-bottom: 96px !important;
}

/* #13 §7-A-7 간편체크: 접힌 상태가 기본 */
body.gut-est-open-simple #photoPanelDetails.is-collapsed #gutPhotoPanelBody {
  display: none !important;
}

body.gut-est-open-simple #gutPhotoPanelToggleWrap {
  display: block;
}

body.gut-est-open-simple #photoPanelDetails:not(.is-collapsed) #gutPhotoPanelToggleWrap {
  margin-bottom: 10px;
}

body.gut-est-open-simple #photoPanelDetails:not(.is-collapsed) .gut-photo-toggle-hint {
  display: none;
}

body.gut-est-open-detail #gutPhotoPanelToggleWrap {
  display: none !important;
}

body.gut-est-open-detail #gutPhotoPanelBody {
  display: block !important;
}

body.gut-est-open-detail #photoPanelDetails.is-collapsed {
  /* 정밀에서는 항상 펼침 */
}

#photoPanelDetails.gut-shared-photo-panel h4 {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
}

#photoPanelDetails.gut-shared-photo-panel .photo-guide {
  margin: 0 0 12px;
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}

.gut-shared-photo-toolbar {
  margin: 0 0 10px;
}

.gut-shared-photo-add {
  min-height: 40px;
  padding: 0 14px;
  border: 1px dashed #93c5fd;
  border-radius: 10px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.gut-shared-photo-add[hidden] {
  display: none !important;
}

.gut-item-extra {
  margin: 4px 0 0;
  padding: 8px;
  border: 1px solid #dbeafe;
  border-radius: 10px;
  background: #f8fbff;
}

.gut-item-extra:not([open]) {
  padding: 6px 8px;
  background: #fff;
}

.gut-item-extra > summary {
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  color: #1d4ed8;
  list-style: none;
}

.gut-item-extra > summary::-webkit-details-marker { display: none; }

.gut-item-extra > summary span {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.gut-item-extra[open] > summary {
  margin-bottom: 8px;
}

.gut-simple-photo-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

@media (min-width: 1200px) {
  .gut-simple-photo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

.gut-shared-photo-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  margin: 0;
  padding: 8px !important;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
}

.gut-shared-photo-label {
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
}

.gut-shared-photo-thumb {
  display: block;
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: 8px;
  background: #e2e8f0;
}

.gut-shared-photo-caption {
  display: grid;
  gap: 4px;
  margin: 0;
  font-size: 11px;
  font-weight: 800;
  color: #64748b;
}

.gut-shared-photo-caption input {
  width: 100%;
  min-height: 34px;
  padding: 0 8px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  box-sizing: border-box;
}

.gut-shared-photo-file-slot {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.gut-shared-photo-card .photo-remove-btn {
  min-height: 32px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fff;
  color: #b91c1c;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.gut-item-flags {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 2px 0;
}

.gut-item-flags label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
  cursor: pointer;
}

.gut-item-field-wide input,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-custom-name,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-item-note,
body.gut-est-open-detail #step2 .gut-item-sheet .gut-item-note-lite {
  width: 100%;
  min-height: 36px;
  padding: 0 8px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  box-sizing: border-box;
}

.gut-item-photo-host[hidden] {
  display: none !important;
}

.gut-photo-slots {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.gut-photo-slot {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  font-size: 11px;
  font-weight: 800;
  color: #475569;
}

.gut-photo-slot input[type="file"] {
  width: 100%;
  font-size: 11px;
}

.gut-photo-add {
  margin-top: 6px;
  min-height: 34px;
  width: 100%;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.gut-photo-split-panel {
  overflow-x: hidden;
  max-width: 100%;
}

.gut-photo-split-panel .gut-space-photo-block,
.gut-photo-split-panel .gut-special-photo-block {
  margin: 0 0 18px;
  padding: 0;
}

.room-photo-space-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

@media (min-width: 700px) {
  .room-photo-space-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .gut-special-item-card[open] {
    grid-column: span 2;
  }
}

@media (min-width: 1024px) {
  .room-photo-space-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .room-photo-space-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

.gut-space-photo-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 44px;
  height: 48px;
  padding: 8px 10px;
  border: 1px solid #dbe5f4;
  border-radius: 10px;
  background: #fff;
  box-sizing: border-box;
  cursor: pointer;
  appearance: none;
  font-family: inherit;
}

.gut-space-photo-chip.has-file {
  border-color: #86efac;
  background: #f0fdf4;
}

.gut-space-photo-chip.is-active {
  border-color: #2563eb;
  background: #eff6ff;
}

.gut-space-chip-icon {
  flex: 0 0 auto;
  font-size: 18px;
  line-height: 1;
}

.gut-space-chip-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 800;
  color: #0f172a;
  text-align: left;
}

.gut-space-chip-count {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 800;
  color: #2563eb;
}

.gut-space-photo-park {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.gut-space-photo-editor {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #dbe5f4;
  border-radius: 12px;
  background: #f8fbff;
}

.gut-space-photo-editor[hidden] {
  display: none !important;
}

.gut-space-photo-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 10px;
}

.gut-space-photo-editor-head strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 800;
  color: #0f172a;
}

.gut-space-photo-editor-head span {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 800;
  color: #2563eb;
}

.gut-space-photo-methods {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.gut-space-photo-methods button {
  flex: 1 1 140px;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #fff;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.gut-special-item-card > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 48px;
  padding: 8px 12px;
  cursor: pointer;
  list-style: none;
  font-size: 14px;
  font-weight: 800;
  color: #0f172a;
  box-sizing: border-box;
}

.gut-special-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gut-special-item-card > summary::-webkit-details-marker,
.gut-special-note-acc > summary::-webkit-details-marker {
  display: none;
}

.gut-space-dir-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.gut-space-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-height: 88px;
  padding: 10px;
  border: 1px dashed #93c5fd;
  border-radius: 10px;
  background: #f8fbff;
}

.gut-space-slot.has-file {
  border-style: solid;
  border-color: #86efac;
  background: #f0fdf4;
}

.gut-space-slot-label {
  font-size: 13px;
  font-weight: 800;
  color: #1e3a8a;
}

.gut-photo-pick-open[hidden],
.photo-remove-btn[hidden],
.gut-special-photo-add[hidden] {
  display: none !important;
}

.gut-photo-pick-open {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.gut-space-slot .photo-preview {
  width: 100%;
  height: 88px;
  object-fit: cover;
  border-radius: 8px;
  background: #e2e8f0;
}

.gut-photo-hidden-inputs {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.gut-special-item-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 0 0 10px;
}

@media (min-width: 768px) {
  .gut-special-item-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1200px) {
  .gut-special-item-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.gut-special-item-card {
  min-width: 0;
  padding: 0 0 12px;
  border: 1px solid #dbe5f4;
  border-radius: 12px;
  background: #fff;
}

.gut-special-item-card > summary .gut-special-count {
  flex: 0 0 auto;
  color: #2563eb;
  font-size: 12px;
  font-weight: 800;
}

.gut-special-item-card .gut-special-field,
.gut-special-item-card .gut-special-note-acc,
.gut-special-item-card .gut-special-photo-head,
.gut-special-item-card .gut-special-photos,
.gut-special-item-card .gut-special-toolbar {
  margin-left: 12px;
  margin-right: 12px;
}

.gut-special-note-acc {
  margin-bottom: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.gut-special-note-acc > summary {
  min-height: 40px;
  padding: 8px 10px;
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 800;
  color: #475569;
}

.gut-special-note-acc .gut-special-note {
  display: block;
  width: calc(100% - 20px);
  margin: 0 10px 10px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  box-sizing: border-box;
}

.gut-special-photo-head {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
}

.gut-special-photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}

@media (min-width: 1200px) {
  .gut-special-photos {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.gut-special-add-tile {
  min-height: 88px;
  border: 1px dashed #93c5fd;
  border-radius: 10px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.gut-special-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
}

.gut-special-field input {
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
}

.gut-special-photo-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.gut-special-photo-label {
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
}

.gut-special-photo-slot .photo-preview {
  width: 100%;
  height: 88px;
  object-fit: cover;
  border-radius: 8px;
}

.gut-special-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gut-special-item-add,
.gut-special-photo-add,
.gut-special-item-remove {
  min-height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.gut-special-item-add,
.gut-special-photo-add {
  border: 1px dashed #93c5fd;
  background: #eff6ff;
  color: #1d4ed8;
}

.gut-special-photo-add.gut-special-add-tile {
  min-height: 88px;
  margin: 0;
  padding: 0;
}

.gut-special-item-remove,
.photo-remove-btn {
  border: 1px solid #fecaca;
  background: #fff;
  color: #b91c1c;
}

.gut-space-slot .photo-remove-btn,
.gut-special-photo-slot .photo-remove-btn {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 28px;
  min-height: 28px;
  padding: 0;
  border-radius: 50%;
  font-size: 16px;
  line-height: 1;
  z-index: 1;
}

.gut-photo-source-sheet {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(15, 23, 42, 0.45);
}

.gut-photo-source-sheet[hidden] {
  display: none !important;
}

.gut-photo-source-card {
  width: min(420px, 100%);
  padding: 16px;
  border-radius: 16px 16px 0 0;
  background: #fff;
}

.gut-photo-source-card p {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 800;
  color: #0f172a;
}

.gut-photo-source-btn,
.gut-photo-source-cancel {
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 0 0 8px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}

.gut-photo-source-btn {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.gut-photo-source-cancel {
  border: 0;
  background: #f1f5f9;
  color: #475569;
}

@media (min-width: 768px) {
  .gut-photo-source-sheet {
    align-items: center;
  }

  .gut-photo-source-card {
    border-radius: 16px;
  }
}

/* ══════════════════════════════════════════════════════════════
 * [2026-09-01] 미입력 필수 항목 강조
 * ──────────────────────────────────────────────────────────────
 * 경고창만으로는 어느 칸인지 눈으로 찾기 어렵다.
 * 배경색 + 테두리로 계속 표시하고, 처음 3회만 깜박여 시선을 끈다.
 * 값을 채우면 JS 가 클래스를 떼어 즉시 사라진다.
 * 적용 주체: gut-estimate-wizard.js 의 gutMarkNeed() / gutClearNeed()
 * ══════════════════════════════════════════════════════════════ */
.gut-need,
.gut-need:focus {
  background: #fff1f2 !important;
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .18) !important;
  outline: none !important;
}

.gut-need-blink {
  animation: gutNeedBlink .55s ease-in-out 3;
}

@keyframes gutNeedBlink {
  0%, 100% { box-shadow: 0 0 0 3px rgba(239, 68, 68, .18); }
  50%      { box-shadow: 0 0 0 7px rgba(239, 68, 68, .45); }
}

/* 모션 최소화 설정 사용자는 깜박임 없이 배경색만 */
@media (prefers-reduced-motion: reduce) {
  .gut-need-blink { animation: none; }
}

/* ══════════════════════════════════════════════════════════════
 * [2026-09-01 UX 1차] 버튼 색상 3계열 정리 + 상태 스타일
 * ──────────────────────────────────────────────────────────────
 * 문제: 색이 행동의 무게를 「반대로」 가리키고 있었다.
 *   저장(#gutBasicSave)      → --next  파랑 채움  = 가장 강조
 *   접수(#gutCtaSubmitNow)   → --ghost 회색 테두리 = 가장 흐림
 * 파란 저장 버튼을 누른 고객이 「접수됐다」고 믿고 떠난다.
 *
 * 규칙 (이후 새 버튼도 이 3계열만 쓴다)
 *   --send   신청·접수 = 되돌릴 수 없음. 진한 파랑 채움 + 그림자
 *   --next   씬 이동   = 파랑 채움 (기존 유지)
 *   --keep   작성 보관 = 앰버 테두리. 파랑과 경쟁하지 않는다
 *
 * 앰버를 고른 이유: 회색(#94a3b8)은 흰 배경 대비 2.56:1 로 WCAG 미달이고,
 * 빨강은 .gut-need(미입력 오류) 전용이라 겹치면 오독된다.
 * #b45309 는 흰 배경 대비 5.02:1.
 * ══════════════════════════════════════════════════════════════ */

.gut-est-btn--keep {
  border: 1px solid #b45309;
  background: #fffbeb;
  color: #92400e;
}
.gut-est-btn--keep:hover  { background: #fef3c7; }
.gut-est-btn--keep:active { background: #fde68a; }

.gut-est-btn--send {
  border: 0;
  background: #1d4ed8;
  color: #fff;
  box-shadow: 0 6px 14px rgba(29, 78, 216, .25);
}
.gut-est-btn--send:hover  { background: #1e40af; }
.gut-est-btn--send:active { background: #1e3a8a; }

/* 상태 스타일 — 기존에 hover/focus/active 규칙이 0건이었다.
 * 가이드가 가리킨 버튼이 눌러도 반응하지 않으면 안내 전체가 신뢰를 잃는다. */
.gut-est-btn {
  transition: background-color .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.gut-est-btn:focus-visible {
  outline: 3px solid #1d4ed8;
  outline-offset: 2px;
}
.gut-est-btn--next:hover  { background: #1d4ed8; }
.gut-est-btn--next:active { background: #1e40af; }
.gut-est-btn--ghost:hover { background: #f1f5f9; border-color: #64748b; }
.gut-est-btn--ghost:active { background: #e2e8f0; }

@media (prefers-reduced-motion: reduce) {
  .gut-est-btn { transition: none; }
}

/* 저장 설명글 — 우측 패널에만 없던 것을 채운다 (본문 .gut-save-hint 와 같은 계열) */
.gut-rail-save-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: #92400e;
}

/* ══════════════════════════════════════════════════════════════
 * [2026-09-01 UX 3차] 우측 접수 박스 · 저장 묶음
 * ══════════════════════════════════════════════════════════════ */
.gut-rail-cta {
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
  padding: 10px;
  display: grid;
  gap: 6px;
}
.gut-rail-cta .gut-est-btn { width: 100%; }
.gut-rail-cta-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: #1e3a8a;
}

.gut-rail-keep { display: grid; gap: 6px; }
.gut-rail-keep .gut-est-btn { width: 100%; }

/* ★ 위험 방어 — 레일 접힘(localStorage 영구)이 신규 액션 영역을 통째로 지우는 문제.
 * body.gut-est-rail-folded .estimate-sidebar-inner > *:not(#gutRailFold){display:none!important}
 * 규칙 때문에, 한 번이라도 「요약 접기」를 눌러 본 재방문 고객에게는
 * 접수 박스와 저장 설명글이 아예 렌더링되지 않는다(개발자 화면에서는 재현 안 됨).
 * 접힘 상태에서도 액션 영역만은 살려 둔다. */
@media (min-width: 1200px) {
  body.gut-est-rail-folded .estimate-sidebar-inner > .est-side-actions {
    display: grid !important;
    gap: 6px;
    padding: 0;
  }
  /* 접힌 폭(48px)에서는 설명글을 감추고 버튼만 남긴다 */
  body.gut-est-rail-folded .est-side-actions .gut-rail-cta-hint,
  body.gut-est-rail-folded .est-side-actions .gut-rail-save-hint {
    display: none;
  }
  body.gut-est-rail-folded .est-side-actions .gut-est-btn {
    font-size: 11px;
    padding: 0 4px;
    min-height: 40px;
  }
}

/* ============================================================
   [2026-09-01 UX 4차] 스테퍼 「지금 여기」 복원 — 완료·현재 공존 규칙
   ------------------------------------------------------------
   4차부터 한 항목에 .is-complete 와 .is-current 가 동시에 붙는다.
   (「1차 저장을 끝냈지만 지금 그 화면에 서 있다」가 실제 상태이기 때문)
   기존 선언 순서상 박스 색은 우연히 current 가 이기지만, 이름 색은
   is-complete(160행) 가 is-current(155행) 보다 뒤라 초록으로 덮인다.
   순서에 기대지 않도록 공존 상태를 명시적으로 못박는다.
   원칙: 겹치면 언제나 「현재」가 이긴다 — 지금 서 있는 곳이 먼저다.
   ============================================================ */
.gut-est-step.is-complete.is-current .gut-est-step-box {
  background: #dc2626;
  color: #fff;
  font-weight: 900;
  border-radius: 3px;
}

.gut-est-step.is-complete.is-current .gut-est-step-name {
  font-weight: 900;
  color: #0f172a;
}

/* 완료한 단계에 서 있을 때는 박스 좌상단에 작은 체크를 얹어
   「끝났음」과 「지금 여기」를 한 칸에서 동시에 읽히게 한다.
   우측이 아니라 좌측인 이유: .gut-est-step-light(점멸 점)가 mark 오른쪽
   3px 지점에 붙고, 다음 칸으로 이어지는 연결선도 오른쪽으로 나간다.
   왼쪽 위 모서리만 비어 있다. */
.gut-est-step.is-complete.is-current .gut-est-step-box {
  position: relative;
}

.gut-est-step.is-complete.is-current .gut-est-step-box::after {
  content: '✓';
  position: absolute;
  left: -5px;
  top: -5px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #16a34a;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  line-height: 13px;
  text-align: center;
  box-shadow: 0 0 0 1.5px #fff;
}

/* ============================================================
   [2026-09-01 UX 5차] 모바일 하단 고정바 씬 확장 · detail 바 2칸 ·
                       최종 접수버튼 씬 제한
   ------------------------------------------------------------
   1023px 이하에는 우측 컨트롤 패널이 존재하지 않는다
   (#gutProgressRail display:none !important — 282행, .gut-est-rail — 1351행).
   그런데 하단 고정바는 simple 씬에서만 떴다(1628행). 결과적으로
   진행방식 선택(none)·간편체크 완료(choice) 화면의 모바일 사용자에게는
   화면에 붙박인 다음행동이 하나도 없었다. 아래에서 그 두 씬을 넓힌다.
   새 DOM 은 만들지 않는다 — 기존 #gutMobileBar 의 라벨만 JS 가 바꾼다.
   ============================================================ */
body.gut-est-open-none #gutMobileBar,
body.gut-est-open-choice #gutMobileBar {
  display: grid;
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  z-index: 20;
  margin: 0;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.96);
  border-top: 1px solid #e2e8f0;
}

/* 고정바가 문서 끝을 덮지 않게 바닥을 비운다.
   ── #gutAfterBasic / #gutAfterSimple 에 주면 안 된다.
   그 두 섹션 뒤에는 #gutFinalSummary 가 오고, 모바일에서는 그것도 보이기 때문에
   (js 의 hidden 조건이 confirm 이 아니어도 풀린다) 섹션에 준 여백은
   정작 가려지는 문서 끝을 보호하지 못하면서 본문 중간에 큰 빈 띠만 만든다.
   고정바는 position:fixed 이므로 보호해야 할 대상은 「문서 전체의 바닥」이다.
   퀵메뉴가 이미 body 하단 여백(gut-brand.css)을 쓰고 있으므로 같은 방식으로 넓힌다.
   56px(퀵메뉴) + 65px(하단바) + 여유 7px = 128px
   범위를 max-width:767px 로 못박는 이유: gut-brand.css 는 max-width:768px 에서
   body 에 56px(퀵메뉴 몫)를 준다. 여기서 768px 을 함께 덮어 0 으로 되돌리면
   정확히 768px 폭에서 퀵메뉴가 푸터를 가린다. 768px 은 저쪽에 맡긴다. */
@media (max-width: 767px) {
  body.gut-est-open-none,
  body.gut-est-open-choice {
    padding-bottom: calc(128px + env(safe-area-inset-bottom, 0px));
  }
}

/* 토스트가 고정바 뒤로 숨지 않도록 같이 올린다 */
body.gut-est-open-none .gut-est-toast,
body.gut-est-open-choice .gut-est-toast {
  bottom: calc(120px + env(safe-area-inset-bottom, 0px));
}

/* detail 하단바 2칸 — 왼쪽 되돌아가기, 오른쪽 접수.
   앞 씬(simple)의 같은 좌표가 1fr 1fr 이므로 비율을 달리해
   「같은 자리 = 같은 동작」이라는 엄지의 기억을 끊는다. */
.gut-est-sticky-submit--2col {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 8px;
}

.gut-est-sticky-submit--2col .gut-est-btn {
  width: 100%;
  min-height: 44px;
  word-break: keep-all;
}

/* 최종 접수 버튼은 최종확인 씬에서만.
   모바일은 #gutFinalSummary 의 hidden 조건이 confirm 이 아니어도 풀리기 때문에
   (js 「isPc() || step1===NOT_STARTED」), 파란 접수 버튼이 모든 씬 바닥에
   상시 노출돼 있었다. 요약과 수정 링크는 남기고 접수 버튼만 잠근다. */
body:not(.gut-est-open-confirm) #gutFinalSubmit {
  display: none !important;
}

@media (min-width: 768px) {
  /* PC·태블릿에는 우측 패널과 본문 버튼이 있으므로 고정바를 쓰지 않는다.
     1690행이 simple/detail 만 처리하므로 확장한 두 씬도 여기서 함께 닫는다. */
  body.gut-est-open-none #gutMobileBar,
  body.gut-est-open-choice #gutMobileBar {
    display: none;
  }
}

/* ============================================================
   [2026-09-01 UX 6차] 다음 행동 가이드 — 링 + 손모양
   ------------------------------------------------------------
   고객이 「지금 여기서 무엇을 눌러야 하는가」를 모른다는 문제의 직접 대응.
   원칙 세 가지:
     1) 대상 버튼 「자신의」 box-shadow 로 그린다. 새 DOM 도, 별도 레이어도,
        z-index 도 쓰지 않는다. 우측 레일은 sticky + overflow-y:auto 라
        띄운 레이어가 잘리고, 모바일 하단 우측은 상담 FAB(z-index 21억)에
        가려진다. 대상 자신에 그리면 z-index 싸움이 없어진다.
        단, box-shadow 도 조상의 overflow 에는 잘린다 — 레일 안쪽 여백이
        링(8px)보다 넓어야 한다. 1200px 이상은 16px 이라 충분하고,
        1024~1199px 구간은 여백이 0 이었어서 파일 끝에서 따로 채워 뒀다.
     2) 「이동」 버튼에만 붙인다. 접수(submitFinal) 버튼에는 절대 붙이지
        않는다 — 되돌릴 수 없는 행동으로 시선을 끄는 것은 오접수 유도다.
     3) 조건을 못 채운 상태에서는 켜지 않는다. 가리킨 곳을 눌렀는데
        「필수항목을 채우세요」 경고가 뜨면 안내가 아니라 함정이 된다.
   클래스 접두사가 gut-guide- 인 이유: custom.css:1848 의
   i[class*="fa-"]::before{font-family:inherit!important} 에 걸리지 않게
   클래스명에 fa- 를 넣지 않는다.
   ============================================================ */
@keyframes gutGuideRing {
  0%, 100% { box-shadow: 0 0 0 3px rgba(37, 99, 235, .22); }
  50%      { box-shadow: 0 0 0 8px rgba(37, 99, 235, .50); }
}

/* 정지 상태에서도 남는 표시. 움직임이 끝나도 「여기」는 계속 보인다 */
.gut-guide-ring {
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .22);
}

/* 0.55s × 3회 = 1.65초. 무한 반복하지 않는다.
   타이밍은 기존 gutNeedBlink 를 그대로 답습하고 색만 분리했다
   (빨강은 오류 전용이라 유도용으로 쓰면 오독된다) */
.gut-guide-ring.is-playing {
  animation: gutGuideRing .55s ease-in-out 3;
}

/* 손모양 — 버튼 텍스트 앞에 인라인으로 붙는다.
   position:absolute 를 쓰지 않는 이유: 레일의 overflow 에 잘리지 않고,
   좁은 화면에서 라벨과 겹치지 않으며, 버튼 폭 계산에 자연히 포함된다.
   ::before 이므로 paintPcSidebar 가 textContent 를 덮어써도 살아남는다.
   색은 currentColor 마스크라 파란 버튼·앰버 버튼 어디에 붙어도 맞는다. */
.gut-guide-ring::before {
  content: '';
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -3px;
  background-color: currentColor;
  pointer-events: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.2 3.2a1.7 1.7 0 0 1 3.4 0V12.4h0.7V9.6a1.6 1.6 0 0 1 3.2 0V12.8h0.7V11.4a1.6 1.6 0 0 1 3.2 0V16.6a5.4 5.4 0 0 1-5.4 5.4H13a5.2 5.2 0 0 1-4.3-2.3L5.4 14.4a1.7 1.7 0 0 1 2.7-2l2.1 2.6Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.2 3.2a1.7 1.7 0 0 1 3.4 0V12.4h0.7V9.6a1.6 1.6 0 0 1 3.2 0V12.8h0.7V11.4a1.6 1.6 0 0 1 3.2 0V16.6a5.4 5.4 0 0 1-5.4 5.4H13a5.2 5.2 0 0 1-4.3-2.3L5.4 14.4a1.7 1.7 0 0 1 2.7-2l2.1 2.6Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 마스크를 지원하지 않는 브라우저에서는 손모양 칸을 아예 만들지 않는다
   (빈 네모가 라벨 앞에 남는 것을 막는다). 링은 그대로 동작한다 */
@supports not ((-webkit-mask: none) or (mask: none)) {
  .gut-guide-ring::before { display: none; }
}

/* 가이드가 켜져 있는 동안 스테퍼의 무한 점멸을 멈춘다.
   한 화면에서 두 곳이 동시에 깜박이면 어느 쪽을 보라는 것인지 알 수 없다 */
body.gut-est-guide-on .gut-est-step.is-current .gut-est-step-light {
  animation: none;
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  /* 움직임만 끈다. 정적 링과 손모양은 남겨 「여기」 정보를 잃지 않는다 */
  .gut-guide-ring.is-playing { animation: none; }
}

/* .gut-path-card 는 버튼이 아니라 제목·설명·소요시간 3줄이 든 카드다.
   ::before 를 넣으면 그 안의 배치가 밀리므로 링만 남기고 손모양은 뺀다. */
.gut-path-card.gut-guide-ring::before {
  display: none;
}

/* 2칸 바는 360px 화면에서 좌측 칸이 133px 까지 좁아진다.
   기본 좌우 여백 16px 를 그대로 두면 「← 진행 방식 선택」(102px)이
   가용폭 101px 를 1px 넘겨 두 줄이 된다. 이 바에서만 여백을 줄인다. */
.gut-est-sticky-submit--2col .gut-est-btn {
  padding: 0 10px;
}

/* ============================================================
   [2026-09-01 UX 5·6차 보정] 검증에서 나온 세 가지
   ============================================================ */

/* ① 하단 고정바는 씬 설정이 있는 세 화면에서만 뜬다.
   지금은 JS 의 hidden 속성이 basic·confirm 에서 바를 닫고 있고
   크롬에서는 그것으로 충분하다(실측: hidden=true → display:none).
   다만 [hidden] 을 저작자 display 선언보다 약하게 다루는 브라우저에서는
   최종확인 화면 바닥에 「간편체크 완료 →」가 뜨고, 누르면 choice 로
   튕겨 나간다. CSS 로도 닫아 둔다. */
body.gut-est-open-basic #gutMobileBar,
body.gut-est-open-confirm #gutMobileBar {
  display: none !important;
}

/* ② 1024~1199px 구간의 우측 레일에는 안쪽 여백이 없다 —
   .estimate-sidebar-inner 의 padding 선언이 @media(min-width:1200px)
   블록 안에만 있기 때문이다. 이 구간의 레일은 overflow-y:auto 라
   overflow-x 도 auto 로 계산되고, box-shadow 는 조상 overflow 에
   그대로 잘린다(스크롤 영역에도 기여하지 않아 스크롤로도 볼 수 없다).
   6차 가이드 링이 8px 이므로 그보다 넉넉한 여백을 준다. */
@media (min-width: 1024px) and (max-width: 1199px) {
  body.gut-est-open-simple .estimate-sidebar-inner,
  body.gut-est-open-detail .estimate-sidebar-inner {
    padding: 14px 12px 16px;
  }
}