.account-layout {
  display: grid;
  grid-template-columns: minmax(0, .93fr) minmax(0, 1.15fr);
  gap: 16px;
  align-items: start;
}
.account-panel {
  min-width: 0;
  padding: clamp(15px, 2vw, 24px);
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
}
.account-panel h2 {margin: 5px 0; font-size: 29px; line-height: 1.12; letter-spacing: -.04em}
.account-panel h3 {margin: 0 0 10px; font-size: 22px; letter-spacing: -.035em}
.account-panel p {color: var(--muted); font-size: 13px; line-height: 1.55}
.account-panel .account-empty {margin-top: 12px; padding: 10px 12px; border-left: 2px solid var(--gold); background: var(--subtle)}
.account-preferences {grid-column: 1 / -1}
.account-create {margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line)}
.account-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr));
  gap: 4px 10px;
}
.account-create label {
  display: block;
  min-width: 0;
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 550;
}
.account-create :is(input:not([type=checkbox]), select) {
  display: block;
  width: 100%;
  min-width: 0;
  margin-top: 4px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--bg);
  color: var(--ink);
  font-size: 13px;
}
.account-create .hint {margin: 5px 0 12px; color: var(--faint); font-size: 11px; line-height: 1.45}
.account-panel .account-result, .account-result {color: var(--rose); font-size: 12px}
.account-result:not(:empty) {margin-top: 8px}
.account-tree, .profile-list {margin: 12px 0 0; padding: 0; list-style: none}
.account-tree .account-tree {margin: 4px 0 4px 12px; padding-left: 9px; border-left: 1px solid var(--line)}
.account-tree li {min-width: 0; margin-bottom: 3px}
.account-node, .profile-list li {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 5px 10px}
.account-node {width: 100%; padding: 7px 9px; border-radius: 4px; text-align: left}
.account-node:hover {background: var(--subtle)}
.account-node[aria-current=true] {background: var(--gold-wash); color: var(--gold); opacity: 1; cursor: default}
.account-node strong, .profile-list strong {font-size: 13px; overflow-wrap: anywhere}
.account-node small, .profile-list small {color: var(--muted); font-size: 11px}
.profile-list li {padding: 8px 0; border-top: 1px solid var(--line)}
.profile-list li > div {min-width: 0}
.profile-list small {display: block; overflow-wrap: anywhere}
.profile-list code {max-width: 100%; color: var(--faint); font-size: 10px; overflow-wrap: anywhere}
.account-effective span {font-size: 12px; color: var(--muted)}
.account-rule {
  min-width: 0;
  margin: 9px 0;
  padding: 9px 12px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.account-rule legend {padding: 0 5px; color: var(--gold); font-size: 11px; font-weight: 600}
.rule-days {display: flex; flex-wrap: wrap; gap: 5px 11px; margin: 3px 0 8px}
.rule-days label {display: inline-flex; align-items: center; gap: 3px; margin: 0}
.rule-days input {accent-color: var(--gold)}
.account-save {margin-top: 12px}
.sec-panel {max-width:760px}
#rail {overflow-y:auto}
.sec-badge {display:inline-flex;align-items:center;gap:6px;margin:7px 0 13px;padding:3px 9px;border:1px solid var(--line);border-radius:20px;background:var(--subtle);font-weight:600}
.sec-badge::before {content:'';width:7px;height:7px;border-radius:50%;background:var(--faint)}
.sec-badge.on {color:var(--green);background:var(--green-bg)}
.sec-badge.on::before {background:var(--green)}
.sec-actions {display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:13px 0 3px}
.sec-help {margin:8px 0 13px}
.sec-setup {display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,180px);gap:18px;align-items:start;margin-top:16px}
.sec-setup summary {color:var(--gold);cursor:pointer;font-size:13px;margin:12px 0 5px}
.sec-qr {background:white;border-radius:6px;overflow:hidden;max-width:195px}
.sec-qr svg {display:block;width:100%;height:auto}
.sec-seed {display:block;overflow-wrap:anywhere;color:var(--ink);padding:7px 0}
.sec-codes {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;list-style:none;padding:0}
.sec-codes li {background:var(--bg);border:1px solid var(--line);padding:6px 10px;border-radius:4px;color:var(--ink);overflow-wrap:anywhere}
.sec-panel [data-private-security]>h3,.sec-panel .account-create>label {margin-top:16px}
.sec-panel [data-verification-code] {max-width:300px}
.sec-panel .wf-message.error {color:var(--rose)}
@media(max-width:560px){.sec-setup {grid-template-columns:minmax(0,1fr)}.sec-qr {width:170px}.sec-codes{grid-template-columns:minmax(0,1fr)}}

@media (max-width: 870px) {
  .account-layout {grid-template-columns: minmax(0,1fr)}
  .account-preferences {grid-column: auto}
}