@font-face {
  font-family: "Pretendard Variable";
  src: url("../assets/fonts/PretendardVariable.woff2") format("woff2");
  font-weight: 45 920;
  font-display: swap;
}

[hidden] { display: none !important; }
.review-shell :focus-visible { outline: 2px solid var(--action); outline-offset: 3px; }
.review-shell [tabindex="-1"]:focus { outline: none; }
.review-shell [tabindex="-1"] { scroll-margin-top: 80px; }
.review-shell .page-head .desc { word-break: keep-all; }
.review-nav { padding: 12px 20px 0; }
.review-nav .tabs { margin-bottom: 0; }
#review-step-fill { width: 50%; }
.review-shell[data-step="proof"] #review-step-fill { width: 100%; }

.event-choice { min-width: 0; border: 0; padding: 0; }
.event-choice legend { margin-bottom: 10px; padding: 0; font-size: 17px; font-weight: 700; }
.event-options { display: grid; gap: 8px; }
.event-options label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
}
.event-options label:has(:checked) { border-color: var(--action); background: var(--primary-soft); }
.event-options input { accent-color: var(--action); flex: none; margin: 0; }
.review-panel-title { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.review-panel-title .section-title { margin: 0; }
/* 칸 제목만 — 칸 아래 오류(.err)는 A/S 와 같은 공용 크기를 쓴다 */
.review-fields .field > span:not(.err), #lookup-form .field > span:not(.err), #content-proof .field > span:not(.err) { font-weight: 700; font-size: 14.5px; }
/* 첨부 제외 안내 — 파일 이름이 문장에 붙지 않게 줄바꿈을 살린다 */
#notice-sheet-message { white-space: pre-line; }
.review-fields select, .review-fields input { min-height: 52px; }
/* 리뷰 작성일 — A/S 접수(app/request) 구매일과 같은 date-field + 바텀시트 달력 */
.date-field{position:relative;cursor:pointer}
.date-field .input{width:100%;padding-right:44px;cursor:pointer}
.date-field-icon{position:absolute;top:50%;right:14px;transform:translateY(-50%);color:var(--ink-3);pointer-events:none}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin:14px 2px 10px}
.cal-head b{font-size:16px;letter-spacing:-.01em}
.cal-nav{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font-size:18px;color:var(--ink-2);cursor:pointer}
.cal-nav:disabled{opacity:.3;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal-dow{padding:6px 0;font-size:11.5px;color:var(--ink-3);font-weight:600}
.cal-day{height:40px;border:0;border-radius:10px;background:transparent;font-size:14px;color:var(--ink);cursor:pointer}
.cal-day:hover{background:var(--bg-alt)}
.cal-day.selected{background:var(--action);color:#fff;font-weight:700}
.cal-day.disabled{color:var(--ink-disable);cursor:default;background:transparent}
#review-product-other { display: grid; gap: 6px; }
#proof-form .file-drop { cursor: pointer; overflow-wrap: anywhere; border-color: var(--ink-4); color: var(--ink-2); font-weight: 600; }
#proof-form .file-drop:hover { border-color: var(--action); }
#proof-form .file-drop small { font-weight: 400; }
/* + 표시 — 누르면 사진을 고른다는 걸 바로 알게 */
.file-drop-plus { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0 auto 8px; border-radius: 50%; background: var(--bg-alt); color: var(--action); font-size: 22px; font-weight: 500; line-height: 1; }
/* 칸 아래 오류 — A/S 신청 화면과 같은 .err, 칸 바로 아래 붙인다 */
.review-fields .err.show { margin-top: 6px; }
.review-file { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); }
.file-drop:has(+ .review-file:focus-visible) { outline: 2px solid var(--action); outline-offset: 3px; }
.review-note { margin: 8px 0 14px; color: var(--ink-3); font-size: 13px; line-height: 1.6; word-break: keep-all; }
/* 오류 문구 — A/S 와 같은 .err(.show 일 때만 보임). 폼 단위 오류만 여백을 준다 */
.review-err { margin: 10px 0; }
.order-proof-label { margin: 18px 0 0; font-size: 14.5px; font-weight: 700; }
#order-proof-fields .review-note { margin-top: 6px; }
.proof-preview { display: block; margin-top: 10px; max-width: 100%; max-height: 160px; object-fit: contain; border: 1px solid var(--line); border-radius: 8px; }
.proof-guide h3 { margin: 0; font-size: 15px; }
.proof-guide p { margin: 8px 0; font-size: 13px; word-break: keep-all; }
.proof-guide .guide-foot { margin-bottom: 0; }
.review-specimen { margin: 10px 0 0; }
.review-specimen img { display: block; width: 100%; border-radius: 8px; }
.review-specimen figcaption { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 8px; font-size: 12px; }
.notice .review-specimen b { display: inline; margin: 0 3px 0 0; font-size: inherit; }

.consent-detail { margin: 4px 0 14px; font-size: 13px; color: var(--ink-3); line-height: 1.6; word-break: keep-all; }
.consent-detail summary { cursor: pointer; min-height: 32px; display: inline-flex; align-items: center; }
.consent-detail p { margin: 4px 0; }
.consent-detail b { color: var(--ink-2, inherit); margin-right: 4px; }
.consent-detail a { text-decoration: underline; text-underline-offset: 2px; }
#lookup-form .tabs { margin-bottom: 12px; }
#lookup-results .result-card { margin-top: 14px; }
.receipt-message { white-space: pre-wrap; overflow-wrap: anywhere; }
.receipt-steps { list-style: none; padding-left: 0; margin: 0; }
.result-card .resubmit { margin-top: 14px; }
.done-notice { margin: 14px 0; }
.btn-row.done-actions .btn { flex: 1 1 0; white-space: nowrap; }
.review-shell .result-meta { word-break: keep-all; }
#review-submit-actions .btn.secondary { flex-basis: auto; }