/* ─────────────────────────────────────────────────────────
   이어핏 들어오는 화면 (로그인·가입) — 10/4 새 디자인
   PC: 왼쪽 소개 + 오른쪽 로그인 / 폰: 위 한 줄 소개 + 로그인
   ───────────────────────────────────────────────────────── */
body.entry{
  min-height:100vh;padding:0;background:var(--bg);color:var(--ink);overflow-x:hidden}
.en-glow{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(42rem 30rem at 12% -8%, rgba(255,107,74,.22), transparent 60%),
    radial-gradient(36rem 28rem at 96% 108%, rgba(255,154,90,.10), transparent 60%),
    radial-gradient(30rem 24rem at 70% 10%, rgba(120,140,255,.07), transparent 60%)}
.en-glow::after{content:"";position:absolute;inset:0;opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(ellipse at 30% 20%,#000 0,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 30% 20%,#000 0,transparent 70%)}
.en-wrap{position:relative;z-index:1;max-width:1180px;margin:0 auto;min-height:100vh;min-height:100dvh;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:center;
  padding:calc(40px + env(safe-area-inset-top)) 48px calc(40px + env(safe-area-inset-bottom))}

/* 왼쪽 소개 */
.en-logo{align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.en-logo svg.ic{width:38px;height:38px;border-radius:10px;box-shadow:0 6px 20px rgba(255,107,74,.35)}
.en-logo svg.wd{height:20px;width:auto}
.en-logo .wd .n{fill:var(--ink)} .en-logo .wd .k{fill:var(--accent)}
.en-kicker{display:inline-flex;align-items:center;gap:8px;margin-top:44px;padding:6px 12px 6px 8px;border-radius:99px;
  background:var(--tint);border:1px solid var(--tint-2);font-size:13px;font-weight:600;color:var(--ink2)}
.en-kicker i{width:8px;height:8px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px rgba(91,228,155,.15)}
.en-hero h1{margin-top:18px;font-size:clamp(34px,4.6vw,58px);line-height:1.12;font-weight:800;letter-spacing:-.045em;text-wrap:balance}
.en-hero h1 em{font-style:normal;background:linear-gradient(92deg,var(--accent),#FFA36B);-webkit-background-clip:text;background-clip:text;color:transparent}
.en-lead{margin-top:18px;max-width:30em;line-height:1.65;color:var(--ink2)}
.en-feats{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px;max-width:640px}
.en-feats li{padding:16px;border-radius:18px;background:var(--tint);border:1px solid var(--tint);
  display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink3);line-height:1.5}
.en-feats b{font-size:15px;color:var(--ink);letter-spacing:-.02em}
.en-feats svg{width:26px;height:26px;stroke:var(--accent);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-bottom:4px}

/* 오른쪽 로그인 카드 */
.en-auth{display:flex;flex-direction:column;gap:16px;min-width:0}
.en-card{background:color-mix(in srgb,var(--surface) 88%,transparent);border:1px solid var(--tint-2);border-radius:28px;
  padding:32px 28px;box-shadow:var(--pop-shadow);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.en-card h2{font-weight:800;letter-spacing:-.035em}
.en-card .en-sub{font-size:14px;color:var(--ink3);margin-top:6px;line-height:1.55}
.en-card form{display:flex;flex-direction:column}
.en-f{display:flex;flex-direction:column;gap:6px;margin-top:14px;font-size:13px;font-weight:600;color:var(--ink2)}
.en-card .txt{margin:0;background:var(--sunken);border:1px solid transparent;border-radius:14px;padding:14px 15px;font-size:16px;color:var(--ink)}
.en-card .txt:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent)}
.en-card .txt::placeholder{color:var(--ink3)}
.en-card .btn{margin-top:20px;padding:16px;border-radius:14px;font-size:16px;font-weight:700;color:#fff;
  background:linear-gradient(180deg,#FF7A5A,var(--accent));box-shadow:0 10px 24px rgba(255,107,74,.30),inset 0 1px 0 rgba(255,255,255,.25)}
.en-card .btn:hover{filter:brightness(1.05)}
.en-err{margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--red-soft);color:var(--red);font-size:13.5px;font-weight:600}
.en-alt{display:flex;align-items:center;gap:12px;margin:22px 0 4px;font-size:12.5px;color:var(--ink3)}
.en-alt::before,.en-alt::after{content:"";flex:1;height:1px;background:var(--tint-2)}
.en-sec{display:block;text-align:center;padding:14px;border-radius:14px;background:var(--tint);border:1px solid var(--tint-2);
  color:var(--ink);font-weight:700;font-size:15px;text-decoration:none}
.en-sec:hover{background:var(--tint-2)}
.en-tok{margin-top:16px}
.en-tok>summary{list-style:none;cursor:pointer;font-size:13px;color:var(--ink3);text-align:center}
.en-tok>summary::-webkit-details-marker{display:none}
.en-tok[open]>summary{margin-bottom:4px}
.en-foot{text-align:center;font-size:12.5px;color:var(--ink3)}
.en-foot a{color:var(--ink3)}
.en-card .agree{margin-top:18px;padding:14px;border-radius:16px;background:var(--sunken)}
.en-card .agree a{color:var(--ink2)}

/* 폰 모양 미리보기 (PC 소개 쪽) */
.en-show{display:flex;align-items:center;gap:20px;margin-top:40px}
.en-mini{flex:none;width:250px;padding:16px;border-radius:24px;background:var(--surface);border:1px solid var(--tint-2);
  box-shadow:var(--pop-shadow);transform:rotate(-6deg);margin:10px 8px 10px 4px}
.en-mini small{display:inline-block;font-size:11px;font-weight:700;color:var(--accent);background:var(--accent-soft);padding:3px 8px;border-radius:99px}
.en-mini b{display:block;margin-top:10px;font-size:18px;letter-spacing:-.03em}
.en-mini b em{font-style:normal;color:var(--accent)}
.en-mini ul{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:6px}
.en-mini li{display:flex;justify-content:space-between;padding:9px 11px;border-radius:12px;background:var(--sunken);font-size:12.5px;color:var(--ink2)}
.en-mini li span{color:var(--ink);font-weight:700}
.en-mini .tipc{margin-top:10px;padding:10px 11px;border-radius:12px;border:1px dashed rgba(255,107,74,.45);font-size:12px;color:var(--ink2);line-height:1.5}
.en-quote{font-size:14px;color:var(--ink3);line-height:1.6;max-width:16em}
.en-quote b{color:var(--ink);font-weight:700}

@media (max-width:960px){
  .en-wrap{grid-template-columns:minmax(0,1fr);gap:28px;max-width:480px;align-items:start;padding:calc(28px + env(safe-area-inset-top)) 20px calc(28px + env(safe-area-inset-bottom))}
  .en-kicker{margin-top:28px}
  .en-hero h1{font-size:clamp(30px,8.4vw,40px)}
  .en-lead{font-size:15.5px}
  .en-feats{grid-template-columns:minmax(0,1fr);gap:8px;margin-top:22px}
  .en-feats li{flex-direction:row;align-items:center;gap:12px;padding:13px 14px}
  .en-feats li svg{margin:0;flex:none}
  .en-feats li div{display:flex;flex-direction:column;gap:2px}
  .en-show{display:none}
  .en-auth{order:2}
  .en-card{padding:26px 20px;border-radius:24px}
}
@media (max-width:960px){ .en-hero{order:1} }
/* 앱 안(작은 화면)에서는 소개를 짧게: 기능 목록은 로그인 아래로 */
@media (max-width:520px){
  .en-feats{display:none}
  .en-lead{display:none}
  .en-kicker{display:none}
  .en-hero h1{margin-top:22px;font-size:30px}
}
/* 다듬기: 로고는 한 줄 차지, 한국어 줄바꿈은 낱말 단위, 기능 칸 제목·설명 위아래 */
.en-logo{display:flex;width:fit-content}
body.entry{word-break:keep-all;overflow-wrap:anywhere}
.en-feats li div{display:flex;flex-direction:column;gap:4px}
@media (max-width:960px){ .en-wrap{align-content:start} }

/* 밝은 화면: 바탕 격자는 끈다 */
@media (prefers-color-scheme: light){ :root:not(.theme-dark) .en-glow::after{display:none} }
:root.theme-light .en-glow::after{display:none}
/* 미리보기 카드 + 옆 문구를 한 묶음으로, 위 기능 칸 줄 가운데에 (10/5 사용자) */
.en-show{max-width:640px}
.en-show{justify-content:center}

/* 글자 체계·줄바꿈 (10/5 대표 요청) — 큰 제목도 지나치게 크지 않게, 제목·버튼 줄 고르게 */
.en-hero h1{font-size:clamp(28px,3.6vw,40px)}
.en-lead{font-size:16px;text-wrap:pretty}
.en-card h2{font-size:22px;text-wrap:balance}
.en-card .en-sub,.agree label span{text-wrap:pretty}
.en-card .btn,.en-sec{white-space:nowrap}

/* UI QA(QUI-009): 동의 설명·안내 11px → 13px, 체크 줄 전체를 누르는 곳으로(44px), 약관 링크는 밑줄로 따로 보이게 · 아래 링크 누르기 44px(QUI-007) */
.en-card .agree small,.en-card .agree-note{font-size:13px!important;line-height:1.55}
.en-card .agree label{min-height:44px;align-items:flex-start;padding:4px 0;cursor:pointer}
.en-card .agree label input{width:22px;height:22px;flex:none}
.en-card .agree a{text-decoration:underline;text-underline-offset:2px;padding:4px 2px}
.en-foot a,.en-card a.en-link,.en-card .linkbtn{display:inline-flex;align-items:center;min-height:44px}
/* QUI-009 남은 것: 동의 줄 안 '이용약관' 링크 12 → 14px */
.en-card .agree a{font-size:14px}