body.claim-page {
    margin: 0;
    background: #0a1930;
    color: #ffffff;
    font-family: var(--mobile-font-stack, "Flight Sans", "Pretendard", "Noto Sans KR", sans-serif);
    letter-spacing: -0.5px;
}

.claim-shell {
    max-width: 768px;
    margin: 0 auto;
    min-height: 100vh;
    padding: 0 0 48px;
}

body.claim-page--step1 {
    /* PSD 콘텐츠 하단 1462px + 하단 여백 */
    --claim-step1-height: 1502px;
}

/* 2페이지: 긴 PSD 절대 y → top: calc(Npx - var(--claim-page2-origin-y)) */
body.claim-page--detail {
    --claim-page2-origin-y: 1925px;
    --claim-page2-height: 1150px;
}

body.claim-page--detail .mobile-logo-link-draft {
    left: calc(var(--chrome-canvas-offset-x) + 41px * var(--mobile-psd-scale, 1));
    width: calc(129px * var(--mobile-psd-scale, 1));
    height: calc(52px * var(--mobile-psd-scale, 1));
}

body.claim-page--detail .mobile-submenu-button-draft {
    left: calc(var(--chrome-canvas-offset-x) + 673px * var(--mobile-psd-scale, 1));
    width: calc(53px * var(--mobile-psd-scale, 1));
    height: calc(24px * var(--mobile-psd-scale, 1));
}

body.claim-page--detail .claim-shell {
    min-height: 0;
    padding-bottom: 0;
}

body.claim-page--detail .claim-top-viewport--detail {
    height: calc(var(--claim-page2-height) * var(--mobile-psd-scale, 1));
    min-height: calc(var(--claim-page2-height) * var(--mobile-psd-scale, 1));
}

body.claim-page--detail .claim-top-canvas--detail {
    height: var(--claim-page2-height);
    min-height: var(--claim-page2-height);
}

body.claim-page--detail .claim-site-chrome .mobile-submenu-panel-draft {
    min-height: var(--claim-page2-height);
    height: var(--claim-page2-height);
}

.claim-page--detail .claim-psd-y {
    position: absolute;
    /* --claim-psd-y: 긴 PSD 절대 y (단위 없는 숫자, 예: 2115) */
    top: calc(var(--claim-psd-y, 0) * 1px - var(--claim-page2-origin-y));
}

body.claim-page--detail .claim-hero-copy.claim-psd-y {
    top: calc(var(--claim-psd-y, 0) * 1px - var(--claim-page2-origin-y));
}

body.claim-page--step1 .claim-shell {
    min-height: 0;
    padding-bottom: 0;
}

/* 상단: 로고·카피·메뉴 ? PSD 좌표는 페이지 최상단(768 캔버스) 기준 */
.claim-site-chrome {
    display: block;
    width: 100%;
    position: relative;
    z-index: 100;
}

.claim-top-viewport {
    position: relative;
    width: 100%;
    min-height: calc(var(--claim-step1-height, 1462px) * var(--mobile-psd-scale, 1));
    overflow: visible;
}

body.claim-page--step1 .claim-top-viewport {
    height: calc(var(--claim-step1-height) * var(--mobile-psd-scale, 1));
    min-height: calc(var(--claim-step1-height) * var(--mobile-psd-scale, 1));
}

.claim-site-chrome .claim-top-canvas {
    position: absolute;
    left: 0;
    top: 0;
    width: 768px;
    min-height: var(--claim-step1-height, 1462px);
    transform-origin: 0 0;
    transform: scale(var(--mobile-psd-scale, 1));
}

body.claim-page--step1 .claim-site-chrome .claim-top-canvas {
    height: var(--claim-step1-height);
    min-height: var(--claim-step1-height);
}

.claim-site-chrome.is-submenu-open {
    z-index: 1000;
}

body.claim-page--step1 .claim-site-chrome .mobile-submenu-panel-draft {
    min-height: var(--claim-step1-height);
    height: var(--claim-step1-height);
}

.claim-main {
    position: relative;
    z-index: 1;
    padding: 0 20px 32px;
    margin-top: -8px;
}

/* 입력 필드 공통 (689×114 pill) */
.claim-field-pill {
    position: absolute;
    left: 39px;
    width: 689px;
    --claim-pill-height: 114px;
    height: var(--claim-pill-height);
    border-radius: 29px;
    background-color: #27364d;
}

.claim-field-pill--name {
    top: 493px;
}

.claim-field-pill--birth {
    top: 639px;
}

.claim-field-pill--gender {
    top: 787px;
}

.claim-field-pill--phone {
    top: 937px;
}

.claim-field-pill-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.claim-field-pill-input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0 20px;
    border: none;
    border-radius: 29px;
    background: transparent;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: var(--claim-pill-height, 114px);
    text-transform: none;
    text-align: center;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: none;
}

.claim-field-pill-input:focus {
    outline: 2px solid #ffc716;
    outline-offset: 2px;
}

.claim-field-pill-input[data-claim-format="yyyymmdd"] {
    letter-spacing: 0.08em;
    font-variant-numeric: tabular-nums;
}

.claim-field-pill-hint {
    position: absolute;
    left: 39px;
    width: 689px;
    height: var(--claim-pill-height, 114px);
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
    transition: opacity 0.15s ease;
    z-index: 3;
}

.claim-field-pill-hint--name {
    top: 493px;
}

.claim-field-pill-hint--birth {
    top: 639px;
}

.claim-field-pill-hint--phone {
    top: 937px;
}

.claim-field-pill--privacy {
    top: 1091px;
    z-index: 2;
}

.claim-field-privacy-hit {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 29px;
    background: transparent;
    cursor: pointer;
    z-index: 3;
}

.claim-field-privacy-display {
    position: absolute;
    left: 39px;
    width: 689px;
    top: 1091px;
    height: var(--claim-pill-height, 114px);
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
    z-index: 3;
}

.claim-field-privacy-display.is-agreed {
    color: #ffc716;
}

.claim-field-pill--privacy.is-agreed {
    outline: 2px solid #ffc716;
    outline-offset: 0;
}

.claim-privacy-notice {
    position: absolute;
    left: 39px;
    width: 689px;
    top: 1224px;
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 32px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 46px;
    text-transform: uppercase;
    text-align: center;
    color: #ffffff;
    white-space: nowrap;
    word-break: keep-all;
}

.claim-privacy-notice-muted {
    color: #91a3aa;
}

.claim-submit-pill {
    position: absolute;
    left: 39px;
    top: 1348px;
    width: 689px;
    height: 114px;
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    border: none;
    border-radius: 29px;
    background-color: #facc16;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 58px;
    text-transform: uppercase;
    text-align: center;
    color: #0a1930;
    white-space: nowrap;
    cursor: pointer;
    z-index: 3;
}

.claim-submit-pill:hover {
    filter: brightness(1.05);
}

.claim-submit-pill:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.claim-submit-pill--navy {
    background-color: #27364d;
    color: #ffffff;
}

.claim-submit-pill--navy:hover {
    filter: brightness(1.08);
}

.claim-step1-error {
    position: absolute;
    left: 39px;
    top: 1288px;
    width: 689px;
    margin: 0;
    padding: 10px 14px;
    box-sizing: border-box;
    border-radius: 8px;
    background: #4a1c1c;
    color: #ffb4b4;
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    font-family: var(--mobile-font-stack, "Pretendard", "Noto Sans KR", sans-serif);
    z-index: 4;
}

.claim-step1-error[hidden] {
    display: none;
}

.claim-detail-back {
    margin: 0 0 16px;
    font-size: 14px;
}

.claim-detail-back a {
    color: #ffc716;
    text-decoration: underline;
}

.claim-detail-title {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 700;
    color: #ffffff;
}

.claim-detail-lead {
    margin: 0 0 24px;
    font-size: 14px;
    line-height: 1.5;
    color: #91a3aa;
}

.claim-detail-summary {
    margin: 0 0 28px;
    padding: 16px 20px;
    border-radius: 8px;
    background: #27364d;
}

.claim-detail-summary dt {
    margin: 12px 0 4px;
    font-size: 12px;
    color: #91a3aa;
}

.claim-detail-summary dt:first-child {
    margin-top: 0;
}

.claim-detail-summary dd {
    margin: 0;
    font-size: 16px;
    color: #ffffff;
}

.claim-field-pill--gender,
.claim-field-pill--select {
    z-index: 2;
}

.claim-field-pill--gender.is-open,
.claim-field-pill--select.is-open {
    z-index: 30;
    border-radius: 29px 29px 0 0;
}

.claim-field-gender-hit,
.claim-field-select-hit {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 29px;
    background: transparent;
    cursor: pointer;
    z-index: 3;
}

.claim-field-pill--gender.is-open .claim-field-gender-hit,
.claim-field-pill--select.is-open .claim-field-select-hit {
    border-radius: 29px 29px 0 0;
}

.claim-field-gender-display {
    position: absolute;
    left: 39px;
    width: 689px;
    top: 787px;
    height: var(--claim-pill-height, 114px);
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
    z-index: 3;
}

.claim-field-gender-arrow {
    position: absolute;
    left: 646px;
    top: 834px;
    width: 40px;
    height: 20px;
    object-fit: contain;
    pointer-events: none;
    z-index: 3;
}

.claim-field-pill--gender.is-open ~ .claim-field-gender-arrow {
    transform: rotate(180deg);
    z-index: 33;
}

/* pill이 is-open일 때 z-index 30이라 형제인 표시 텍스트(z-index 3)가 가려짐 */
.claim-field-pill--gender.is-open ~ .claim-field-gender-display {
    z-index: 32;
}

.claim-field-gender-list,
.claim-field-select-list {
    position: absolute;
    left: 0;
    top: 114px;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    border-radius: 0 0 29px 29px;
    background-color: #27364d;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    z-index: 10;
}

.claim-field-gender-list[hidden],
.claim-field-select-list[hidden] {
    display: none;
}

.claim-field-gender-option,
.claim-field-select-option {
    display: block;
    width: 100%;
    margin: 0;
    padding: 16px 24px;
    border: none;
    background: transparent;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 36px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1.2;
    text-transform: uppercase;
    text-align: center;
    color: #ffffff;
    cursor: pointer;
}

.claim-field-gender-option:hover,
.claim-field-gender-option:focus-visible,
.claim-field-select-option:hover,
.claim-field-select-option:focus-visible {
    background-color: #ffc716;
    color: #0a1930;
    outline: none;
}

.claim-field-gender-option:last-child:hover,
.claim-field-gender-option:last-child:focus-visible,
.claim-field-select-option:last-child:hover,
.claim-field-select-option:last-child:focus-visible {
    border-radius: 0 0 29px 29px;
}

.claim-field-consult-display {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
}

.claim-field-consult-arrow {
    position: absolute;
    left: 646px;
    width: 40px;
    height: 20px;
    object-fit: contain;
    pointer-events: auto;
    cursor: pointer;
    z-index: 3;
}

.claim-field-consult-wrap {
    position: absolute;
    left: 39px;
    width: 689px;
    z-index: 2;
}

.claim-field-consult-wrap.is-open {
    z-index: 30;
}

.claim-field-consult-wrap.is-open ~ .claim-field-consult-arrow {
    z-index: 31;
    transform: rotate(180deg);
}

.claim-field-consult-wrap .claim-field-pill--consult {
    position: relative;
    left: 0;
    top: 0;
}

.claim-field-consult-wrap .claim-field-select-list--consult {
    left: 0;
    top: 114px;
    width: 100%;
    z-index: 25;
    max-height: 320px;
    overflow-x: hidden;
    overflow-y: auto;
}

.claim-field-pill-label--sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.claim-field-year-wrap {
    position: absolute;
    left: 39px;
    width: 216px;
    z-index: 2;
}

.claim-field-year-wrap.is-open {
    z-index: 30;
}

.claim-field-year-wrap.is-open ~ .claim-field-year-arrow {
    z-index: 31;
    transform: rotate(180deg);
}

.claim-field-year-wrap .claim-field-pill--year {
    position: relative;
    left: 0;
    top: 0;
    width: 216px;
    height: 114px;
}

.claim-field-year-display {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 36px 0 8px;
    box-sizing: border-box;
    pointer-events: none;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 32px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
}

.claim-field-year-arrow {
    position: absolute;
    left: 205px;
    width: 40px;
    height: 20px;
    object-fit: contain;
    pointer-events: auto;
    cursor: pointer;
    z-index: 3;
}

.claim-field-year-wrap .claim-field-select-list--year {
    left: 0;
    top: 114px;
    width: 100%;
    z-index: 25;
    max-height: 280px;
    overflow-x: hidden;
    overflow-y: auto;
}

.claim-field-month-wrap {
    position: absolute;
    left: 275.5px;
    width: 216px;
    z-index: 2;
}

.claim-field-month-wrap.is-open {
    z-index: 30;
}

.claim-field-month-wrap.is-open ~ .claim-field-month-arrow {
    z-index: 31;
    transform: rotate(180deg);
}

.claim-field-month-wrap .claim-field-pill--month {
    position: relative;
    left: 0;
    top: 0;
    width: 216px;
    height: 114px;
}

.claim-field-month-display {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 36px 0 8px;
    box-sizing: border-box;
    pointer-events: none;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 36px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
}

.claim-field-month-arrow {
    position: absolute;
    left: 441.5px;
    width: 40px;
    height: 20px;
    object-fit: contain;
    pointer-events: auto;
    cursor: pointer;
    z-index: 3;
}

.claim-field-month-wrap .claim-field-select-list--month {
    left: 0;
    top: 114px;
    width: 100%;
    z-index: 25;
    max-height: 280px;
    overflow-x: hidden;
    overflow-y: auto;
}

.claim-field-day-wrap {
    position: absolute;
    left: 512px;
    width: 216px;
    z-index: 2;
}

.claim-field-day-wrap.is-open {
    z-index: 30;
}

.claim-field-day-wrap.is-open ~ .claim-field-day-arrow {
    z-index: 31;
    transform: rotate(180deg);
}

.claim-field-day-wrap .claim-field-pill--day {
    position: relative;
    left: 0;
    top: 0;
    width: 216px;
    height: 114px;
}

.claim-field-day-display {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 36px 0 8px;
    box-sizing: border-box;
    pointer-events: none;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 36px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
}

.claim-field-day-arrow {
    position: absolute;
    left: 678px;
    width: 40px;
    height: 20px;
    object-fit: contain;
    pointer-events: auto;
    cursor: pointer;
    z-index: 3;
}

.claim-field-day-wrap .claim-field-select-list--day {
    left: 0;
    top: 114px;
    width: 100%;
    z-index: 25;
    max-height: 280px;
    overflow-x: hidden;
    overflow-y: auto;
}

.claim-consult-summary {
    position: absolute;
    left: 39px;
    width: 689px;
    height: 114px;
    border-radius: 29px;
    background-color: #ffffff;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    z-index: 2;
}

.claim-consult-summary-text {
    margin: 0;
    width: 100%;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    color: #0a1930;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.claim-form--detail {
    margin: 0;
    padding: 0;
}

.claim-submit-pill--detail {
    position: absolute;
    left: 39px;
    width: 689px;
    height: 111px;
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 29px;
    background-color: #facc16;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    color: #0a1930;
    white-space: nowrap;
    cursor: pointer;
    z-index: 3;
}

.claim-submit-pill--detail:hover {
    filter: brightness(1.05);
}

.claim-submit-pill--detail:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.claim-field-select-back {
    display: block;
    width: 100%;
    margin: 0;
    padding: 14px 24px;
    border: none;
    border-bottom: 1px solid #3d5168;
    background: #1e2a3a;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 28px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1.2;
    text-transform: uppercase;
    text-align: left;
    color: #91a3aa;
    cursor: pointer;
}

.claim-field-select-back:hover,
.claim-field-select-back:focus-visible {
    color: #ffffff;
    outline: none;
}

.claim-top-canvas:has(#cust_name:focus) .claim-field-pill-hint--name,
.claim-top-canvas:has(#cust_birth:focus) .claim-field-pill-hint--birth,
.claim-top-canvas:has(#cust_phone:focus) .claim-field-pill-hint--phone,
.claim-top-canvas:has(.claim-field-pill--name.is-filled) .claim-field-pill-hint--name,
.claim-top-canvas:has(.claim-field-pill--birth.is-filled) .claim-field-pill-hint--birth,
.claim-top-canvas:has(.claim-field-pill--phone.is-filled) .claim-field-pill-hint--phone,
.claim-top-canvas:has(.claim-field-pill--gender.is-open) .claim-field-pill-hint--phone {
    opacity: 0;
}

.claim-privacy-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 0;
    box-sizing: border-box;
}

.claim-privacy-modal[hidden] {
    display: none;
}

.claim-privacy-modal-backdrop {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    border: none;
    background: rgba(10, 25, 48, 0.85);
    cursor: pointer;
}

.claim-privacy-modal-panel {
    position: relative;
    width: 100%;
    max-width: 640px;
    max-height: min(85vh, 720px);
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    background: #27364d;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
    overflow: hidden;
}

.claim-privacy-modal-title {
    margin: 0;
    padding: 20px 24px 12px;
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.5px;
}

.claim-privacy-modal-body {
    flex: 1;
    margin: 0;
    padding: 0 24px 16px;
    overflow-y: auto;
    font-size: 14px;
    line-height: 1.6;
    color: #d0dde8;
}

.claim-privacy-modal-placeholder {
    margin: 0;
    color: #91a3aa;
}

.claim-privacy-modal-actions {
    display: flex;
    gap: 12px;
    padding: 16px 24px 24px;
    border-top: 1px solid #3d5168;
}

.claim-privacy-modal-btn {
    flex: 1;
    margin: 0;
    padding: 14px 16px;
    border: none;
    border-radius: 8px;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.claim-privacy-modal-btn--cancel {
    background: #3d5168;
    color: #ffffff;
}

.claim-privacy-modal-btn--agree {
    background: #ffc716;
    color: #0a1930;
}

.claim-privacy-modal-btn:hover {
    filter: brightness(1.05);
}

body.claim-privacy-modal-open {
    overflow: hidden;
}

.claim-privacy-modal-panel--page {
    max-width: 768px;
    max-height: none;
    height: 100%;
    border-radius: 0;
    background: #0a1930;
    box-shadow: none;
    overflow: hidden;
}

.claim-privacy-modal-viewport {
    height: 100%;
    min-height: 100vh;
    min-height: 100dvh;
}

.claim-privacy-modal-canvas {
    --claim-terms-modal-height: 720px;
    height: var(--claim-terms-modal-height);
    min-height: var(--claim-terms-modal-height);
}

.claim-privacy-modal-root.claim-site-chrome .mobile-submenu-panel-draft {
    min-height: var(--claim-terms-modal-height);
    height: var(--claim-terms-modal-height);
}

.terms-modal-hero {
    top: 188px;
}

.terms-modal-intro {
    top: 382px;
}

.claim-privacy-modal-actions--pending {
    display: none;
}

#claim-privacy-modal-focus:focus {
    outline: none;
}

/* 회원가입 1단계: 개인정보 동의 없음, CTA는 동의 pill 자리 */
body.register-page.claim-page--step1 {
    --claim-step1-height: 1240px;
}

body.register-page.claim-page--step1 .claim-submit-pill--privacy-slot {
    top: 1091px;
}

body.register-page.claim-page--step1 .claim-step1-error {
    top: 1218px;
}

/* 회원가입 2단계: 아이디·비밀번호 pill (PSD y는 claim-psd-y 인라인) */
.register-page--detail .claim-field-pill--register-field.claim-psd-y,
.register-page--detail .claim-field-pill--privacy-detail.claim-psd-y,
.register-page--detail .claim-field-pill-hint--register.claim-psd-y,
.register-page--detail .claim-field-privacy-display--detail.claim-psd-y,
.register-page--detail .claim-privacy-notice--detail.claim-psd-y,
.register-page--detail .claim-step1-error--detail.claim-psd-y,
.register-page--detail .claim-submit-pill--detail.claim-psd-y {
    position: absolute;
}

.register-page--detail .claim-field-pill--register-field.claim-psd-y,
.register-page--detail .claim-field-pill--privacy-detail.claim-psd-y {
    left: 39px;
    width: 689px;
    height: 114px;
    border-radius: 29px;
    background-color: #27364d;
    z-index: 2;
}

.register-page--detail .claim-field-pill-hint--register.claim-psd-y {
    left: 39px;
    width: 689px;
    height: var(--claim-pill-height, 114px);
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
    transition: opacity 0.15s ease;
    z-index: 3;
}

.register-page--detail .claim-field-privacy-display--detail.claim-psd-y {
    left: 39px;
    width: 689px;
    height: var(--claim-pill-height, 114px);
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 40px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    color: #ffffff;
    z-index: 3;
}

.register-page--detail .claim-privacy-notice--detail.claim-psd-y {
    left: 39px;
    width: 689px;
    margin: 0;
    padding: 0 16px;
    box-sizing: border-box;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 32px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 46px;
    text-transform: uppercase;
    text-align: center;
    color: #ffffff;
    white-space: nowrap;
    word-break: keep-all;
}

.register-page--detail .claim-step1-error--detail.claim-psd-y {
    left: 39px;
    width: 689px;
    z-index: 4;
}

.claim-section--hidden {
    display: none;
}

@media (min-width: 769px) {
    .claim-top-viewport {
        min-height: var(--claim-step1-height, 1462px);
    }

    body.claim-page--step1 .claim-top-viewport {
        height: var(--claim-step1-height);
    }

    .claim-site-chrome .claim-top-canvas {
        position: relative;
        transform: none;
        margin: 0 auto;
    }

    /* index_draft .mobile-psd-root(6662px)가 claim 1단계 PC에 섞이지 않도록 */
    body.claim-page--step1 .mobile-psd-root.claim-site-chrome {
        width: 768px;
        min-height: var(--claim-step1-height);
        height: var(--claim-step1-height);
    }

    body.claim-page--step1 .claim-site-chrome .mobile-psd-canvas.claim-top-canvas {
        min-height: var(--claim-step1-height);
        height: var(--claim-step1-height);
    }

    body.claim-page--step1 .claim-site-chrome .mobile-submenu-panel-draft {
        min-height: var(--claim-step1-height);
        height: var(--claim-step1-height);
    }

    body.claim-page--step1 .claim-site-chrome .mobile-submenu-plate-draft {
        min-height: var(--claim-step1-height);
    }

    body.claim-page--detail .mobile-psd-root.claim-site-chrome {
        width: 768px;
        min-height: var(--claim-page2-height);
        height: var(--claim-page2-height);
    }

    body.claim-page--detail .claim-site-chrome .mobile-submenu-panel-draft {
        min-height: var(--claim-page2-height);
        height: var(--claim-page2-height);
    }

    body.claim-page--detail .claim-site-chrome .mobile-submenu-plate-draft {
        min-height: var(--claim-page2-height);
    }

    .claim-main {
        margin-top: 0;
    }

    body.claim-page--detail .claim-top-viewport--detail {
        height: var(--claim-page2-height);
    }

    body.claim-page--detail .claim-site-chrome .claim-top-canvas--detail {
        position: relative;
        transform: none;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    /* index_draft .mobile-psd-root(6662px) 가 claim 1단계에 섞이지 않도록 */
    body.claim-page--step1 .mobile-psd-root.claim-site-chrome {
        min-height: calc(var(--claim-step1-height) * var(--mobile-psd-scale, 1));
        height: calc(var(--claim-step1-height) * var(--mobile-psd-scale, 1));
    }

    body.claim-page--step1 .claim-top-viewport {
        height: 100%;
        min-height: 0;
    }

    body.claim-page--step1 .claim-site-chrome .mobile-psd-canvas.claim-top-canvas {
        min-height: var(--claim-step1-height);
        height: var(--claim-step1-height);
    }

    body.claim-page--step1 .claim-site-chrome .mobile-submenu-panel-draft {
        min-height: var(--claim-step1-height);
        height: var(--claim-step1-height);
    }

    body.claim-page--step1 .claim-site-chrome .mobile-submenu-plate-draft {
        min-height: var(--claim-step1-height);
    }

    body.claim-page--detail .mobile-psd-root.claim-site-chrome {
        min-height: calc(var(--claim-page2-height) * var(--mobile-psd-scale, 1));
        height: calc(var(--claim-page2-height) * var(--mobile-psd-scale, 1));
    }

    body.claim-page--detail .claim-top-viewport--detail {
        height: 100%;
        min-height: 0;
    }

    body.claim-page--detail .claim-site-chrome .claim-top-canvas--detail {
        min-height: var(--claim-page2-height);
        height: var(--claim-page2-height);
    }

    body.claim-page--detail .claim-site-chrome .mobile-submenu-panel-draft {
        min-height: var(--claim-page2-height);
        height: var(--claim-page2-height);
    }

    body.claim-page--detail .claim-site-chrome .mobile-submenu-plate-draft {
        min-height: var(--claim-page2-height);
    }

    body.claim-page--step1 .claim-site-chrome.is-submenu-open .mobile-submenu-panel-draft,
    body.claim-page--detail .claim-site-chrome.is-submenu-open .mobile-submenu-panel-draft {
        width: calc(768px * var(--mobile-psd-scale, 1));
        height: 100vh;
        min-height: 100vh;
        max-height: 100vh;
        transform: none;
        overflow: visible;
        background: transparent;
        pointer-events: none;
    }

    body.claim-page--step1 .claim-site-chrome.is-submenu-open .mobile-submenu-plate-draft,
    body.claim-page--detail .claim-site-chrome.is-submenu-open .mobile-submenu-plate-draft {
        position: absolute;
        left: auto;
        right: 0;
        width: calc(415px * var(--mobile-psd-scale, 1));
        min-height: 100vh;
        height: 100vh;
        background-color: #facc16;
        pointer-events: auto;
    }

    .claim-site-chrome .claim-top-canvas {
        position: absolute;
        transform: scale(var(--mobile-psd-scale, 1));
    }
}

.claim-hero-copy {
    position: absolute;
    left: 38px;
    top: 188px;
    margin: 0;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 65px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 1.1;
    text-transform: uppercase;
    color: #ffffff;
    word-break: keep-all;
}

.claim-hero-line {
    display: block;
    white-space: nowrap;
}

.claim-detail-highlight {
    color: #facc16;
}

/* x:38 y:382 ? index mobile-process-desc-draft 와 동일 톤 */
.claim-intro-copy {
    position: absolute;
    left: 38px;
    top: 382px;
    margin: 0;
    max-width: 692px;
    font-family: "Flight Sans", var(--mobile-font-stack);
    font-size: 32px;
    font-weight: 300;
    letter-spacing: -1px;
    line-height: 46px;
    text-transform: uppercase;
    color: #ffffff;
    word-break: keep-all;
}

.claim-intro-muted {
    color: var(--mobile-color-muted, #91a3aa);
}

.claim-intro-line {
    display: block;
}

body.claim-page--detail .claim-intro-copy.claim-psd-y {
    top: calc(var(--claim-psd-y, 0) * 1px - var(--claim-page2-origin-y));
}

.claim-auth-hint {
    margin: 0 0 24px;
    padding: 12px 16px;
    background: #27364d;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
    color: #ffffff;
}

.claim-auth-hint a {
    color: #ffc716;
    text-decoration: underline;
}

.claim-auth-hint--member {
    border-left: 4px solid #ffc716;
}

.claim-alert {
    margin: 0 0 20px;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
}

.claim-alert--error {
    background: #4a1c1c;
    color: #ffb4b4;
}

.claim-alert--success {
    background: #1c4a2e;
    color: #b4ffcf;
}

.claim-form {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.claim-section {
    margin: 0;
    padding: 0;
    border: none;
}

.claim-section-title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
}

.claim-fields {
    padding: 16px;
    background: #27364d;
    border-radius: 8px;
}

.claim-placeholder {
    margin: 0;
    font-size: 14px;
    color: #91a3aa;
    line-height: 1.5;
}

/* 필드 추가 시 참고 (claim.php HTML에서 class 사용) */
.claim-field {
    margin-bottom: 16px;
}

.claim-field:last-child {
    margin-bottom: 0;
}

.claim-label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    color: #d0dde8;
}

.claim-input,
.claim-textarea,
.claim-select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #3d5168;
    border-radius: 6px;
    background: #0a1930;
    color: #ffffff;
    font: inherit;
    font-size: 16px;
}

.claim-input:focus,
.claim-textarea:focus,
.claim-select:focus {
    outline: 2px solid #ffc716;
    outline-offset: 1px;
}

.claim-textarea {
    min-height: 100px;
    resize: vertical;
}

.claim-actions {
    padding-top: 8px;
}

.claim-submit {
    width: 100%;
    padding: 16px 24px;
    border: none;
    border-radius: 8px;
    background: #ffc716;
    color: #0a1930;
    font: inherit;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.claim-submit:hover {
    filter: brightness(1.05);
}

.claim-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (min-width: 769px) {
    body.claim-page {
        background: #0a1930;
    }

    .claim-shell {
        padding-left: 24px;
        padding-right: 24px;
    }
}
