:root { color-scheme: dark; font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif; color: #f4f7fb; background: #061522; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; padding: max(24px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom)); background: radial-gradient(ellipse at top left, #104044 0, transparent 65%); }
header { max-width: 480px; margin: 0 auto; color: #68dfd0; font-weight: 800; letter-spacing: .08em; }
header span { float: right; color: #a6bdca; font-size: .75rem; line-height: 1.5rem; letter-spacing: .15em; }
main { max-width: 480px; margin: clamp(36px, 12svh, 110px) auto 0; padding: clamp(22px, 6vw, 36px); border: 1px solid #345066; border-radius: 24px; background: #071523e6; }
.eyebrow { color: #68dfd0; font-size: .85rem; font-weight: 700; }
.progress { width: 40px; height: 4px; margin-top: 28px; border-radius: 4px; background: #68dfd0; }
h1 { margin: 20px 0; font-size: clamp(1.45rem, 6vw, 2rem); line-height: 1.5; letter-spacing: .02em; }
p { color: #b3c7d4; font-size: .95rem; line-height: 1.8; }
.action { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 52px; margin-top: 28px; padding: 12px 18px; border-radius: 14px; background: #68dfd0; color: #061525; text-decoration: none; font-weight: 700; }
.action:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.fallback { margin-bottom: 0; font-size: .75rem; }
.login-id { overflow-wrap: anywhere; color: #68dfd0; font-weight: 700; }
button.action { width: 100%; border: 0; font: inherit; font-weight: 700; cursor: pointer; }