/* Settings covers the workbench body and the Nulli entry. The rail is not shown. */
.wb-body:has(#wb-settings-page:not([hidden])){overflow:hidden}
.wb-app:has(#wb-settings-page:not([hidden]))>.wb-rail{display:none!important}
#wb-settings-page{position:relative;
  position:absolute;inset:0;z-index:26;display:flex;flex-direction:column;min-width:0;min-height:0;
  background:var(--canvas);color:var(--foreground);
}
#wb-settings-page[hidden]{display:none!important}
.nu-settings-head{
  display:flex;align-items:center;gap:var(--space-2);
  min-height:var(--control-md);margin:0 0 var(--space-4);
}
.nu-settings-head .nu-back{flex:none;width:32px;height:32px;min-height:32px;padding:0;justify-content:center}
.nu-settings-head h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nu-back{
  display:inline-flex;align-items:center;gap:var(--space-1);
  min-height:var(--control-md);padding:0 var(--space-2);border-radius:var(--radius-md);
  color:var(--foreground);font:500 var(--type-body)/var(--leading-body) var(--sans);
}
.nu-back:hover{background:var(--surface-subtle);color:var(--accent)}
.nu-back .wb-icon{width:18px;height:18px}
.nu-settings-columns{flex:1;min-height:0;display:flex}
.nu-settings-nav{
  width:232px;min-width:220px;flex:none;display:flex;flex-direction:column;gap:2px;
  padding:var(--space-4) var(--space-3) var(--space-4);
  border-right:1px solid var(--border);background:var(--surface);overflow:auto;
}
.nu-settings-nav h1{
  font:600 var(--type-section)/var(--leading-section) var(--sans);
  margin:0;padding:0;color:var(--foreground);
}
.nu-set-item{
  display:flex;align-items:center;gap:var(--space-3);
  min-height:var(--control-md);padding:0 var(--space-3);border-radius:var(--radius-md);
  color:var(--foreground-secondary);width:100%;text-align:left;white-space:nowrap;
  font:500 var(--type-body)/var(--leading-body) var(--sans);
}
.nu-set-item .wb-icon{width:18px;height:18px}
.nu-set-item:hover{background:var(--surface-subtle);color:var(--foreground)}
.nu-set-item[aria-current=page]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nu-main{flex:1;min-width:0;overflow:auto}
.nu-main-inner{max-width:800px;margin:0 auto;padding:var(--space-16) var(--space-10) var(--space-16)}
.nu-page-title{font:600 var(--type-page)/var(--leading-page) var(--sans);color:var(--foreground);margin:0 0 var(--space-2)}
.nu-page-lead{color:var(--foreground-muted);font:400 var(--type-table)/var(--leading-table) var(--sans);margin:0 0 var(--space-6);max-width:62ch}
.nu-crumb{
  display:inline-flex;align-items:center;gap:var(--space-1);
  min-height:var(--control-sm);margin:0 0 var(--space-4);padding:0;white-space:nowrap;
  color:var(--foreground-muted);font:500 var(--type-table)/var(--leading-table) var(--sans);
}
.nu-crumb:hover{color:var(--accent)}
.nu-crumb .wb-icon{width:16px;height:16px}
.nu-section{margin-bottom:var(--space-6)}
.nu-section-label{
  font:600 var(--type-caption)/var(--leading-caption) var(--sans);
  color:var(--foreground-muted);margin:0 0 var(--space-2) var(--space-1);
}
.nu-group+.nu-section-label{margin-top:var(--space-8)}
.nu-group{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-float);
}
.nu-row{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);
  min-height:52px;padding:12px var(--space-6);border-bottom:1px solid var(--divider);
  background:transparent;color:inherit;width:100%;text-align:left;
}
.nu-row:last-child{border-bottom:0}
.nu-row-click:hover{background:var(--surface-subtle)}
.nu-row-main{display:flex;align-items:center;gap:var(--space-3);min-width:0;flex:1}
.nu-row-text{min-width:0;display:grid;gap:2px}
.nu-row-title{font:500 var(--type-body)/var(--leading-body) var(--sans);color:var(--foreground)}
.nu-row-sub{font:400 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-muted)}
.nu-row-meta{display:inline-flex;align-items:center;gap:var(--space-3);flex-shrink:0;color:var(--foreground-muted);font:400 var(--type-caption)/var(--leading-caption) var(--sans)}
.nu-row-meta .wb-icon{width:16px;height:16px}
.nu-brand{
  width:36px;height:36px;display:grid;place-items:center;flex:none;overflow:hidden;
  border-radius:10px 10px 4px 4px;
}
.nu-brand img{width:22px;height:22px;object-fit:contain}
.nu-brand-okx{background:#fff;border:1px solid var(--border)}
.nu-brand-binance{background:#F0B90B}
.nu-guide{display:grid;justify-items:start;gap:var(--space-4);max-width:36ch;margin-top:var(--space-2)}
.nu-guide p{margin:0;color:var(--foreground-secondary);font:400 var(--type-body)/var(--leading-body) var(--sans)}
.nu-add-wrap{margin-top:var(--space-4)}
.nu-add{width:100%}
.nu-add-mark{
  width:36px;height:36px;display:grid;place-items:center;flex:none;
  border-radius:var(--radius-md);background:var(--surface-group);color:var(--foreground-secondary);
}
.nu-add-mark .wb-icon{width:18px;height:18px}
.nu-state{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:var(--foreground-muted)}
.nu-state:before{content:"";width:6px;height:6px;border-radius:var(--radius-pill);background:currentColor}
.nu-state-good{color:var(--positive)}
.nu-state-warn{color:var(--warning)}
.nu-state-empty{color:var(--foreground-muted);font-weight:600}
.nu-row-pending{background:color-mix(in srgb,var(--warning) 6%,var(--surface))}
.nu-row-pending .nu-row-title{color:var(--foreground)}
.nu-row-pending .nu-row-sub{color:var(--foreground-secondary)}
.nu-link-setup{color:var(--accent);font-weight:600}
.nu-link-setup:hover{color:var(--accent-hover)}
.nu-link{
  display:inline-flex;align-items:center;gap:4px;color:var(--accent);
  font:500 var(--type-table)/var(--leading-table) var(--sans);min-height:var(--control-sm);padding:var(--space-1) 0;
}
.nu-link:hover{color:var(--accent-hover)}
.nu-danger{color:var(--negative)!important}
#nu-accounts .nu-row>.nu-row-text{flex:1;min-width:0}
#nu-accounts .nu-row>.btn{flex:none;white-space:nowrap}
#nu-export-status{margin:var(--space-2) 0 0}
#nu-export-status:empty{display:none}
.nu-empty{padding:var(--space-8) var(--space-4);text-align:center;color:var(--foreground-muted);font:400 var(--type-table)/var(--leading-table) var(--sans)}
.nu-detail-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-5)}
.nu-detail-identity{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.nu-detail-head .nu-page-title{font:600 var(--type-section)/var(--leading-section) var(--sans);margin:0}
.nu-detail-remove{flex:none;margin-left:auto}
.nu-confirm{
  position:absolute;inset:0;z-index:5;display:grid;place-items:center;
  padding:var(--space-6);background:var(--backdrop);
}
.nu-confirm[hidden]{display:none!important}
.nu-confirm-card{
  width:min(420px,100%);padding:var(--space-6);border-radius:var(--radius-panel);
  background:var(--surface-overlay);border:1px solid var(--border);box-shadow:var(--shadow);
  display:grid;gap:var(--space-4);
}
.nu-confirm-card h3{margin:0;font:600 var(--type-section)/var(--leading-section) var(--sans);color:var(--foreground)}
.nu-confirm-card p{margin:0;color:var(--foreground-secondary);font:400 var(--type-table)/var(--leading-body) var(--sans)}
.nu-confirm-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--space-3)}
.nu-confirm-actions .btn{white-space:nowrap}
.nu-actions{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-4)}
.nu-seg{display:inline-flex;gap:2px;padding:3px;background:var(--surface-group);border-radius:var(--radius-md)}
.nu-seg button{
  min-height:28px;padding:4px 10px;border-radius:var(--radius-sm);
  font:500 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-secondary);
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
}
.nu-seg button .wb-icon{width:14px;height:14px}
.nu-seg button[aria-pressed=true]{background:var(--surface);color:var(--accent);font-weight:600;box-shadow:var(--shadow-float)}
#wb-settings-page .nu-seg button{box-sizing:border-box;height:28px;min-height:28px;max-height:28px;padding:0 10px}
.nu-prose{padding:var(--space-4);font:400 var(--type-table)/var(--leading-body) var(--sans);color:var(--foreground-secondary)}
.nu-prose p+p{margin-top:var(--space-3)}
.nu-footnote{margin-top:var(--space-4)}
.nu-footnote button{color:var(--foreground-muted);font:400 var(--type-caption)/var(--leading-caption) var(--sans);text-align:left}
.nu-footnote button:hover{color:var(--accent)}
.nu-form{padding:var(--space-4);display:grid;gap:var(--space-4)}
.nu-field-grid{display:grid;grid-template-columns:minmax(140px,.8fr) minmax(180px,1.4fr);gap:var(--space-4)}
.nu-form label,.nu-field{display:grid;gap:var(--space-2);font:500 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-secondary)}
#nu-accounts :is(.bd-account-form input,.bd-account-form select){
  width:100%;min-height:var(--control-md);padding:8px 12px;border-radius:var(--radius-md);
  border:1px solid var(--border);background:var(--surface);color:var(--foreground);
  font:400 var(--type-body)/var(--leading-body) var(--sans);
  transition:border-color var(--motion-feedback),box-shadow var(--motion-feedback);
}
#nu-accounts .bd-secret input{padding-right:44px}
#nu-accounts :is(.bd-account-form input,.bd-account-form select):hover{border-color:var(--fog-300)}
[data-theme=dark] #nu-accounts :is(.bd-account-form input,.bd-account-form select):hover{border-color:var(--pine-400)}
#nu-accounts :is(.bd-account-form input,.bd-account-form select):focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px var(--accent-soft)}
.nu-form :is(select.input){width:100%}
#wb-ai-form :is(input.input,select.input){border-color:var(--border)}
#wb-ai-form :is(input.input,select.input):focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px var(--accent-soft)}
#wb-ai-form .bd-secret{display:block;margin-top:0}
#wb-ai-form .bd-secret input{padding-right:44px}
#wb-ai-model{background-image:none;appearance:none}
/* Chrome draws the datalist arrow as an inline list-item. Hide that hover caret. */
#wb-ai-model::-webkit-calendar-picker-indicator{display:none!important;appearance:none;opacity:0!important;pointer-events:none;width:0!important;height:0}
#nu-accounts .bd-account-form{display:grid;gap:var(--space-4);margin-top:0;padding:0}
#nu-accounts .bd-account-form label{display:grid;gap:var(--space-2);font:500 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-secondary)}
#nu-accounts .bd-account-form input{margin-top:0}
#nu-accounts .bd-secret{margin-top:0}
#nu-accounts .bd-account-form .bd-field-hint{font:400 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-muted)}
#nu-accounts .bd-account-form .bd-form-notes{display:grid;gap:var(--space-2)}
#nu-accounts .bd-account-form .bd-dialog-note{margin:0!important;font:400 var(--type-caption)/var(--leading-caption) var(--sans);color:var(--foreground-muted)}
/* Settings actions belong to the page flow; keep the dashboard's sticky dialog shadow out. */
#nu-accounts .bd-form-actions{
  display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;
  position:static;bottom:auto;margin-top:0;padding:0;background:transparent;box-shadow:none;
}
#nu-accounts #ec-form.bd-account-form{display:grid;gap:var(--space-4);margin-top:var(--space-3);padding:0}
#nu-accounts .ec-content>.bd-dialog-note{margin:var(--space-3) 0 0!important;font:400 var(--type-caption)/var(--leading-body) var(--sans);color:var(--foreground-muted)}
#nu-accounts #ec-fields{gap:var(--space-4)}
#nu-accounts #ec-form .bd-form-actions{margin-top:0}
#nu-accounts #ec-saved-actions{margin-top:var(--space-4)}
#nu-accounts .ec-account-section{border:0;background:transparent}
#nu-accounts .ec-account-section>summary{display:none}
#nu-accounts .ec-content{display:block}
#nu-accounts #ec-audit{display:none}
#nu-accounts .bd-error{color:var(--negative);margin:0}
#nu-accounts .bd-error:empty{display:none}
@media(max-width:900px){
  .nu-settings-nav{width:220px;min-width:220px}
  .nu-main-inner{padding:var(--space-12) var(--space-6) var(--space-12)}
  .nu-field-grid{grid-template-columns:1fr}
}
