.forget-page { min-height: 100vh; min-height: 100dvh; margin: 0; padding: 0; display: flex; flex-direction: column; color: #213448; font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif; background: radial-gradient(ellipse at 15% 10%, #dbeaf3 0, transparent 48%), linear-gradient(140deg, #f5f8fc, #eaf1f7); }
.forget-shell { flex: 1; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.forget-card { width: 100%; max-width: 540px; background: #fff; border: 1px solid #dbe5ef; border-radius: 20px; box-shadow: 0 16px 48px #174f7b12; overflow: hidden; }
.forget-brand { padding: 26px 30px 22px; text-align: center; border-bottom: 1px solid #e5edf4; }
.forget-logo { display: block; max-width: 100%; height: auto; margin: 0 auto 14px; }
.forget-brand p { margin: 0; color: #567084; font-size: .85rem; line-height: 1.6; }
.forget-content { padding: 30px 36px; }
.forget-eyebrow { color: #287c91; font-size: .8rem; font-weight: 700; letter-spacing: .12em; }
.forget-content h1 { margin: 8px 0 12px; color: #174f7b; font-size: 1.8rem; font-weight: 700; }
.forget-description { margin: 0 0 26px; color: #617487; font-size: .95rem; line-height: 1.8; }
.forget-page .form-label { margin-bottom: 8px; color: #304d65; font-weight: 600; }
.forget-page .form-control, .forget-page .form-select { min-height: 46px; border: 1px solid #bacddd; border-radius: 8px; font-size: 1rem; }
.forget-page .form-control:focus, .forget-page .form-select:focus { border-color: #287c91; box-shadow: 0 0 0 3px #287c9120; }
.forget-boat-number { display: flex; align-items: center; gap: 8px; }
.forget-boat-number .form-select { width: 76px; flex-shrink: 0; }
.forget-boat-number .form-control { flex: 1; min-width: 0; }
.forget-boat-prefix { color: #174f7b; font-weight: 700; }
.forget-page .form-text { margin-top: 8px; color: #6a7e8e; font-size: .8rem; line-height: 1.7; }
.forget-submit { display: flex; width: 100%; min-height: 48px; align-items: center; justify-content: center; gap: 10px; padding: 11px 16px; border: 0; border-radius: 8px; color: #fff; background: linear-gradient(110deg, #174f7b, #237f91); font-weight: 700; }
.forget-submit:hover { background: #174f7b; }
.forget-submit:focus-visible, .forget-back:focus-visible { outline: 3px solid #81b5d7; outline-offset: 3px; }
.forget-submit[aria-disabled="true"] { cursor: wait; opacity: .8; }
.forget-button-spinner { width: 18px; height: 18px; border: 2px solid #ffffff60; border-top-color: #fff; border-radius: 50%; animation: forget-spin .8s linear infinite; }
.forget-button-spinner[hidden] { display: none; }
.forget-help { margin-top: 24px; padding: 15px 17px; border-radius: 10px; background: #f3f7fa; color: #617487; font-size: .85rem; line-height: 1.8; }
.forget-help strong { color: #425e74; }
.forget-help p { margin: 5px 0 0; }
.forget-back { display: block; width: fit-content; margin: 23px auto 0; color: #174f7b; font-size: .9rem; font-weight: 600; text-decoration: none; }
.forget-back:hover { color: #174f7b; text-decoration: underline; }
.forget-notice { margin-bottom: 24px; padding: 14px 16px; border: 1px solid #b5dbce; border-radius: 10px; background: #eff9f4; color: #23644f; line-height: 1.8; }
.forget-notice p { margin: 4px 0 0; font-size: .9rem; }
.forget-page #footer { position: static; flex-shrink: 0; padding: 16px 20px; line-height: 1.8; color: #617487; background: #ffffffa6; }
@keyframes forget-spin { to { transform: rotate(360deg); } }
@media(max-width:575px) { .forget-shell { padding: 24px 14px; }.forget-card { border-radius: 14px; }.forget-brand { padding: 22px 20px 18px; }.forget-content { padding: 25px 22px; }.forget-logo { width: 230px; }.forget-brand p { font-size: .78rem; } }
@media(prefers-reduced-motion:reduce) { .forget-button-spinner { animation: none; } }