/* KinStatus /delete-account/ — standalone page styles, email OTP flow (DRAFT, not deployed). */
:root { color-scheme: light; }
body { margin: 0; background: #f6f7f9; color: #1d2330; font: 16px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; }
.ks-del { max-width: 680px; margin: 0 auto; padding: 24px 16px 48px; }
.ks-del__brand a { color: #1f6f5c; font-weight: 700; text-decoration: none; }
.ks-del h1 { font-size: 1.7rem; line-height: 1.25; margin: 8px 0 12px; }
.ks-del h2 { font-size: 1.2rem; margin: 0 0 8px; }
.ks-del a { color: #1f6f5c; }
.ks-del__notice, .ks-del__app, .ks-del__legal { background: #fff; border: 1px solid #dfe3ea; border-radius: 12px; padding: 16px 18px; margin: 16px 0; }
.ks-del__notice ul, .ks-del__legal ul { margin: 0; padding-left: 20px; }
.ks-del__notice li { margin: 6px 0; }
.ks-del__error { background: #fdecec; border: 1px solid #f2b8b8; color: #8a1c1c; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.ks-del__info { background: #eef6f2; border: 1px solid #b9d9cb; color: #1f5647; border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.ks-del__form { display: grid; gap: 6px; margin-top: 12px; }
.ks-del__form input { font: inherit; max-width: 100%; padding: 10px 12px; border: 1px solid #c6ccd6; border-radius: 8px; }
.ks-del__btn { font: inherit; font-weight: 600; padding: 10px 16px; border-radius: 8px; border: 1px solid #1f6f5c; background: #1f6f5c; color: #fff; cursor: pointer; }
.ks-del__btn[disabled] { opacity: .5; cursor: not-allowed; }
.ks-del__btn--danger { background: #b3261e; border-color: #b3261e; }
.ks-del__btn--plain { background: transparent; color: #1d2330; border-color: #c6ccd6; margin-left: 8px; }
.ks-del__check { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0; }
.ks-del__check input { margin-top: 5px; }
.ks-del__small, .ks-del__links { font-size: .9rem; color: #4a5263; }
@media (max-width: 480px) { .ks-del__btn--plain { margin: 8px 0 0; } .ks-del__btn { width: 100%; } }
/* Step headings receive focus programmatically (tabindex="-1") when a step appears; they are not controls. */
.ks-del h2[tabindex="-1"]:focus { outline: none; }
.ks-del__btn:focus-visible, .ks-del__form input:focus-visible, .ks-del__check input:focus-visible { outline: 3px solid #1f6f5c; outline-offset: 2px; }
.ks-del__app[aria-busy="true"] .ks-del__btn { cursor: progress; }
/* KEEP LAST. The hidden attribute must always win: author rules such as `.ks-del__form { display: grid }`
   otherwise override the browser default and leave "hidden" steps visible and usable (correction
   2026-09-28). !important wins in browsers; being last also wins for engines that only model source
   order (the jsdom test harness). */
[hidden] { display: none !important; }
