*{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{
    background:var(--bg); color:var(--tx);
    font-family:"Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",
                -apple-system,BlinkMacSystemFont,sans-serif;
    -webkit-font-smoothing:antialiased;
    min-height:100vh; display:flex; justify-content:center;
    padding:56px 20px 72px;
  }
  .wrap{width:100%;max-width:400px;text-align:center}

  /* ── 보안 배지 / 로고 / 브랜드 ── */
  .shield{
    width:52px;height:52px;border-radius:50%;
    background:var(--card);border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;
    margin:0 auto 18px;
  }
  .shield svg{width:25px;height:25px;stroke:var(--rule);fill:none;
              stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  .logo{margin:0 auto 18px;display:block}
  .brand{
    font-size:clamp(21px,6.6vw,27px); font-weight:700; letter-spacing:.14em;
    margin:0 0 9px; line-height:1.2; margin-right:-.14em; color:var(--tx);
  }
  .tagline{
    font-size:11px; letter-spacing:.24em; color:var(--rule);
    margin:0 0 22px; text-transform:uppercase;
  }
  h2.headline{
    font-size:15px; font-weight:700; line-height:1.6;
    letter-spacing:-.01em; color:var(--tx); margin:0 0 14px;
  }
  .rule{width:44px;height:1px;background:var(--rule);opacity:.45;border:0;margin:0 auto 26px}

  /* ── 본문 텍스트 ── */
  .intro{font-size:13.5px;line-height:2;color:var(--tx);margin:0 0 16px}
  .warn{font-size:12.5px;font-weight:600;color:var(--warn);margin:0 0 28px}

  h1.page{
    font-size:25px;font-weight:700;letter-spacing:.02em;margin:0 0 22px;color:var(--tx);
  }

  /* ── 로그인 카드 ── */
  .card{
    background:var(--card);border:1px solid var(--line);border-radius:8px;
    padding:24px 20px;
  }
  form{margin:0}
  .field{
    width:100%;border:1px solid var(--line);border-radius:4px;
    background:var(--bg);padding:14px 12px;font-size:14px;
    color:var(--tx);text-align:center;outline:none;
    font-family:inherit;
  }
  .field::placeholder{color:var(--dim)}
  .field:focus{border-color:var(--rule)}
  .field + .field{margin-top:6px}

  button.enter{
    width:100%;margin-top:18px;padding:15px 0;border:0;border-radius:4px;
    background:var(--accent);color:var(--on-accent);font-size:14.5px;font-weight:700;
    letter-spacing:.06em;cursor:pointer;font-family:inherit;
  }
  button.enter:hover{opacity:.88}

  .seal{
    display:flex;align-items:center;justify-content:center;gap:5px;
    margin:14px 0 0;font-size:11px;color:var(--dim);
  }
  .seal svg{width:12px;height:12px;stroke:var(--dim);fill:none;
            stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

  .sublinks{margin:20px 0 0;font-size:13px;color:var(--dim)}
  .sublinks a{color:var(--dim);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:1px}
  .sublinks a:hover{color:var(--tx)}
  .sublinks span{margin:0 12px;color:var(--line)}

  /* ── 안내 / 정보 박스 ── */
  .box{
    background:var(--card);border:1px solid var(--line);border-radius:8px;
    padding:24px 20px;margin-top:28px;
  }
  .box-title{
    font-size:13px;letter-spacing:.18em;color:var(--dim);margin:0 0 14px;font-weight:500;
  }
  .box-body{font-size:13.5px;line-height:1.85;color:var(--dim);margin:0}
  .box-id{font-size:15px;font-weight:700;color:var(--tx);margin:0 0 10px}

  /* ── 상담채널 드롭다운 ── */
  details.ch{margin-top:26px;border:1px solid var(--line);border-radius:6px;background:var(--card)}
  .box details.ch{margin-top:0}
  details.ch summary{
    list-style:none;cursor:pointer;padding:15px 0;font-size:14px;
    letter-spacing:.04em;color:var(--tx);text-align:center;
  }
  details.ch summary::-webkit-details-marker{display:none}
  details.ch summary::after{content:" ▼";font-size:10px;color:var(--dim)}
  details.ch[open] summary::after{content:" ▲"}
  details.ch .ch-list{border-top:1px solid var(--line);padding:6px 0}
  details.ch a{
    display:block;padding:13px 16px;font-size:14px;color:var(--tx);
    text-decoration:none;text-align:center;
  }
  details.ch a:hover{background:var(--bg)}

  /* ── 하단 카드 ── */
  .seo{margin:26px 0 0; text-align:left}
  .seo-card{
    background:var(--card); border:1px solid var(--line); border-radius:8px;
    padding:22px 20px; margin-top:12px;
  }
  .seo-card h2{font-size:16px; font-weight:700; line-height:1.5; color:var(--tx); margin:0 0 12px}
  .seo-card p{font-size:13.5px; line-height:1.9; color:var(--tx); margin:0 0 12px}
  .seo-card p:last-child{margin-bottom:0}

  .logout{display:inline-block;margin-top:30px;font-size:13.5px;color:var(--dim);
          text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:1px}
