/* theme-shell.css: the editor's frame (sidebar, header, phone top bar, drawer, base controls). Loaded last. */
body { background: var(--nj-bg); color: var(--nj-text); font-family: var(--nj-font-body); }
.sidebar { background: linear-gradient(180deg, #151923, #0b0e14); position: relative; }
.sidebar::after { content: ''; position: absolute; top: 0; bottom: 0; right: 0; width: 1px; background: linear-gradient(180deg, transparent, var(--nj-line) 12%, var(--nj-line) 88%, transparent); pointer-events: none; }
.logo { background: transparent; border-bottom: 0; position: relative; font: 500 19px/1.3 var(--nj-font-display); letter-spacing: .4px; color: var(--nj-gold-light); }
.logo::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--nj-hairline); opacity: .6; }
#sidebar-user-badge > div { border-bottom-color: var(--nj-line-soft) !important; font-family: var(--nj-font-body) !important; }
#sidebar-user-badge span:nth-child(2) { color: var(--nj-gold) !important; text-transform: none !important; font-size: 11px !important; }
#editor-logout-btn { border-color: var(--nj-line) !important; color: var(--nj-muted) !important; border-radius: 0 !important; }
.nav-menu { scrollbar-width: thin; scrollbar-color: var(--nj-line) transparent; }
.nav-item { color: var(--nj-muted); border-left: 0; position: relative; transition: color .15s; }
.nav-item:hover { background: linear-gradient(90deg, transparent, var(--nj-gold-soft)); color: var(--nj-text); }
.nav-item.active { background: linear-gradient(90deg, transparent, rgba(201, 178, 124, .13) 40%, transparent); color: var(--nj-gold-light); font-weight: 400; }
.nav-item.active::before, .nav-item.active::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background: var(--nj-hairline); }
.nav-item.active::before { top: 0; } .nav-item.active::after { bottom: 0; }
.nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; color: var(--nj-gold); opacity: .8; }
.nav-item.active .nav-icon { color: var(--nj-gold-light); opacity: 1; }
.nav-icon svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.nav-category { color: var(--nj-dim); font: italic 12px var(--nj-font-display); text-transform: none; letter-spacing: 0; }
.header { background: linear-gradient(180deg, #151923, var(--nj-bg)); border-bottom: 1px solid var(--nj-line-soft); padding: 12px 28px; }
.header-title { color: var(--nj-gold-light); font: 500 23px/1.3 var(--nj-font-display); letter-spacing: .3px; }
button.btn-primary { background: linear-gradient(180deg, #b9a26c, #8d7a4e); color: #14110a; border-radius: 1px; box-shadow: inset 0 1px 0 rgba(255, 245, 215, .35); }
button.btn-primary:hover { background: linear-gradient(180deg, #cdb67e, #9c8857); }
button.btn-secondary, button.btn-ghost { background: transparent; color: var(--nj-text); border: 1px solid var(--nj-line); border-radius: 1px; }
button.btn-secondary:hover, button.btn-ghost:hover { background: var(--nj-gold-soft); color: var(--nj-gold-light); }
button.btn-danger { background: var(--nj-ember); border-radius: 1px; }
button.btn-danger:hover { background: #a65140; }
button.btn-success { background: #55704c; border-radius: 1px; }
@media (max-width: 959px) {
  body.nj-mobile .nj-topbar { background: linear-gradient(180deg, #171b25, #0f1219); border-bottom: 0; }
  body.nj-mobile .nj-topbar::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--nj-hairline); opacity: .6; }
  body.nj-mobile .nj-topbar .nj-topbar-title { color: var(--nj-gold-light); font: 500 19px/1.3 var(--nj-font-display); }
  body.nj-mobile .nj-topbar button { background: transparent; color: var(--nj-gold-light); border-radius: 0; }
  body.nj-mobile .nj-topbar button:active { background: var(--nj-gold-soft); }
  body.nj-mobile .nj-presence-btn .nj-presence-count { background: transparent; color: var(--nj-gold-light); box-shadow: inset 0 0 0 1px var(--nj-line); }
  body.nj-mobile .nj-presence-pop { background: #141823; border: 0; border-radius: 0; box-shadow: 0 10px 30px rgba(0, 0, 0, .55), inset 0 0 0 1px var(--nj-line-soft); }
  body.nj-mobile .logo { min-height: var(--nj-topbar-h); }
  body.nj-mobile .nav-item { color: var(--nj-text); }
  body.nj-mobile .nj-drawer-close { background: transparent; color: var(--nj-gold-light); border-radius: 0; }
  body.nj-mobile .nj-drawer-close:active { background: var(--nj-gold-soft); }
  body.nj-mobile .nj-drawer-footer { background: #0b0e14; border-top: 1px solid var(--nj-line-soft); }
  body.nj-mobile .nj-drawer-footer button { background: transparent; border: 1px solid var(--nj-line); border-radius: 1px; color: var(--nj-text); }
  body.nj-mobile .nj-backdrop { background: rgba(5, 6, 10, 0.68); }
}

/* Dashboard panels: open sections under a fading rule, the same language as the Playtest page. */
#section-dashboard { background: var(--nj-smoke), var(--nj-bg) !important; }
#section-dashboard h2 { display: none; }
.nj-panel { padding: 4px 2px 10px; min-width: 0; }
.nj-panel-title { font: 500 17px/1.3 var(--nj-font-display); color: var(--nj-gold-light); padding-bottom: 7px; margin: 0 0 10px; position: relative; }
.nj-panel-title::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--nj-rule); }
.nj-stat-label { font-size: 11.5px; color: var(--nj-muted); }
.nj-stat-value { font: 400 24px/1.25 var(--nj-font-display); color: var(--nj-text-strong); font-variant-numeric: lining-nums tabular-nums; overflow-wrap: anywhere; }
.task-row { border-bottom-color: var(--nj-line-soft); }
.dash-grid { gap: 18px 36px; }
#section-dashboard .dash-card-head .nj-panel-title { margin: 0; }
#section-dashboard button { border-radius: 1px !important; }

/* Dashboard layout */
.dash-server { position: relative; padding: 12px 0; margin-bottom: 26px; background: linear-gradient(90deg, transparent, rgba(38, 43, 55, .5) 12%, rgba(38, 43, 55, .5) 88%, transparent); }
.dash-server::before, .dash-server::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background: var(--nj-hairline); }
.dash-server::before { top: 0; } .dash-server::after { bottom: 0; }
.dash-server-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 34px; padding: 0 18px; }
.dash-server .dash-stats { display: flex; flex-wrap: wrap; gap: 8px 34px; }
.dash-server .dash-actions { margin-left: auto; }
.dash-server .dash-actions > button { background: transparent !important; border: 1px solid rgba(201, 116, 92, .5) !important; color: var(--nj-ember-light) !important; box-shadow: none !important; min-height: 34px; flex: 0 0 auto; }
#dash-glance { margin-bottom: 22px; }
.dash-glance-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px 24px; margin-bottom: 12px; }
.dash-finding, .dash-stuck, .dash-quiet { font-size: 13px; color: var(--nj-text); padding: 8px 12px; margin-bottom: 6px; background: linear-gradient(90deg, var(--nj-surface-2), transparent); }
.dash-finding b, .dash-stuck b { color: var(--nj-text-strong); font-weight: 500; margin-right: 6px; }
.dash-finding.red { background: linear-gradient(90deg, var(--nj-ember-soft), transparent); }
.dash-quiet { color: var(--nj-dim); font: italic 13px var(--nj-font-display); background: none; padding-left: 2px; }
.dash-open { margin-top: 8px; background: transparent; border: 1px solid var(--nj-line); color: var(--nj-gold-light); }
.dash-open:hover { background: var(--nj-gold-soft); }
.dash-main { align-items: start; margin-bottom: 22px; }
.dash-main .nj-panel { margin-bottom: 14px; }
.dash-more { margin: 16px 0; border-top: 1px solid var(--nj-line-soft); }
.dash-more > summary { cursor: pointer; padding: 12px 2px; color: var(--nj-gold); font: 500 15px var(--nj-font-display); min-height: 44px; }
@media (max-width: 959px) {
  .dash-glance-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dash-server .dash-actions { margin-left: 0; width: 100%; }
  .dash-server .dash-actions > button { flex: 1 1 auto; min-height: 44px; }
  .dash-server-row { padding: 0 12px; }
  .nj-stat-value { font-size: 21px; }
}

/* Base controls: a form field with no color of its own would otherwise be browser white. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea { background: #151923; color: var(--nj-text); border: 1px solid var(--nj-line-soft); color-scheme: dark; }
input::placeholder, textarea::placeholder { color: var(--nj-dim); }
input:focus, select:focus, textarea:focus { border-color: var(--nj-gold); outline: none; }
.empty-state-icon { display: none; }
.empty-state { color: var(--nj-dim); font: italic 15px var(--nj-font-display); }