/* Account compositions; tokens and generic controls live in nk-*.css. */
.nk-welcome {
  display:flex;
  align-items:center;
  gap:20px
}
.nk-welcome h1 {
  margin-bottom:6px
}
.nk-welcome .username {
  margin:0;
  color:var(--nk-text-muted)
}
.nk-profile-card .nk-identity-row {
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:22px
}
.nk-profile-card h2 {
  margin-bottom:4px
}
.nk-profile-card .username {
  margin:0;
  font-size:.875rem
}
.nk-profile-meta {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  padding-top:20px;
  border-top:1px solid var(--nk-border);
  margin:0 0 24px
}
.nk-profile-meta dt,.nk-identity-list dt {
  font-size:.75rem;
  color:var(--nk-text-muted);
  margin-bottom:4px
}
.nk-profile-meta dd,.nk-identity-list dd {
  margin:0;
  font-size:.875rem;
  overflow-wrap:anywhere
}
.nk-quick-links {
  padding:6px
}
.nk-quick-links>a {
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px;
  color:var(--nk-text);
  border-radius:8px
}
.nk-quick-links>a:hover {
  background:var(--nk-surface-raised);
  text-decoration:none
}
.nk-quick-links>a>div {
  flex:1
}
.nk-quick-links strong {
  display:block;
  font-size:.9375rem;
  font-weight:500;
  margin-bottom:2px
}
.nk-quick-links p {
  font-size:.8125rem;
  margin:0
}
.nk-quick-links>a>.nk-icon {
  color:var(--nk-text-muted);
  width:16px;
  height:16px
}
.nk-services {
  margin-top:36px
}
.nk-service-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px
}
.nk-service-card {
  display:flex;
  flex-direction:column;
  gap:18px;
  padding:20px;
  background:var(--nk-surface);
  border:1px solid var(--nk-border);
  border-radius:12px;
  color:var(--nk-text);
  min-height:172px
}
.nk-service-card:hover {
  background:#1c1d24;
  border-color:#50525e;
  text-decoration:none
}
.nk-service-card .nk-service-top {
  display:flex;
  justify-content:space-between;
  align-items:center
}
.nk-service-card .nk-service-top>.nk-icon {
  width:16px;
  height:16px;
  color:var(--nk-text-muted)
}
.nk-service-card h3 {
  font-size:.9375rem;
  margin-bottom:4px
}
.nk-service-card p {
  font-size:.8125rem;
  margin:0
}
.nk-service-card .nk-badge {
  align-self:flex-start;
  font-size:.6875rem
}
.nk-admin-callout {
  display:flex;
  align-items:center;
  gap:16px;
  background:var(--nk-accent-soft);
  border:1px solid #443260;
  border-radius:12px;
  padding:20px 24px;
  margin-top:24px
}
.nk-admin-callout>div {
  flex:1
}
.nk-admin-callout h2 {
  font-size:.9375rem;
  margin-bottom:3px
}
.nk-admin-callout p {
  font-size:.8125rem;
  margin:0
}
.nk-admin-callout>.nk-icon {
  color:var(--nk-accent-light)
}
.nk-login-intro {
  text-align:center;
  margin-bottom:28px
}
.nk-login-intro>img {
  width:190px;
  height:auto;
  margin:0 0 28px
}
.nk-login-intro h1 {
  font-size:2.5rem;
  line-height:1.18;
  letter-spacing:-.045em;
  margin-bottom:14px;
  font-weight:650
}
.nk-login-intro p {
  max-width:350px;
  margin:0 auto;
  line-height:1.7;
  font-size:.9375rem
}
.nk-login-card {
  padding:28px
}
.nk-login-card h2 {
  margin-bottom:8px
}
.nk-login-card>p {
  font-size:.875rem;
  line-height:1.7;
  margin-bottom:24px
}
.nk-google-button {
  background:#f4f4f5;
  color:#18191f;
  border-color:#f4f4f5;
  width:100%;
  min-height:48px;
  font-weight:600
}
.nk-google-button:hover {
  background:#dedee5;
  color:#18191f
}
.nk-google-button svg {
  width:18px;
  height:18px;
  flex-shrink:0
}
.nk-login-note {
  font-size:.75rem;
  text-align:center;
  margin:18px 0 0;
  line-height:1.7;
  color:var(--nk-text-muted)
}
.nk-spectrum {
  display:flex;
  justify-content:center;
  gap:6px;
  margin-top:24px
}
.nk-spectrum i {
  display:block;
  width:22px;
  height:3px;
  border-radius:3px
}
.nk-spectrum i:nth-child(1) {
  background:var(--nk-web)
}
.nk-spectrum i:nth-child(2) {
  background:var(--nk-app)
}
.nk-spectrum i:nth-child(3) {
  background:var(--nk-tv)
}
.nk-spectrum i:nth-child(4) {
  background:var(--nk-account)
}
.nk-settings {
  max-width:760px
}
.nk-settings .nk-card h2 {
  margin-bottom:4px
}
.nk-settings .nk-card>p {
  font-size:.875rem;
  margin-bottom:24px
}
.nk-avatar-editor {
  display:grid;
  grid-template-columns:80px minmax(0,1fr);
  gap:24px;
  align-items:center
}
.nk-avatar-editor form {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:end
}
.nk-avatar-editor .avatar-delete-button {
  margin-top:12px;
  font-size:.8125rem;
  min-height:36px
}
.nk-static-field {
  background:#111217;
  border:1px solid var(--nk-border);
  border-radius:8px;
  padding:12px 14px;
  color:var(--nk-text-muted);
  font-size:.875rem
}
.nk-section-subtitle {
  color:var(--nk-text-muted);
  font-size:.875rem;
  margin-bottom:24px
}
.nk-security {
  max-width:860px
}
.nk-connection {
  display:flex;
  gap:14px;
  align-items:center
}
.nk-connection>div {
  flex:1
}
.nk-connection h3 {
  margin-bottom:2px
}
.nk-connection p {
  font-size:.8125rem;
  margin:0
}
.session-item {
  display:flex;
  gap:20px;
  align-items:center;
  justify-content:space-between;
  padding:20px 0;
  border-bottom:1px solid var(--nk-border)
}
.session-item:first-child {
  padding-top:0
}
.session-item:last-child {
  border-bottom:0
}
.session-info {
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px
}
.session-info strong {
  font-size:.875rem;
  font-weight:550;
  overflow-wrap:anywhere
}
.session-info small {
  font-size:.8125rem
}
.session-revoke {
  font-size:.75rem;
  min-height:38px;
  padding:8px 12px;
  flex-shrink:0
}
.current-session {
  margin-top:5px
}
.nk-security-section>h2 {
  margin-bottom:4px
}
.nk-security-section>p {
  font-size:.875rem
}
.nk-security-actions {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--nk-border)
}
.nk-security-actions p {
  font-size:.8125rem;
  margin:0;
  max-width:420px
}
.nk-security-actions button {
  flex-shrink:0
}
.nk-logout-panel h1 {
  font-size:1.625rem
}
.nk-logout-panel .nk-service-icon {
  margin-bottom:24px;
  color:var(--nk-accent-light)
}
.nk-logout-panel>p,.nk-logout-panel li p {
  font-size:.875rem
}
.nk-logout-panel nav {
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  border-top:1px solid var(--nk-border);
  padding-top:20px;
  margin-top:24px;
  font-size:.875rem
}
.nk-logout-panel ol {
  padding-left:20px
}
.nk-logout-panel li {
  padding:10px 0
}
.nk-logout-panel li h2 {
  font-size:1rem
}
.admin-page .nk-page-heading {
  margin-bottom:28px
}
.admin-role-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin:18px 0 28px
}
.admin-role-card {
  border:1px solid var(--nk-border);
  background:var(--nk-surface);
  padding:20px;
  border-radius:12px;
  min-width:0
}
.admin-role-card h2,.admin-role-card h3 {
  font-size:.9375rem;
  margin:0 0 4px
}
.admin-role-card>p {
  font-size:.8125rem;
  margin:12px 0
}
.admin-role-card>code {
  display:block;
  font-size:.6875rem;
  color:var(--nk-text-muted)
}
.admin-role-card form {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--nk-border)
}
.admin-role-card button {
  font-size:.8125rem;
  min-height:36px;
  padding:8px 12px
}
.nk-role-heading {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px
}
.nk-role-heading>div {
  flex:1
}
.nk-role-heading .nk-service-icon {
  width:36px;
  height:36px
}
.nk-admin-stat-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:24px 0
}
.nk-admin-stat {
  padding:20px;
  border:1px solid var(--nk-border);
  border-radius:12px;
  background:var(--nk-surface)
}
.nk-admin-stat dt {
  font-size:.75rem;
  color:var(--nk-text-muted);
  margin-bottom:12px
}
.nk-admin-stat dd {
  font-size:1.75rem;
  font-weight:600;
  letter-spacing:-.03em;
  margin:0
}
.nk-admin-stat small {
  display:block;
  font-size:.6875rem;
  margin-top:8px;
  overflow-wrap:anywhere
}
.nk-admin-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px
}
.nk-admin-actions a {
  display:flex;
  gap:16px;
  align-items:center;
  padding:22px;
  background:var(--nk-surface);
  border:1px solid var(--nk-border);
  border-radius:12px;
  color:var(--nk-text)
}
.nk-admin-actions a:hover {
  background:var(--nk-surface-raised);
  text-decoration:none
}
.nk-admin-actions h2 {
  font-size:1rem;
  margin-bottom:4px
}
.nk-admin-actions p {
  font-size:.8125rem;
  margin:0
}
.nk-admin-actions a>div {
  flex:1
}
.nk-admin-actions a>.nk-icon {
  width:16px;
  height:16px;
  color:var(--nk-text-muted)
}
.admin-search {
  display:flex;
  align-items:flex-end;
  gap:12px;
  margin:0 0 20px
}
.admin-search>div {
  flex:1;
  max-width:480px
}
.admin-search input {
  min-width:0
}
.admin-search button {
  min-height:44px
}
.nk-table-meta {
  font-size:.8125rem;
  margin-bottom:16px
}
.admin-table-wrap {
  border:1px solid var(--nk-border);
  border-radius:12px;
  overflow:auto;
  background:var(--nk-surface)
}
table {
  width:100%;
  border-collapse:collapse;
  text-align:left;
  font-size:.875rem
}
th {
  background:#14151a;
  color:var(--nk-text-muted);
  font-size:.6875rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:500;
  padding:14px 20px;
  white-space:nowrap
}
td {
  padding:18px 20px;
  border-top:1px solid var(--nk-border);
  vertical-align:middle
}
td small {
  display:block;
  font-size:.75rem;
  margin-top:3px
}
td code {
  font-size:.6875rem;
  display:block;
  max-width:230px
}
td .nk-button {
  font-size:.75rem;
  min-height:34px;
  padding:7px 10px
}
tbody tr:hover {
  background:#1c1d25
}
.nk-table-person {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:140px
}
.nk-table-person>div {
  min-width:0;
  overflow-wrap:anywhere
}
.nk-role-badges {
  display:flex;
  flex-wrap:wrap;
  gap:6px
}
.nk-role-badges .nk-badge {
  font-size:.6875rem
}
.nk-pagination {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  margin-top:20px;
  color:var(--nk-text-muted);
  font-size:.8125rem
}
.nk-pagination a {
  border:1px solid var(--nk-border);
  border-radius:8px;
  padding:7px 12px;
  color:var(--nk-text-subtle);
  min-height:36px
}
.nk-pagination a:hover {
  background:var(--nk-surface)
}
.nk-user-identity {
  display:flex;
  align-items:center;
  gap:20px;
  margin-bottom:28px
}
.nk-user-identity h1 {
  margin-bottom:6px
}
.nk-user-identity p {
  margin:0
}
.nk-identity-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px
}
.nk-identity-list>div {
  min-width:0
}
.nk-identity-list dd {
  line-height:1.7
}
.nk-detail-section {
  margin-top:28px
}
.nk-detail-section>h2 {
  margin-bottom:8px
}
.nk-editorial {
  padding:24px;
  background:var(--nk-surface);
  border:1px solid var(--nk-border);
  border-radius:12px;
  margin-top:24px
}
.nk-editorial p {
  font-size:.875rem
}
.nk-editorial>h2 {
  display:flex;
  gap:10px;
  align-items:center
}
.nk-editorial form {
  margin-top:20px;
  padding-top:20px;
  border-top:1px solid var(--nk-border)
}
.nk-editorial label {
  max-width:440px
}
.nk-editorial select {
  margin-top:8px
}
.nk-editorial form button {
  margin-top:14px
}
.nk-editorial [role=alert] {
  margin-top:16px
}
.nk-editorial .admin-notice p {
  color:inherit
}
.nk-role-members {
  list-style:none;
  margin:20px 0 0;
  padding:0;
  border:1px solid var(--nk-border);
  border-radius:12px;
  background:var(--nk-surface)
}
.nk-role-members li {
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 20px;
  border-bottom:1px solid var(--nk-border);
  min-width:0
}
.nk-role-members li:last-child {
  border:0
}
.nk-role-members li>div {
  flex:1;
  min-width:0;
  overflow-wrap:anywhere
}
.nk-role-members code {
  display:block;
  font-size:.6875rem;
  margin-top:2px
}
.nk-role-members a {
  font-size:.8125rem;
  white-space:nowrap
}
.nk-profile-public {
  text-align:center
}
.nk-profile-public .nk-avatar {
  margin-bottom:20px
}
.nk-profile-public .bio {
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
.nk-profile-public .nk-badge {
  margin-bottom:20px
}
@media(max-width:1200px) {
  .nk-service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:640px) {
  .nk-welcome {
    gap:14px
  }
  .nk-welcome>.nk-avatar {
    width:56px;
    height:56px;
    font-size:1.25rem
  }
  .nk-welcome h1 {
    font-size:1.5rem
  }
  .nk-welcome .username {
    font-size:.8125rem
  }
  .nk-service-grid {
    gap:12px
  }
  .nk-service-card {
    padding:16px;
    gap:16px;
    min-height:155px
  }
  .nk-admin-callout {
    align-items:flex-start;
    padding:20px;
    flex-wrap:wrap
  }
  .nk-admin-callout .nk-button {
    width:100%
  }
  .nk-login-intro h1 {
    font-size:2rem
  }
  .nk-login-card {
    padding:24px
  }
  .nk-avatar-editor {
    grid-template-columns:1fr;
    gap:18px
  }
  .nk-avatar-editor form {
    grid-template-columns:1fr
  }
  .nk-avatar-editor form button {
    justify-self:start
  }
  .nk-security-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:14px
  }
  .session-item {
    align-items:flex-start;
    flex-direction:column;
    gap:12px
  }
  .admin-role-grid {
    grid-template-columns:1fr
  }
  .nk-admin-stat-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
  }
  .nk-admin-stat {
    padding:16px
  }
  .nk-admin-actions {
    grid-template-columns:1fr
  }
  .nk-identity-list {
    grid-template-columns:1fr;
    gap:18px
  }
  .nk-user-identity {
    gap:14px
  }
  .nk-user-identity .nk-avatar {
    width:56px;
    height:56px;
    font-size:1.25rem
  }
  .nk-editorial {
    padding:20px
  }
  .admin-table-wrap table,.admin-table-wrap tbody,.admin-table-wrap tr,.admin-table-wrap td {
    display:block;
    width:100%
  }
  .admin-table-wrap thead {
    position:absolute;
    width:1px;
    height:1px;
    clip:rect(0,0,0,0);
    overflow:hidden
  }
  .admin-table-wrap tr {
    padding:18px;
    border-bottom:1px solid var(--nk-border)
  }
  .admin-table-wrap td {
    padding:0;
    border:0;
    margin-bottom:12px
  }
  .admin-table-wrap td:last-child {
    margin:0
  }
  .admin-table-wrap tr:last-child {
    border:0
  }
  .admin-table-wrap .nk-empty {
    padding:20px 0
  }
  .nk-table-person {
    min-width:0
  }
  td code {
    max-width:100%;
    font-size:.75rem
  }
  .admin-search {
    gap:10px
  }
  .admin-search button {
    padding:10px 12px
  }
  .nk-role-members li {
    padding:16px;
    flex-wrap:wrap
  }
  .nk-role-members .nk-avatar {
    display:none
  }
}
.nk-profile-card .nk-identity-row>div {
  min-width:0
}
.nk-profile-card h2,.nk-profile-card .username {
  overflow-wrap:anywhere
}

/* v2: personal navigation lives in the header; only admin context keeps a side. */
.nk-shell-wide { display:block }
.nk-context-sidebar { position:sticky;top:var(--nk-header);height:calc(100svh - var(--nk-header));padding:30px 16px;border-right:1px solid var(--nk-border);background:var(--nk-bg) }
.nk-context-sidebar nav { display:grid;gap:4px }
.nk-context-sidebar a { display:flex;align-items:center;gap:12px;padding:11px 12px;min-height:44px;font-size:.875rem;border-radius:8px;color:var(--nk-text-muted);text-decoration:none }
.nk-context-sidebar a:hover { background:var(--nk-surface);color:var(--nk-text) }
.nk-context-sidebar a[aria-current=page] { color:var(--nk-accent-light);background:var(--nk-accent-soft) }
.nk-session-controls { border-top:1px solid var(--nk-border);padding-top:20px;margin-top:32px }
.nk-session-controls button { color:var(--nk-text-muted);font-weight:400 }
.nk-session-controls button:hover { background:var(--nk-error-bg);color:var(--nk-error) }
@media(max-width:1100px) { .nk-shell { display:block }.nk-context-sidebar { display:none } }

.nk-credential { max-width:900px }
.nk-renewal-status { font-weight:600;margin-top:24px;color:var(--nk-success) }
.nk-credential[data-renewal-state=soon] .nk-renewal-status { color:var(--nk-warning,#fbbf24) }
.nk-credential[data-renewal-state=urgent] .nk-renewal-status,.nk-credential[data-renewal-state=overdue] .nk-renewal-status { color:var(--nk-error) }
.nk-renewal-clock { display:flex;gap:24px;flex-wrap:wrap;margin:16px 0 }
.nk-renewal-clock[hidden] { display:none }
.nk-renewal-clock>div { display:grid;gap:4px;min-width:48px }
.nk-renewal-clock strong { font-size:clamp(1.5rem,5vw,2rem);font-variant-numeric:tabular-nums }
.nk-renewal-clock span { font-size:.8125rem;color:var(--nk-text-muted) }
.nk-credential progress { width:100%;height:6px;accent-color:var(--nk-accent) }
.nk-credential[data-renewal-state=soon] progress { accent-color:var(--nk-warning,#fbbf24) }
.nk-credential[data-renewal-state=urgent] progress,.nk-credential[data-renewal-state=overdue] progress { accent-color:var(--nk-error) }

.nk-connections .nk-connection { flex-wrap:wrap }
.nk-connections .nk-connection>div { flex:1;min-width:180px }
.nk-connections h2 { margin-bottom:6px }
.provider-logo { width:40px;height:40px;flex-shrink:0 }
.provider-identity { display:flex;align-items:center;gap:16px;margin-block:20px }
.provider-photo-placeholder { width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--nk-border);background:var(--nk-surface-raised);border-radius:50%;color:var(--nk-text-muted) }
.provider-identity p { margin:4px 0 0;color:var(--nk-text-muted) }

.provider-photo{width:44px;height:44px;object-fit:cover;border-radius:50%;flex-shrink:0}
.provider-identity>div{min-width:0;overflow-wrap:anywhere}
.provider-photo-placeholder{flex-shrink:0}
