/* L1 — 입력화면_확정안.html의 어두운 화면. 공통 틀/2·3단계는 대상 아님. */
#landing-content.mi-landing{background:#0B0F1C;padding:0!important}
#step-1-input.mi-input{--bg:#0B0F1C;--ink:#F2F1EE;--sub:#98A0B3;--faint:#5A6377;--shell:#171D2E;--hair:rgba(255,255,255,.08);--card:#141A2B;--line:#2A3250;--sel:#F2F1EE;--selt:#0B0F1C;--cta:#F2F1EE;--ctat:#0B0F1C;--glow:rgba(240,190,120,.25);--ease:cubic-bezier(.32,.72,0,1);position:relative;width:100%;max-width:none;min-height:788px;margin:0 auto;padding:0;background:var(--bg);color:var(--ink);font-family:"Pretendard","Noto Sans KR","Apple SD Gothic Neo",sans-serif;isolation:isolate;overflow:hidden;word-break:keep-all;line-height:normal}
#step-1-input.mi-input *{box-sizing:border-box}
/* L2: 공통 틀의 윗줄 60px / 본문 최소 높이 800px를 입력 영역 안에서 반영한다. */
.sk-content #step-1-input.mi-input{--mi-topbar:60px;--mi-min-height:800px}
#step-1-input.mi-input{min-height:max(var(--mi-min-height,788px),calc(100vh - var(--mi-topbar,0px)));min-height:max(var(--mi-min-height,788px),calc(100dvh - var(--mi-topbar,0px)))}
#step-1-input.mi-input [hidden]{display:none!important}
#step-1-input.mi-input button,#step-1-input.mi-input input,#step-1-input.mi-input select{font-family:inherit}
#step-1-input.mi-input button{cursor:pointer}
#step-1-input.mi-input :focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* 질문 제목은 단계 전환 시 읽기용 포커스 대상이며, 조작 요소의 포커스 표시는 유지한다. */
#step-1-input.mi-input .mi-q:focus{outline:none}
#step-1-input.mi-input .mi-stage{position:absolute;left:0;top:0;width:100%;height:auto;aspect-ratio:390 / 370;z-index:0;pointer-events:none}
#step-1-input.mi-input .mi-prog{max-width:430px;margin-left:auto;margin-right:auto;display:flex;align-items:center;gap:12px;padding:14px 20px 0;position:relative;z-index:2}
#step-1-input.mi-input .mi-back{font-size:13px;color:var(--sub);min-width:40px;background:none;border:0;padding:0;text-align:left}
#step-1-input.mi-input .mi-seg{flex:1;display:flex;gap:4px}
#step-1-input.mi-input .mi-seg i{flex:1;height:3px;border-radius:2px;background:var(--line);position:relative;overflow:hidden}
#step-1-input.mi-input .mi-seg i::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease)}
#step-1-input.mi-input .mi-seg i.on::after{transform:scaleX(1)}
#step-1-input.mi-input .mi-count{font-size:12.5px;font-weight:800;font-variant-numeric:tabular-nums}
#step-1-input.mi-input .mi-count small{color:var(--faint);font-weight:600}
#step-1-input.mi-input .mi-tag{max-width:430px;margin-left:auto;margin-right:auto;display:block;text-align:center;margin-top:10px;font-size:11.5px;font-weight:600;letter-spacing:.12em;color:var(--sub);position:relative;z-index:2}
#step-1-input.mi-input #sajuPayForm{margin:0;padding:0}
/* L3: 세로 % 여백도 부모 폼의 전체 폭 기준. 폭 × 370/390에 맞춰 390px 때의 장면 간격·겹침을 유지한다. */
#step-1-input.mi-input .mi-panel{position:relative;width:100%;max-width:430px;margin:calc(94.8717948718% - 46px) auto 0;min-height:412px;padding-bottom:112px;z-index:1;animation:mi-rise .8s var(--ease) both}
#step-1-input.mi-input .mi-panel[data-step="t"],#step-1-input.mi-input .mi-panel[data-step="dt"],#step-1-input.mi-input .mi-panel[data-step="dty"]{margin-top:calc(94.8717948718% - 178px);min-height:544px;padding-bottom:20px;background:linear-gradient(180deg,transparent,var(--bg) 26px)}
#step-1-input.mi-input .mi-panel[data-step="t"] .mi-q,#step-1-input.mi-input .mi-panel[data-step="dt"] .mi-q,#step-1-input.mi-input .mi-panel[data-step="dty"] .mi-q{padding-top:22px}
#step-1-input.mi-input .mi-panel[data-step="dt"] .mi-q,#step-1-input.mi-input .mi-panel[data-step="dty"] .mi-q{font-size:21px;padding-top:0}
#step-1-input.mi-input .mi-q{margin:0;padding:0 22px;font-size:24px;line-height:1.35;font-weight:800;letter-spacing:-.02em;text-align:center;color:var(--ink)}
#step-1-input.mi-input .mi-hint{margin:6px 0 0;padding:0 22px;font-size:13px;line-height:20px;color:var(--sub);text-align:center;min-height:20px}
#step-1-input.mi-input .mi-area{padding:16px 20px 0}
#step-1-input.mi-input .mi-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#step-1-input.mi-input .mi-choice{position:relative;margin:0;cursor:pointer}
#step-1-input.mi-input .mi-choice input{position:absolute;opacity:0;width:1px;height:1px}
#step-1-input.mi-input .mi-choice span{display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 0 18px;font-size:16px;font-weight:800;border-radius:22px;background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--hair),0 16px 30px -18px rgba(0,0,0,.8);transition:transform .35s var(--ease)}
#step-1-input.mi-input .mi-choice svg{width:36px;height:36px}
#step-1-input.mi-input .mi-choice input:checked+span{box-shadow:inset 0 0 0 1.5px var(--ink)}
#step-1-input.mi-input .mi-choice input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
#step-1-input.mi-input .mi-choice:active span{transform:scale(.97)}
#step-1-input.mi-input .mi-calendar{gap:8px;margin-bottom:10px}
#step-1-input.mi-input .mi-calendar span{padding:10px;border-radius:14px;font-size:14px}
#step-1-input.mi-input .mi-leap{margin:8px 0 10px;font-size:13px;color:var(--sub)}
#step-1-input.mi-input .mi-leap input{accent-color:var(--ink)}
#step-1-input.mi-input .mi-date{display:flex;align-items:baseline;justify-content:center;gap:6px;padding:12px 8px;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1px var(--hair);width:100%}
#step-1-input.mi-input .mi-date input,#step-1-input.mi-input .mi-date select{min-width:0;width:100%;border:0;border-radius:0;box-shadow:none;background:transparent;color:var(--ink);padding:4px;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;text-align:center}
#step-1-input.mi-input .mi-date select{flex:1;font-size:21px;color-scheme:dark}
#step-1-input.mi-input .mi-date #bYear{flex:1.4}
#step-1-input.mi-input input::placeholder{color:var(--faint);opacity:1}
#step-1-input.mi-input .mi-tease{display:table;margin:8px auto;font-size:12.5px;line-height:1.5;background:var(--shell);border-radius:999px;padding:6px 13px;text-align:center}
#step-1-input.mi-input .mi-tease:empty{display:none}
#step-1-input.mi-input .mi-tease b{color:#D0654E}
#step-1-input.mi-input .mi-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#step-1-input.mi-input .mi-time{margin-top:8px}
#step-1-input.mi-input .mi-t{display:flex;align-items:center;justify-content:space-between;gap:6px;border:0;border-radius:14px;background:var(--shell);padding:0 12px;height:50px;text-align:left;color:var(--ink)}
#step-1-input.mi-input .mi-t b{font-size:14.5px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}
#step-1-input.mi-input .mi-t b em{font-style:normal;font-size:12px;font-weight:700;color:var(--sub);margin-right:3px}
#step-1-input.mi-input .mi-t small{font-size:12px;font-weight:700;color:var(--sub);white-space:nowrap}
#step-1-input.mi-input .mi-t[aria-pressed="true"]{background:var(--sel);color:var(--selt);box-shadow:0 0 0 5px var(--glow)}
#step-1-input.mi-input .mi-t[aria-pressed="true"] small,#step-1-input.mi-input .mi-t[aria-pressed="true"] em{color:inherit;opacity:.7}
#step-1-input.mi-input .mi-unknown{display:block;width:100%;margin-top:8px;border:1.5px dashed var(--line);background:none;border-radius:14px;padding:12px;font-size:14px;font-weight:700;color:var(--sub)}
#step-1-input.mi-input .mi-unknown[aria-pressed="true"]{border-color:var(--ink);color:var(--ink)}
#step-1-input.mi-input .mi-name{display:block;border-radius:16px;padding:16px;font-size:19px;font-weight:800;box-shadow:inset 0 0 0 1.5px var(--line);margin-bottom:8px}
#step-1-input.mi-input .mi-name:focus-within{box-shadow:inset 0 0 0 2px var(--ink)}
#step-1-input.mi-input .mi-name small{display:block;font-size:11px;color:var(--sub);font-weight:600;margin-bottom:4px}
#step-1-input.mi-input .mi-name input{width:100%;border:0;box-shadow:none;outline:0;background:transparent;color:var(--ink);font-size:19px;font-weight:800;padding:0}
#step-1-input.mi-input .mi-cta{position:absolute;left:16px;right:16px;bottom:24px;z-index:3;display:flex;align-items:center;justify-content:space-between;background:var(--cta);color:var(--ctat);border:0;border-radius:999px;padding:8px 8px 8px 24px;font-size:16px;font-weight:800}
#step-1-input.mi-input .mi-cta i{width:40px;height:40px;border-radius:50%;background:rgba(128,128,128,.22);display:grid;place-items:center}
#step-1-input.mi-input .mi-free{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-size:11px;color:var(--faint);z-index:3}
#step-1-input.mi-input .mi-who{display:table;margin:0 auto 8px;font-size:12px;font-weight:800;border-radius:999px;padding:5px 12px;background:#2F4A3F;color:#fff}
#step-1-input.mi-input .mi-who[data-who="상대"]{background:#2E3F63}
#step-1-input.mi-input .mi-error{padding:0 20px;margin:10px 0;color:#FFAA96;font-size:13px;text-align:center}
#step-1-input.mi-input .mi-error:empty{display:none}
/* 기존 랜딩 전용 고정 버튼은 새 입력과 중복되므로 표시하지 않는다. */
.lt-redesign:has(#step-1-input.mi-input) .sk-sticky-cta{display:none!important}
@keyframes mi-rise{from{opacity:0;transform:translateY(14px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:360px){#step-1-input.mi-input .mi-t{padding:0 8px;gap:3px}#step-1-input.mi-input .mi-t b{font-size:12.5px}#step-1-input.mi-input .mi-t b em{font-size:10px}#step-1-input.mi-input .mi-area{padding-left:14px;padding-right:14px}}
@media(prefers-reduced-motion:reduce){#step-1-input.mi-input *,#step-1-input.mi-input *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* L12 — 기다림화면_시안.html .ld, 입력 장면 위에만 적용. */
#step-1-input.mi-input #previewLoading.ld{position:absolute;left:0;right:0;top:314px;bottom:0;z-index:3;display:none;flex-direction:column;align-items:center;padding:0 28px;background:linear-gradient(180deg,rgba(11,15,28,0) 0,var(--bg) 60px);transform:translateY(14px);transition:transform .9s var(--ease)}
#step-1-input.mi-input #previewLoading.ld.on{opacity:1;transform:none}
#step-1-input.mi-input #previewLoading.ld .lt{margin:58px 0 0;font-size:23px;font-weight:800;letter-spacing:-.02em;text-align:center}
#step-1-input.mi-input #previewLoading.ld .ls{margin:8px 0 0;font-size:13px;color:var(--sub);text-align:center}
#step-1-input.mi-input #previewLoading.ld ol{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;width:100%;max-width:300px}
#step-1-input.mi-input #previewLoading.ld li{display:flex;align-items:center;gap:12px;font-size:14.5px;color:var(--faint);transition:color .6s var(--ease)}
#step-1-input.mi-input #previewLoading.ld li i{flex-shrink:0;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;transition:all .6s var(--ease)}
#step-1-input.mi-input #previewLoading.ld li i svg{opacity:0;transition:opacity .4s}
#step-1-input.mi-input #previewLoading.ld li.now{color:var(--ink)}#step-1-input.mi-input #previewLoading.ld li.now i{border-color:rgba(240,190,120,.9);box-shadow:0 0 0 5px rgba(240,190,120,.14);animation:mi-ld-pulse 1.2s ease-in-out infinite}
#step-1-input.mi-input #previewLoading.ld li.done{color:var(--sub)}#step-1-input.mi-input #previewLoading.ld li.done i{background:var(--ink);border-color:var(--ink)}#step-1-input.mi-input #previewLoading.ld li.done i svg{opacity:1}
@keyframes mi-ld-pulse{50%{box-shadow:0 0 0 9px rgba(240,190,120,.05)}}
#step-1-input.mi-input #previewLoading.ld .bar{margin:30px 0 0;width:100%;max-width:300px;height:3px;border-radius:2px;background:var(--line);overflow:hidden}
#step-1-input.mi-input #previewLoading.ld .bar b{display:block;height:100%;width:0;background:linear-gradient(90deg,#8FA3D8,#F0BE78);border-radius:2px}
#step-1-input.mi-input #previewLoading.ld .next{margin-top:auto;margin-bottom:34px;font-size:12.5px;color:var(--faint)}
#step-1-input.mi-input #previewLoading.ld .done-msg{margin-top:22px;font-size:14px;font-weight:700;color:#F0BE78;opacity:0;transition:opacity .6s}
#step-1-input.mi-input #previewLoading.ld.fin .done-msg{opacity:1}
@media (prefers-reduced-motion:reduce){#step-1-input.mi-input #previewLoading.ld li.now i{animation:none}}


#step-1-input.mi-input #previewLoading.ld{color:var(--ink);font-family:inherit;font-weight:400;font-style:normal;letter-spacing:normal;line-height:normal;text-shadow:none}
#step-1-input.mi-input #previewLoading.ld .lt{color:var(--ink);font-family:inherit;line-height:normal}
#step-1-input.mi-input #previewLoading.ld .bar{padding:0;border:0;flex-shrink:0}
#step-1-input.mi-input #sajuPayForm,#step-1-input.mi-input .mi-prog,#step-1-input.mi-input .mi-tag{transition:opacity .6s}
#step-1-input.mi-input.mi-loading #sajuPayForm,#step-1-input.mi-input.mi-loading .mi-prog,#step-1-input.mi-input.mi-loading .mi-tag,
#step-1-input.mi-input.mi-finishing #sajuPayForm,#step-1-input.mi-input.mi-finishing .mi-prog,#step-1-input.mi-input.mi-finishing .mi-tag{opacity:0;pointer-events:none}
