.access-form { min-width: 0; }
.access-form .field { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; }
.access-form input:not([type="checkbox"]), .access-form select { width: 100%; min-width: 0; max-width: 560px; box-sizing: border-box; flex: none; height: 40px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--r-ctl); background: var(--surface); color: var(--ink); font: inherit; }
.access-form .btn { margin: 8px 8px 8px 0; max-width: 100%; height: auto; min-height: 32px; white-space: normal; padding: 6px 14px; border: 1px solid var(--line-strong); border-radius: var(--r-ctl); background: var(--surface); color: var(--ink); font-size: 14px; font-weight: 500; cursor: pointer; }
.access-form h2 { margin: 0 0 16px; font-size: 16px; font-weight: 600; }
.page:has(.access-panels) .topbar h1 { margin: 0; font-size: 20px; font-weight: 600; }
.access-form .note.bad { color: var(--danger); }
.access-panels { align-items: start; }
.access-panels .panel { margin-bottom: 16px; }
.access-address, .access-code { overflow-wrap: anywhere; white-space: pre-wrap; }
.access-check { display: flex; align-items: center; gap: 8px; }
.access-login { margin-top: 24px; }
.access-recover { padding: 16px; }
.access-recover summary { cursor: pointer; }
.access-code-output { max-width: 100%; }

/* Account settings only: login and recovery sign-in forms keep their own layout. */
.work.single.access-panels{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;padding:24px;align-content:start}
.access-panels .panel{margin:0;padding:24px;min-width:0}
.access-panels #access-credentials{grid-column:1;grid-row:1/span 2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-content:start}
.access-panels #access-wallet,.access-panels #access-recovery{grid-column:2}
.access-panels #access-credentials>*{grid-column:1/-1;min-width:0}
.access-panels #access-credentials>.field:has([name="new_password"]){grid-column:1}
.access-panels #access-credentials>.field:has([name="confirm_password"]){grid-column:2}
.access-panels .access-form h2{font-size:16px;font-weight:500;line-height:24px;margin:0 0 12px}
.access-panels #access-credentials h2{margin-bottom:0}
.access-panels .access-form .fine{font-size:12px;color:var(--ink3);line-height:20px;margin:8px 0 16px}
.access-panels #access-credentials>.fine{margin:0}
.access-panels .access-form .field{gap:8px;margin:16px 0}
.access-panels #access-credentials .field{margin:0}
.access-panels .access-form .field label{font-size:13px;line-height:20px;color:var(--ink2)}
.access-panels .access-form input:not([type="checkbox"]),.access-panels .access-form select{max-width:none;height:40px}
.access-panels .access-form input:focus-visible,.access-panels .access-form select:focus-visible{outline:2px solid var(--data);outline-offset:2px}
.access-panels .access-form .btn{margin:8px 8px 0 0;min-height:36px;padding:8px 16px;line-height:20px}
.access-panels #access-credentials>button[type="submit"]{justify-self:start;background:var(--primary);color:var(--on-primary);border-color:var(--primary);margin:4px 0 0}
.access-panels .access-form .btn:disabled{cursor:default;opacity:.6}
.access-panels .access-state{margin:16px 0;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface-2);font-size:13px;line-height:20px;color:var(--ink2)}
.access-panels .access-address{font-family:var(--mono);font-size:12px}
.access-panels .access-code-output:empty{display:none}
.access-panels .access-code-output:not(:empty){margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.access-panels .access-code{margin:0 0 12px;padding:16px;border:1px solid var(--warn-line);border-radius:var(--r-ctl);background:var(--warn-bg);color:var(--ink);font-family:var(--mono);font-size:13px;line-height:24px}
.access-panels .access-check{align-items:flex-start;font-size:13px;line-height:20px}
.access-panels .note{font-size:13px;line-height:20px;overflow-wrap:anywhere}
@media(max-width:1100px){.work.single.access-panels{grid-template-columns:minmax(0,1fr);gap:20px;padding:20px}.access-panels #access-credentials{grid-row:auto}.access-panels #access-wallet,.access-panels #access-recovery{grid-column:1}}
@media(max-width:760px){.work.single.access-panels{padding:16px;gap:16px}.access-panels .panel{padding:20px}.access-panels #access-credentials{grid-template-columns:minmax(0,1fr)}.access-panels #access-credentials>.field:has([name="confirm_password"]){grid-column:1}.access-panels .access-form .btn{width:100%;margin-right:0}.access-panels .access-code{padding:12px}}