플레이스홀더 vs 라벨

<div class="stage">
  <div class="pane bad"><span class="mark">✕</span><span class="label">Before</span>
    <input class="finput" id="bi" readonly>
    <p class="why" id="bw"></p></div>
  <div class="pane good"><span class="mark">✓</span><span class="label">After</span>
    <span class="flabel" id="glabel"></span>
    <input class="finput" id="gi" readonly>
    <p class="why" id="gw"></p></div>
</div>

.stage{width:94%;height:88%;display:flex;gap:4%}
.pane{position:relative;flex:1;border-radius:14px;border:1px solid var(--line);background:var(--surface);padding:16px 14px 12px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.mark{position:absolute;top:10px;right:12px;font:800 16px/1 system-ui;color:var(--accent-2)}
.good .mark{color:var(--accent-3)}
.label{position:absolute;top:10px;left:12px;font:700 10px/1 monospace;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.flabel{font:700 11px/1 -apple-system,sans-serif;color:var(--fg)}
.finput{height:30px;border-radius:7px;border:1px solid var(--line);background:var(--bg);padding:0 10px;font:600 13px/1 -apple-system,sans-serif;color:var(--fg);width:100%}
.why{margin:0;font:500 11px/1.3 -apple-system,sans-serif;color:var(--muted)}

const bi = document.getElementById('bi'), gi = document.getElementById('gi');
const glabel = document.getElementById('glabel'), bw = document.getElementById('bw'), gw = document.getElementById('gw');
const L = {
  ko: { ph: '이름', val: '홍길동', bw: '입력하면 힌트가 통째로 사라져요', gw: '라벨이 항상 보여서 맥락이 유지돼요' },
  en: { ph: 'Name', val: 'Jordan Lee', bw: 'the hint disappears once you type', gw: 'the label stays visible the whole time' },
};
let lang = 'ko', filled = false;
function paint() {
  const t = L[lang];
  bi.placeholder = t.ph; gi.placeholder = t.ph; glabel.textContent = t.ph;
  bi.value = filled ? t.val : ''; gi.value = filled ? t.val : '';
  bw.textContent = t.bw; gw.textContent = t.gw;
}
paint();
setInterval(() => { filled = !filled; if (!filled) lang = lang === 'ko' ? 'en' : 'ko'; paint(); }, 1700);