.recovery-page { margin:0; padding:24px 16px; background:#f8f7f3; color:#262c29; font:16px/1.8 system-ui,sans-serif; }
.recovery-sheet { box-sizing:border-box; width:min(680px,100%); margin:auto; padding:28px; border:1px solid #d8dfda; border-radius:20px; background:#fff; text-align:left; }
.recovery-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.recovery-heading h1,.recovery-heading h2 { margin:0; font-size:24px; }
.recovery-heading p { margin:0; color:#5d7168; font-size:12px; }
.recovery-heading > a,.recovery-heading > button { background:none; color:#436357; font-size:14px; padding:8px; flex-shrink:0; }
.recovery-ui { font:15px/1.85 system-ui,sans-serif; color:#26332e; }
.recovery-ui section { padding:22px 0; border-top:1px solid #dde3df; margin-top:20px; }
.recovery-ui h2,.recovery-ui h3 { margin:0 0 10px; font-size:19px; }
.recovery-ui p { margin:8px 0; }
.recovery-ui button,.recovery-ui .recovery-download { box-sizing:border-box; min-height:44px; border:1px solid #b9c9c1; border-radius:8px; padding:10px 16px; font:700 14px/1.5 system-ui,sans-serif; background:#fff; color:#285b4e; cursor:pointer; text-decoration:none; }
.recovery-ui button.primary { background:#207a73; border-color:#207a73; color:#fff; }
.recovery-ui button:disabled { cursor:default; opacity:.55; }
.recovery-ui button:focus-visible,.recovery-ui input:focus-visible,.recovery-ui textarea:focus-visible,.recovery-ui a:focus-visible { outline:3px solid #176eaa; outline-offset:3px; }
.recovery-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.recovery-ui .recovery-caption { font-size:13px; color:#66736b; }
.recovery-ui .recovery-warning { padding:12px 16px; border-radius:8px; background:#fff6dd; color:#695220; }
.recovery-ui label { display:block; margin-top:16px; font-weight:650; }
.recovery-ui textarea { box-sizing:border-box; width:100%; min-height:100px; margin:6px 0; padding:12px; font:16px/1.5 monospace; border:1px solid #acbbb3; border-radius:8px; overflow-wrap:anywhere; }
.recovery-ui input[type=file] { display:block; max-width:100%; margin-top:8px; font-size:14px; }
.recovery-private { margin-top:20px; text-align:center; }
.recovery-private canvas { width:min(300px,100%); height:auto; }
.recovery-private code { display:block; padding:12px; background:#f4f6f4; color:#34473b; font:14px/1.8 monospace; overflow-wrap:anywhere; user-select:all; }
.recovery-profile { padding:16px; border:1px solid #cbdacf; border-radius:10px; background:#f7faf7; overflow-wrap:anywhere; }
.recovery-profile strong { color:#207a73; font-size:22px; }
.recovery-status { margin-top:14px; min-height:1.8em; overflow-wrap:anywhere; }
.recovery-status[role=alert] { color:#a7333b; }
.recovery-modal { z-index:140; }
.recovery-modal .recovery-sheet { max-height:calc(100dvh - 32px); overflow:auto; }
.note-recovery-footer { border-top:1px solid #d8dfda; margin:0 28px 24px; padding-top:16px; font-size:12px; line-height:1.8; color:#647469; }
.note-recovery-footer button { padding:8px 0; background:transparent; color:#207a73; text-decoration:underline; font-size:14px; }
.browser-identity-notice { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:20px; background:#0008; font:16px/1.8 system-ui,sans-serif; }
.browser-identity-notice > div { width:min(440px,100%); box-sizing:border-box; border-radius:16px; background:white; color:#222; padding:24px; }
.browser-identity-notice a { display:inline-block; padding:10px 16px; color:white; background:#207a73; border-radius:8px; }
.browser-identity-actions { display:flex; flex-wrap:wrap; gap:12px; }
.browser-identity-actions a { box-sizing:border-box; flex:1 1 160px; text-align:center; font-weight:700; font-size:14px; text-decoration:none; border:1px solid #207a73; }
.browser-identity-actions .browser-identity-fresh { color:#207a73; background:white; }
.browser-identity-actions a:focus-visible { outline:3px solid #176eaa; outline-offset:3px; }
@media(max-width:480px) { .recovery-page { padding:12px; }.recovery-sheet{padding:20px 16px}.recovery-heading h1,.recovery-heading h2{font-size:22px}.recovery-actions button{flex:1 1 auto}.note-recovery-footer{margin-inline:18px} }
