/* 新規登録ページ */
.register{
  display:flex;flex-direction:column;gap:6px;
  padding:4px 0 8px;
}
.register h1{margin:0;font-size:26px;font-weight:700}
.register-lead{margin:0 0 14px;font-size:13.5px;color:var(--muted);line-height:1.6}

/* フォームを白いカードに */
.register-form{
  display:flex;flex-direction:column;gap:18px;
  padding:20px 16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:22px;
}

.register-label{
  display:flex;align-items:center;gap:8px;
  margin:0 0 8px;padding:0;
  font-size:14px;font-weight:700;
}
.register-label::before{
  content:"";width:4px;height:14px;border-radius:2px;background:var(--brand);
}

/* 役割選択: 2枚のカード */
.register-roles{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
  margin:0;padding:0;border:0;min-width:0;
}
.register-roles legend{grid-column:1 / -1}
.register-role{position:relative;display:block;cursor:pointer}
.register-role input{
  position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;
}
.register-role span{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:16px 8px;border-radius:16px;
  background:var(--bg);border:2px solid var(--line);
  font-size:14px;font-weight:700;color:var(--muted);
  transition:border-color .12s,background .12s,color .12s,transform .12s;
}
.register-role svg{width:28px;height:28px}
.register-role input:checked + span{
  color:var(--brand);background:var(--soft);border-color:var(--brand);
}
.register-role input:focus-visible + span{outline:3px solid var(--brand);outline-offset:2px}
.register-role:active span{transform:scale(.97)}

/* 入力欄 */
.register-field{display:flex;flex-direction:column}
.register-input{
  width:100%;min-height:50px;padding:0 14px;
  border:1.5px solid var(--line);border-radius:14px;
  background:var(--bg);color:var(--ink);
  font-family:inherit;font-size:16px;
}
.register-input::placeholder{color:var(--muted);opacity:.7}
.register-input:focus{
  outline:none;border-color:var(--brand);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 25%,transparent);
}

/* 登録ボタン */
.register-submit{
  min-height:56px;margin-top:4px;border:0;border-radius:18px;cursor:pointer;
  font-family:inherit;font-size:16px;font-weight:700;
  color:var(--on-brand);
  background:linear-gradient(120deg,var(--brand),var(--brand-2));
  transition:transform .12s ease;
}
.register-submit:active{transform:scale(.97)}
.register-submit:focus-visible{outline:3px solid var(--brand);outline-offset:2px}

/* 戻るリンク */
.register-back{
  display:flex;align-items:center;justify-content:center;gap:4px;
  margin-top:14px;padding:12px;
  font-size:14px;font-weight:500;color:var(--muted);text-decoration:none;
}
.register-back svg{width:18px;height:18px}
.register-back:focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:12px}

@media (prefers-reduced-motion:reduce){
  .register-role span,.register-submit{transition:none}
}