/* FLUX Control — system-side sections (AI models, Feedback, Safety, Controls, Security, Workspace, Activity,
   Storage, Backup). Builds on admin.css + the theme tokens in style.css. Every class here is prefixed ncs-. */
:root, [data-theme="dark"] {
  --ncs-amber: #fbbf24;
  --ncs-ok-soft: rgba(74, 222, 128, 0.13);
  --ncs-warn-soft: rgba(251, 191, 36, 0.13);
  --ncs-panel: rgba(12, 26, 54, 0.55);
}
[data-theme="light"] {
  --ncs-amber: #b45309;
  --ncs-ok-soft: rgba(22, 163, 74, 0.1);
  --ncs-warn-soft: rgba(217, 119, 6, 0.1);
  --ncs-panel: rgba(232, 240, 253, 0.72);
}

/* elements with [hidden] stay hidden even when a class gives them a display */
:is([data-section="models"], [data-section="feedback"], [data-section="safety"], [data-section="controls"], [data-section="security"],
  [data-section="workspace"], [data-section="activity"], [data-section="storage"], [data-section="backup"]) [hidden] { display: none !important; }

/* ---------- shared bits ---------- */
.ncs-ic { display: inline-flex; width: 16px; height: 16px; flex: none; }
.ncs-ic svg { width: 100%; height: 100%; }
.ncs-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: ncsSpin .7s linear infinite; flex: none; display: inline-block; box-sizing: border-box; }
@keyframes ncsSpin { to { transform: rotate(360deg); } }
@keyframes ncsBlink { 50% { opacity: .35; } }
@keyframes ncsPop { from { opacity: 0; transform: translateY(4px) scale(.98); } }
.ncs-ch { min-width: 0; flex: 1 1 240px; }
.ncs-ch-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ncs-stack { display: flex; flex-direction: column; gap: 18px; }
.ncs-sub { color: var(--dim); font-size: 12.5px; line-height: 1.45; }
.ncs-lead { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.ncs-m0 { margin: 0; }
.ncs-mt { margin-top: 14px; }
.ncs-mb { margin-bottom: 14px; }
.ncs-indent { margin: 2px 0 0; }
.ncs-indent .nc-link { text-align: left; }
.ncs-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ncs-loading { opacity: .5; pointer-events: none; transition: opacity .2s; }
.nc-card.ncs-dim > :not(.nc-card-head) { opacity: .6; transition: opacity .2s; }
.nc-card.ncs-dim:hover > :not(.nc-card-head), .nc-card.ncs-dim:focus-within > :not(.nc-card-head) { opacity: 1; }
.ncs-fb-body.ncs-dim { opacity: .55; }
.ncs-fb-body.ncs-dim:hover, .ncs-fb-body.ncs-dim:focus-within { opacity: 1; }
.ncs-subhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 20px 0 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--dim); }
.ncs-fb-body > .ncs-subhead:first-child { margin-top: 16px; }
.ncs-code { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 12px; padding: 1px 6px; border-radius: 6px; background: var(--surface-2); color: var(--text); white-space: nowrap; }
.ncs-foot { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; font-size: 13px; color: var(--muted); }
.ncs-okline { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); }
.ncs-okline .ncs-ic { color: var(--ok); }
.ncs-more { align-self: center; margin-top: 8px; }
.ncs-danger-text { color: var(--danger); }
.ncs-danger-text:hover:not(:disabled) { border-color: var(--danger); background: var(--danger-soft); }
.ncs-small-link { font-size: 13px; }
.ncs-count { font-size: 12px; color: var(--dim); font-variant-numeric: tabular-nums; }

.ncs-ibtn {
  width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--border); background: transparent; color: var(--muted);
  display: inline-grid; place-items: center; cursor: pointer; padding: 0; flex: none; transition: color .15s, border-color .15s, background .15s;
}
.ncs-ibtn svg { width: 16px; height: 16px; }
.ncs-ibtn:hover:not(:disabled) { color: var(--text); border-color: var(--accent); background: var(--accent-soft); }
.ncs-ibtn.danger:hover:not(:disabled) { color: var(--danger); border-color: var(--danger); background: var(--danger-soft); }
.ncs-ibtn:disabled { opacity: .3; cursor: default; }

.ncs-setting { display: flex; align-items: center; gap: 14px; padding: 12px 0; }
.ncs-setting + .ncs-setting { border-top: 1px solid var(--border); }
.ncs-setting-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ncs-setting-text b { font-size: 14.5px; font-weight: 650; }
.ncs-setting-text small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.ncs-settings { margin-top: 10px; }

.ncs-note {
  display: flex; gap: 10px; align-items: flex-start; padding: 11px 13px; border-radius: 12px; font-size: 13.5px; line-height: 1.5; color: var(--text);
  background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); margin-top: 12px; animation: ncsPop .25s ease both;
}
.ncs-note:first-child { margin-top: 0; }
.ncs-note > div { min-width: 0; }
.ncs-note > .ncs-ic { margin-top: 2px; color: var(--accent); }
.ncs-note.warn { background: var(--ncs-warn-soft); border-color: rgba(245, 158, 11, .35); }
.ncs-note.warn > .ncs-ic { color: var(--ncs-amber); }
.ncs-note.danger { background: var(--danger-soft); border-color: color-mix(in srgb, var(--danger) 38%, transparent); }
.ncs-note.danger > .ncs-ic { color: var(--danger); }
.ncs-note.ok { background: var(--ncs-ok-soft); border-color: color-mix(in srgb, var(--ok) 35%, transparent); }
.ncs-note.ok > .ncs-ic { color: var(--ok); }
.nc-section > .ncs-note { margin-top: 0; }

.ncs-help { margin: 0 0 14px; padding-left: 18px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.ncs-list-plain { margin: 4px 0 0; padding-left: 18px; font-size: 13px; line-height: 1.6; }

/* progress */
.ncs-progress { position: relative; height: 8px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.ncs-progress > i { position: absolute; top: 0; bottom: 0; left: 0; width: 0; border-radius: inherit; background: var(--grad); box-shadow: 0 0 14px rgba(59, 130, 246, .55); transition: width .35s ease; overflow: hidden; }
.ncs-progress > i::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent); animation: ncsShine 1.4s linear infinite; }
.ncs-progress.indet > i { width: 35% !important; animation: ncsIndet 1.3s ease-in-out infinite; }
@keyframes ncsShine { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
@keyframes ncsIndet { from { left: -35%; } to { left: 100%; } }
.ncs-run { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.ncs-test-head { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 600; flex-wrap: wrap; }
.ncs-test-head .nc-spacer { min-width: 4px; }

/* save bar (dirty state) */
.ncs-savebar { display: flex; align-items: center; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--border-strong); flex-wrap: wrap; }
.ncs-dirty { font-size: 12.5px; color: var(--dim); display: inline-flex; align-items: center; gap: 7px; }
.ncs-is-dirty .ncs-dirty { color: var(--ncs-amber); font-weight: 600; }
.ncs-is-dirty .ncs-dirty::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--ncs-amber); box-shadow: 0 0 0 3px rgba(245, 158, 11, .2); animation: ncsBlink 1.6s ease-in-out infinite; }
.nc-card.ncs-is-dirty, .ncs-zone.ncs-is-dirty { box-shadow: 0 0 0 1px rgba(245, 158, 11, .45), 0 18px 50px -30px rgba(0, 0, 20, .7); }

/* ---------- AI models ---------- */
.nc-card > .ncs-note + .ncs-keys, .nc-card > .ncs-note + .ncs-own-steps { margin-top: 12px; }
.ncs-keys { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.ncs-key {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 12px; padding: 15px; border-radius: 14px;
  background: var(--ncs-panel); border: 1px solid var(--border); transition: border-color .2s, box-shadow .2s, transform .2s;
}
.ncs-key:hover { border-color: var(--border-strong); }
.ncs-key.on { border-color: color-mix(in srgb, var(--ok) 32%, var(--border)); }
.ncs-key-top { display: flex; align-items: flex-start; gap: 11px; }
.ncs-key-mark { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-weight: 800; color: #fff; flex: none; font-size: 16px; box-shadow: 0 6px 18px -8px rgba(0, 0, 0, .6); }
.ncs-key[data-provider="groq"] .ncs-key-mark { background: linear-gradient(135deg, #f55036, #ff8a3d); }
.ncs-key[data-provider="gemini"] .ncs-key-mark { background: linear-gradient(135deg, #4285f4, #9b72cb 60%, #d96570); }
.ncs-key[data-provider="openrouter"] .ncs-key-mark { background: linear-gradient(135deg, #0a3cff, #4fd2ff); }
.ncs-key-name { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ncs-key-name b { font-size: 15px; }
.ncs-key-name small { color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.ncs-key-line { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--muted); }
.ncs-key-line .nc-mono { color: var(--text); letter-spacing: .04em; }
.ncs-key-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.ncs-key-edit { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.ncs-key.checking { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ncs-key.checking::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--grad); box-shadow: 0 0 14px rgba(34, 211, 238, .9);
  animation: ncsScan 1.1s ease-in-out infinite alternate;
}
@keyframes ncsScan { from { top: 0; } to { top: calc(100% - 2px); } }
.ncs-getkey { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--accent); text-decoration: none; font-weight: 600; border-radius: 6px; }
.ncs-getkey:hover { text-decoration: underline; text-underline-offset: 3px; }
.ncs-getkey .ncs-ic { width: 13px; height: 13px; }

.ncs-order { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ncs-order-row { display: flex; align-items: center; gap: 12px; padding: 9px 10px 9px 12px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); animation: ncsPop .25s ease both; flex-wrap: wrap; }
.ncs-order-n { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12.5px; font-weight: 800; color: #fff; background: var(--grad); flex: none; box-shadow: var(--glow); }
.ncs-order-row:nth-child(n + 4) .ncs-order-n { background: var(--surface-2); color: var(--muted); box-shadow: none; }
.ncs-order-main { flex: 1 1 140px; min-width: 0; display: flex; flex-direction: column; }
.ncs-order-main b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ncs-order-main small { font-size: 12px; color: var(--dim); }
.ncs-order-btns { display: flex; gap: 4px; margin-left: auto; }
.ncs-add { display: flex; gap: 8px; margin-top: 12px; }
.ncs-add select { flex: 1; min-width: 0; }
.ncs-add .nc-btn { height: 40px; }

.ncs-cool { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; font-size: 13px; }
.ncs-coolchip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; background: rgba(34, 211, 238, .1); border: 1px solid rgba(34, 211, 238, .32); font-size: 13px; font-weight: 600; animation: ncsPop .25s ease both; }
.ncs-coolchip small { color: var(--muted); font-weight: 500; font-variant-numeric: tabular-nums; }
.ncs-cool-dot { width: 8px; height: 8px; border-radius: 50%; background: #22d3ee; box-shadow: 0 0 8px #22d3ee; animation: ncsBlink 1.4s infinite; }

.ncs-mtools { display: flex; gap: 10px 14px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.ncs-mtools .nc-search { max-width: 360px; }
.ncs-mgroup + .ncs-mgroup { margin-top: 20px; }
.ncs-mgroup-head { display: flex; align-items: center; gap: 6px 12px; padding: 0 2px 8px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.ncs-mgroup-head h4 { margin: 0; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--text); font-weight: 750; }
.ncs-mgroup-head .nc-link { font-size: 12.5px; }
.ncs-mlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); column-gap: 22px; }
.ncs-mrow { display: flex; align-items: center; gap: 10px; padding: 9px 2px; border-bottom: 1px solid var(--border); min-width: 0; }
.ncs-mrow .nc-switch:disabled { cursor: not-allowed; opacity: .75; }
.ncs-mname { flex: 1; min-width: 0; display: flex; flex-direction: column; transition: opacity .2s; }
.ncs-mname span { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncs-mname small { font-size: 11.5px; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncs-mrow.off .ncs-mname { opacity: .45; }
.ncs-mrow.off .ncs-mname span { text-decoration: line-through; text-decoration-color: var(--dim); }
.ncs-vision { font-size: 14px; line-height: 1; cursor: help; }
.ncs-mres { display: inline-flex; }
.ncs-mres:empty { display: none; }
.ncs-mres.testing { display: inline-flex; }
.ncs-mres.testing::before {
  content: 'testing'; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; color: var(--muted); display: inline-flex; align-items: center;
  background: linear-gradient(90deg, var(--surface-2) 0%, color-mix(in srgb, var(--accent) 30%, var(--surface-2)) 50%, var(--surface-2) 100%); background-size: 200% 100%; animation: ncsSlide 1.2s linear infinite;
}
@keyframes ncsSlide { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.ncs-test { margin-bottom: 16px; padding: 14px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; animation: ncsPop .25s ease both; }
.ncs-test-sum { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ncs-test-done { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--ok); color: #fff; flex: none; }
.ncs-test-done svg { width: 13px; height: 13px; stroke-width: 3; }

/* "Your own AI" (a model on the owner's PC) */
.ncs-own-status { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: var(--ncs-panel); border: 1px solid var(--border); }
.ncs-ownai.on .ncs-own-status { border-color: color-mix(in srgb, var(--ok) 35%, var(--border)); }
.ncs-own-mark { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: none; color: #fff; background: linear-gradient(135deg, #0a3cff, #1e90ff 55%, #4fd2ff); box-shadow: 0 8px 24px -10px rgba(30, 144, 255, .8); }
.ncs-own-mark svg { width: 22px; height: 22px; }
.ncs-ownai:not(.on) .ncs-own-mark { background: var(--surface-2); color: var(--dim); box-shadow: none; }
.ncs-own-line { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ncs-own-line b { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 15px; }
.ncs-own-line small { color: var(--muted); font-size: 12.5px; overflow-wrap: anywhere; }
.ncs-own-steps { margin-top: 14px; }
.ncs-own-form { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, .8fr); }
.ncs-own-form .nc-input:disabled, .ncs-support-grid .nc-input:disabled { opacity: .6; cursor: not-allowed; }

/* Workspace → Support */
.ncs-support-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 14px 22px; align-items: start; }
.ncs-support-sw .ncs-setting { padding-top: 22px; }
.ncs-glow { animation: ncsGlow 1.8s ease-out 1; }
@keyframes ncsGlow { 30% { box-shadow: 0 0 0 3px rgba(30, 144, 255, .5), 0 0 50px -10px rgba(79, 210, 255, .8); } }

/* ---------- Feedback ---------- */
.ncs-mood { display: flex; gap: 3px; height: 10px; border-radius: 99px; overflow: hidden; animation: ncsGrowX .8s cubic-bezier(.2, .8, .2, 1) both; transform-origin: left; }
.ncs-mood i, .ncs-split i { display: block; min-width: 0; }
.ncs-mood i.up, .ncs-split i.up { background: linear-gradient(90deg, #10b981, #4ade80); }
.ncs-mood i.down, .ncs-split i.down { background: linear-gradient(90deg, #fb7185, #ef4444); }
@keyframes ncsGrowX { from { transform: scaleX(0); } }
.ncs-splits { display: flex; flex-direction: column; gap: 14px; }
.ncs-split-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; font-size: 13.5px; margin-bottom: 6px; }
.ncs-split-label { display: flex; align-items: baseline; gap: 6px; min-width: 0; overflow: hidden; }
.ncs-split-label b { font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncs-split-label small { color: var(--dim); font-size: 12px; white-space: nowrap; }
.ncs-emoji { font-size: 15px; }
.ncs-split-nums { display: flex; gap: 10px; font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 12.5px; color: var(--muted); flex: none; }
.ncs-split-nums b { color: var(--text); min-width: 36px; text-align: right; }
.ncs-split-nums b.good { color: var(--ok); }
.ncs-split-nums b.bad { color: var(--danger); }
.ncs-split { display: flex; gap: 2px; height: 9px; border-radius: 99px; overflow: hidden; animation: ncsGrowX .7s cubic-bezier(.2, .8, .2, 1) both; transform-origin: left; }
.ncs-fblist { display: flex; flex-direction: column; gap: 8px; }
.ncs-fbitem {
  display: flex; gap: 12px; align-items: flex-start; width: 100%; box-sizing: border-box; padding: 12px; border-radius: 12px; border: 1px solid var(--border);
  background: var(--ncs-panel); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color .15s, transform .15s, background .15s; animation: ncsPop .25s ease both;
}
.ncs-fbitem:hover { border-color: var(--accent); transform: translateY(-1px); background: var(--hover); }
.ncs-fbitem:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ncs-fb-vote { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 16px; flex: none; }
.ncs-fb-vote.up { background: var(--ncs-ok-soft); }
.ncs-fb-vote.down { background: var(--danger-soft); }
.ncs-fb-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.ncs-fb-text { font-size: 13.5px; line-height: 1.5; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
.ncs-fb-comment { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; color: var(--text); padding: 8px 10px; border-radius: 10px; background: var(--accent-soft); font-weight: 500; line-height: 1.45; word-break: break-word; }
.ncs-fb-comment .ncs-ic { color: var(--accent); margin-top: 2px; width: 14px; height: 14px; }
.ncs-fb-meta { display: flex; flex-wrap: wrap; gap: 3px 12px; font-size: 12px; color: var(--dim); }
.ncs-fb-meta b { color: var(--text); font-weight: 650; }
.ncs-fb-go { color: var(--dim); align-self: center; display: inline-flex; width: 18px; height: 18px; flex: none; transition: transform .15s, color .15s; }
.ncs-fb-go svg { width: 100%; height: 100%; }
.ncs-fbitem:hover .ncs-fb-go { color: var(--accent); transform: translateX(2px); }

/* ---------- Safety ---------- */
.ncs-hero { display: flex; align-items: center; gap: 18px; padding: 22px; position: relative; overflow: hidden; flex-wrap: wrap; transition: box-shadow .3s; }
.ncs-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s; background: radial-gradient(600px 220px at 0% 0%, rgba(79, 210, 255, .14), transparent 70%), radial-gradient(500px 200px at 100% 100%, rgba(10, 60, 255, .14), transparent 70%); }
.ncs-hero.on::before { opacity: 1; }
.ncs-hero.on { background: linear-gradient(var(--glass-strong, var(--surface)), var(--glass-strong, var(--surface))) padding-box, var(--neon, var(--border)) border-box; box-shadow: 0 18px 60px -30px rgba(59, 130, 246, .8); }
.ncs-hero-icon { position: relative; width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; background: var(--surface-2); color: var(--dim); flex: none; transition: background .3s, color .3s, box-shadow .3s; }
.ncs-hero-icon svg { width: 30px; height: 30px; }
.ncs-hero.on .ncs-hero-icon { background: var(--grad); color: #fff; box-shadow: var(--glow), 0 0 40px -8px rgba(34, 211, 238, .65); }
.ncs-hero-text { position: relative; flex: 1 1 200px; min-width: 0; }
.ncs-hero-text h2 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.ncs-hero-state { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.45; }
.nc-switch.ncs-bigswitch { transform: scale(1.35); margin: 0 12px; }

.ncs-radios { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.ncs-radio {
  position: relative; display: flex; gap: 11px; align-items: flex-start; padding: 13px 40px 13px 13px; border-radius: 13px; border: 1px solid var(--border-strong);
  background: var(--ncs-panel); cursor: pointer; transition: border-color .15s, box-shadow .15s, background .15s;
}
.ncs-radio input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ncs-radio:hover { border-color: var(--accent); }
.ncs-radio::after { content: ''; position: absolute; top: 13px; right: 13px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--border-strong); box-sizing: border-box; transition: border-color .15s, background .15s; }
.ncs-radio:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.ncs-radio:has(input:checked)::after { border-color: var(--accent); background: radial-gradient(circle, var(--accent) 0 4px, transparent 4.5px); }
.ncs-radio:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.ncs-radio.danger:has(input:checked) { border-color: var(--danger); background: var(--danger-soft); box-shadow: inset 0 0 0 1px var(--danger); }
.ncs-radio.danger:has(input:checked)::after { border-color: var(--danger); background: radial-gradient(circle, var(--danger) 0 4px, transparent 4.5px); }
.ncs-radio-emoji { font-size: 20px; line-height: 1.2; }
.ncs-radio-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ncs-radio-text b { font-size: 14px; }
.ncs-radio-text small { color: var(--muted); font-size: 12.5px; line-height: 1.45; }

.ncs-words { display: flex; flex-direction: column; gap: 6px; }
.ncs-chips {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 46px; padding: 7px; box-sizing: border-box; border-radius: 12px; border: 1px solid var(--border-strong);
  background: var(--bg); cursor: text; transition: border-color .15s, box-shadow .15s; max-height: 260px; overflow-y: auto;
}
.ncs-chips:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ncs-wchip {
  display: inline-flex; align-items: center; gap: 2px; height: 28px; padding: 0 3px 0 10px; border-radius: 999px; max-width: 100%;
  background: var(--danger-soft); color: var(--text); font-size: 12.5px; font-weight: 600; font-family: 'JetBrains Mono', ui-monospace, monospace; animation: ncsPop .2s ease both;
  border: 1px solid color-mix(in srgb, var(--danger) 25%, transparent);
}
.ncs-wchip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ncs-wchip.wild { background: rgba(79, 210, 255, .14); border-color: rgba(79, 210, 255, .38); }
.ncs-wchip button { width: 22px; height: 22px; border: 0; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; display: grid; place-items: center; padding: 0; flex: none; }
.ncs-wchip button:hover { background: var(--danger-soft); color: var(--danger); }
.ncs-wchip button svg { width: 13px; height: 13px; }
.ncs-chip-input { flex: 1; min-width: 150px; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 14px; padding: 4px 6px; outline: none; }
.ncs-chip-input:focus-visible { outline: none; }
.ncs-words-ta { min-height: 160px; }
.ncs-words-foot { display: flex; justify-content: flex-end; font-size: 13px; }
.ncs-tester { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.ncs-test-out { font-size: 13.5px; font-weight: 600; min-height: 20px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ncs-test-out span { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ncs-test-out.pass { color: var(--ok); }
.ncs-test-out.block { color: var(--danger); }
.ncs-test-out.flag { color: var(--ncs-amber); }

.ncs-flags { display: flex; flex-direction: column; gap: 10px; }
.ncs-flag { position: relative; padding: 13px 14px 12px 18px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); overflow: hidden; animation: ncsPop .3s ease both; }
.ncs-flag::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--danger); box-shadow: 0 0 12px var(--danger); }
.ncs-flag.flag::before { background: var(--ncs-amber); box-shadow: 0 0 12px rgba(251, 191, 36, .6); }
.ncs-flag-top { display: flex; align-items: center; gap: 10px; }
.ncs-flag-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ncs-flag-who b { font-size: 14px; }
.ncs-flag-who small { color: var(--dim); font-size: 12px; }
.ncs-flag-text { margin: 10px 0; font-size: 14px; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
mark.ncs-hit { background: var(--danger-soft); color: var(--danger); font-weight: 700; border-radius: 4px; padding: 0 3px; box-shadow: 0 0 0 1px color-mix(in srgb, var(--danger) 40%, transparent); }
.ncs-flag.flag mark.ncs-hit { background: var(--ncs-warn-soft); color: var(--ncs-amber); box-shadow: 0 0 0 1px rgba(245, 158, 11, .4); }
.ncs-flag-foot { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; font-size: 12.5px; }
.ncs-flag-foot .nc-link { font-size: 13px; font-weight: 600; }

/* ---------- Controls ---------- */
.ncs-banner {
  display: flex; align-items: center; gap: 16px; padding: 16px 20px; border-radius: 16px; border: 1px solid var(--border);
  background: var(--glass-strong, var(--surface)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: background .3s, border-color .3s;
}
.ncs-banner b { display: block; font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.ncs-banner span { color: var(--muted); font-size: 13.5px; }
.ncs-banner-dot { width: 14px; height: 14px; border-radius: 50%; flex: none; position: relative; margin: 0 4px; }
.ncs-banner-dot::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid currentColor; animation: ncsRingOut 1.8s ease-out infinite; }
@keyframes ncsRingOut { from { transform: scale(.55); opacity: .8; } to { transform: scale(1.5); opacity: 0; } }
.ncs-banner.ok { border-color: color-mix(in srgb, var(--ok) 40%, transparent); }
.ncs-banner.ok .ncs-banner-dot { background: var(--ok); color: var(--ok); box-shadow: 0 0 14px var(--ok); }
.ncs-banner.warn { border-color: rgba(245, 158, 11, .45); background: linear-gradient(var(--ncs-warn-soft), var(--ncs-warn-soft)), var(--glass-strong, var(--surface)); }
.ncs-banner.warn .ncs-banner-dot { background: var(--ncs-amber); color: var(--ncs-amber); box-shadow: 0 0 14px var(--ncs-amber); }
.ncs-banner.lock { border-color: var(--danger); background: linear-gradient(var(--danger-soft), var(--danger-soft)), var(--glass-strong, var(--surface)); }
.ncs-banner.lock .ncs-banner-dot { background: var(--danger); color: var(--danger); box-shadow: 0 0 16px var(--danger); }

.ncs-tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.ncs-tile {
  position: relative; padding: 16px; border-radius: 16px; border: 1px solid transparent; display: flex; flex-direction: column; gap: 8px; overflow: hidden;
  background: linear-gradient(var(--ncs-panel), var(--ncs-panel)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--ok) 45%, transparent), rgba(59, 130, 246, .2)) border-box;
  transition: transform .2s, box-shadow .2s, background .3s;
}
.ncs-tile:hover { transform: translateY(-2px); box-shadow: 0 14px 36px -20px rgba(59, 130, 246, .65); }
.ncs-tile.stop {
  background:
    repeating-linear-gradient(135deg, rgba(248, 113, 113, .09) 0 10px, transparent 10px 20px) padding-box,
    linear-gradient(var(--ncs-panel), var(--ncs-panel)) padding-box,
    linear-gradient(135deg, rgba(248, 113, 113, .85), rgba(251, 146, 60, .55)) border-box;
  box-shadow: 0 0 0 1px rgba(248, 113, 113, .08), 0 14px 36px -22px rgba(248, 113, 113, .8);
}
.ncs-tile-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ncs-tile-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); transition: background .3s, color .3s; }
.ncs-tile-ic svg { width: 21px; height: 21px; }
.ncs-tile.stop .ncs-tile-ic { background: var(--danger-soft); color: var(--danger); }
.ncs-tile h4 { margin: 6px 0 0; font-size: 16px; font-weight: 750; letter-spacing: -.01em; }
.ncs-state { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
.ncs-state i { width: 8px; height: 8px; border-radius: 50%; background: var(--dim); }
.ncs-state.run { color: var(--ok); }
.ncs-state.run i { background: var(--ok); box-shadow: 0 0 10px var(--ok); animation: ncsBlink 2.2s ease-in-out infinite; }
.ncs-state.stop { color: var(--danger); }
.ncs-state.stop i { background: var(--danger); box-shadow: 0 0 10px var(--danger); }
.ncs-tile-desc { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.45; }

.ncs-zone {
  position: relative; border-radius: 16px; padding: 18px; border: 1px solid transparent; overflow: hidden; min-width: 0; box-sizing: border-box;
  background: linear-gradient(var(--glass-strong, var(--surface)), var(--glass-strong, var(--surface))) padding-box, linear-gradient(135deg, rgba(248, 113, 113, .6), rgba(251, 146, 60, .35), rgba(248, 113, 113, .15)) border-box;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 18px 50px -30px rgba(0, 0, 20, .7);
}
.ncs-zone.active {
  background: linear-gradient(rgba(248, 113, 113, .12), rgba(248, 113, 113, .04)) padding-box, linear-gradient(var(--glass-strong, var(--surface)), var(--glass-strong, var(--surface))) padding-box, linear-gradient(135deg, #f87171, #fb923c) border-box;
  animation: ncsAlarm 2.2s ease-in-out infinite;
}
@keyframes ncsAlarm { 50% { box-shadow: 0 0 0 4px rgba(248, 113, 113, .14), 0 0 44px -10px rgba(248, 113, 113, .75); } }
.ncs-zone-head { display: flex; align-items: center; gap: 14px; }
.ncs-zone-ic { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--danger-soft); color: var(--danger); flex: none; }
.ncs-zone-ic svg { width: 22px; height: 22px; }
.ncs-zone-title { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ncs-zone-title h3 { margin: 0; font-size: 16px; font-weight: 750; }
.ncs-state.idle { color: var(--dim); }
.ncs-zone-text { margin: 12px 0 14px; color: var(--muted); font-size: 13.5px; line-height: 1.55; }
.ncs-lock-prev { margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--ncs-panel); border: 1px dashed var(--border-strong); font-size: 13px; line-height: 1.5; }
.ncs-caution { height: 7px; margin: -18px -18px 16px; background: repeating-linear-gradient(-45deg, #f59e0b 0 12px, #111827 12px 24px); opacity: .9; }
.ncs-panic {
  display: flex; align-items: center; gap: 14px; width: 100%; padding: 16px 18px; border-radius: 14px; border: 0; cursor: pointer; font: inherit; text-align: left; color: #fff;
  background: linear-gradient(135deg, #ef4444, #b91c1c); box-shadow: 0 10px 30px -12px rgba(239, 68, 68, .85), inset 0 1px 0 rgba(255, 255, 255, .22);
  transition: transform .12s, filter .15s, box-shadow .2s; font-weight: 700;
}
.ncs-panic:hover:not(:disabled) { filter: brightness(1.08); box-shadow: 0 14px 44px -10px rgba(239, 68, 68, 1), inset 0 1px 0 rgba(255, 255, 255, .25); }
.ncs-panic:active:not(:disabled) { transform: scale(.985); }
.ncs-panic:disabled { opacity: .75; cursor: wait; }
.ncs-panic:focus-visible { outline: 2px solid var(--danger); outline-offset: 3px; }
.ncs-panic-ic { width: 44px; height: 44px; border-radius: 12px; background: rgba(255, 255, 255, .16); display: grid; place-items: center; flex: none; }
.ncs-panic-ic svg { width: 22px; height: 22px; }
.ncs-panic-text b { display: block; font-size: 16px; font-weight: 800; }
.ncs-panic-text small { opacity: .88; font-size: 13px; font-weight: 500; }

/* ---------- Security ---------- */
.ncs-score { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding-bottom: 16px; margin-bottom: 4px; border-bottom: 1px solid var(--border); }
.ncs-score-text { flex: 1 1 240px; min-width: 0; }
.ncs-score-text h3 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.ncs-score-text p { margin: 4px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.ncs-ring { position: relative; width: 84px; height: 84px; flex: none; }
.ncs-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); filter: drop-shadow(0 0 10px rgba(59, 130, 246, .45)); }
.ncs-ring-track { fill: none; stroke: var(--surface-2); stroke-width: 7; }
.ncs-ring-fill { fill: none; stroke: url(#ncsRingGrad); stroke-width: 7; stroke-linecap: round; stroke-dashoffset: var(--off); animation: ncsRingIn 1.1s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes ncsRingIn { from { stroke-dashoffset: var(--len); } }
.ncs-ring > span { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; }
.ncs-ring b { font-size: 24px; font-weight: 800; }
.ncs-ring small { font-size: 11px; color: var(--dim); margin-top: 3px; }
.ncs-checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); column-gap: 24px; }
.ncs-checkitem { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.ncs-check-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--ncs-ok-soft); color: var(--ok); }
.ncs-check-ic svg { width: 17px; height: 17px; }
.ncs-checkitem.part .ncs-check-ic { background: var(--ncs-warn-soft); color: var(--ncs-amber); }
.ncs-checkitem.off .ncs-check-ic { background: var(--danger-soft); color: var(--danger); }
.ncs-checkitem.local .ncs-check-ic { background: var(--surface-2); color: var(--muted); }
.ncs-checkitem-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ncs-checkitem-main b { font-size: 14px; font-weight: 650; }
.ncs-checkitem-main small { color: var(--muted); font-size: 12.5px; line-height: 1.45; word-break: break-word; }
.ncs-checkitem .nc-chip { margin-top: 2px; }
.ncs-steps { margin: 12px 0 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 13.5px; line-height: 1.55; color: var(--text); }
.ncs-steps li::marker { color: var(--accent); font-weight: 800; }
.ncs-codeblock { position: relative; margin-top: 8px; border-radius: 10px; background: var(--bg); border: 1px solid var(--border-strong); }
.ncs-codeblock pre { margin: 0; padding: 10px 12px; overflow-x: auto; font-size: 12.5px; line-height: 1.6; padding-right: 70px; }
.ncs-codeblock .nc-btn { position: absolute; top: 7px; right: 7px; }
.ncs-ret td { vertical-align: top; }
.ncs-ret td b { display: block; font-size: 14px; }
.ncs-ret td small { color: var(--dim); font-size: 12.5px; }
.ncs-ret td:last-child, .ncs-ret th:last-child { text-align: right; white-space: nowrap; }
.ncs-lastrun { margin: 8px 0 0; }

/* ---------- Workspace ---------- */
.ncs-swatches { display: flex; flex-wrap: wrap; gap: 10px; padding: 2px; }
.ncs-swatch { width: 34px; height: 34px; border-radius: 50%; border: 0; cursor: pointer; padding: 0; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); transition: transform .15s, box-shadow .15s; }
.ncs-swatch.def { background: var(--grad); }
.ncs-swatch:hover { transform: scale(1.1); }
.ncs-swatch.on { box-shadow: 0 0 0 3px var(--bg), 0 0 0 5px var(--text); transform: scale(1.05); }
.ncs-swatch:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.ncs-brand-prev { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); flex-wrap: wrap; font-weight: 400; color: var(--text); }
.ncs-brand-prev b { font-size: 17px; font-weight: 800; letter-spacing: -.01em; min-width: 0; overflow-wrap: anywhere; }
.ncs-brand-prev small { width: 100%; color: var(--muted); font-size: 13px; }
.ncs-brand-dot { width: 22px; height: 22px; border-radius: 7px; background: var(--grad); flex: none; box-shadow: var(--glow); }
.ncs-annc-prev { display: flex; gap: 10px; align-items: center; margin-top: 12px; padding: 10px 14px; border-radius: 12px; background: var(--grad); color: #fff; font-size: 13.5px; font-weight: 600; box-shadow: var(--glow); overflow-wrap: anywhere; animation: ncsPop .25s ease both; }
.ncs-annc-prev.empty { background: var(--ncs-panel); color: var(--dim); box-shadow: none; border: 1px dashed var(--border-strong); font-weight: 500; }
.ncs-annc-prev > span:first-child { display: inline-flex; width: 18px; height: 18px; flex: none; }
.ncs-annc-prev svg { width: 18px; height: 18px; }
.ncs-rules { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 13px; }
.ncs-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 14px 18px; margin-top: 16px; }
.ncs-legal { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.ncs-legal-cell { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); min-width: 0; }
.ncs-legal-cell > span { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--dim); }
.ncs-legal-cell > b { font-size: 18px; font-weight: 800; }
.ncs-legal-cell > small { color: var(--muted); font-size: 12.5px; }
.ncs-legal-cell.links { gap: 6px; }
.ncs-legal-cell > b.ncs-legal-off { color: var(--muted); font-size: 16px; }
/* Terms requirement switch */
.ncs-req {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin: 4px 0 0; border-radius: 16px; border: 1px solid var(--border); background: var(--ncs-panel);
  transition: border-color .3s, box-shadow .3s, background .3s;
}
.ncs-req.on {
  border-color: transparent; box-shadow: 0 16px 44px -28px rgba(59, 130, 246, .85);
  background: radial-gradient(420px 160px at 0% 0%, rgba(34, 211, 238, .12), transparent 70%) padding-box, linear-gradient(var(--ncs-panel), var(--ncs-panel)) padding-box, linear-gradient(var(--bg), var(--bg)) padding-box, var(--neon, var(--border)) border-box;
}
.ncs-req-ic { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; flex: none; background: var(--surface-2); color: var(--dim); transition: background .3s, color .3s, box-shadow .3s; }
.ncs-req-ic svg { width: 22px; height: 22px; }
.ncs-req.on .ncs-req-ic { background: var(--grad); color: #fff; box-shadow: var(--glow); }
.ncs-req-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ncs-req-text b { font-size: 15px; font-weight: 750; letter-spacing: -.01em; }
.ncs-req-text small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.ncs-req .nc-switch:disabled { opacity: .5; cursor: not-allowed; }
.ncs-req-state .ncs-note { margin-top: 10px; margin-bottom: 14px; }
.ncs-req-state + .ncs-note { margin-top: 0; margin-bottom: 14px; }
.ncs-bar { height: 7px; border-radius: 4px; background: var(--surface-2); overflow: hidden; margin: 6px 0 4px; }
.ncs-bar > i { display: block; height: 100%; background: var(--grad); border-radius: inherit; animation: ncsGrowX .7s cubic-bezier(.2, .8, .2, 1) both; transform-origin: left; }
.ncs-modes { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); }
.ncs-mode { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 14px; background: var(--ncs-panel); border: 1px solid var(--border); min-width: 0; transition: border-color .15s, transform .15s; animation: ncsPop .25s ease both; }
.ncs-mode:hover { border-color: var(--border-strong); }
.ncs-mode.builtin { background: transparent; border-style: dashed; animation: none; }
.ncs-mode-top { display: flex; align-items: center; gap: 10px; }
.ncs-mode-emoji { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; background: var(--surface-2); flex: none; }
.ncs-mode-name { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ncs-mode-name b { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ncs-mode-name small { color: var(--muted); font-size: 12.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ncs-mode-acts { display: flex; gap: 4px; }
.ncs-mode-prompt { margin: 0; font-size: 12.5px; color: var(--dim); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
.ncs-empty-inline { grid-column: 1 / -1; display: flex; gap: 14px; align-items: center; padding: 16px; border-radius: 14px; border: 1px dashed var(--border-strong); color: var(--muted); }
.ncs-empty-inline > span { font-size: 26px; }
.ncs-empty-inline b { display: block; color: var(--text); }
.ncs-empty-inline small { font-size: 13px; }

/* ---------- Activity ---------- */
.ncs-filters { display: flex; flex-direction: column; gap: 12px; }
.ncs-filter-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.ncs-filter-row .nc-search { min-width: 200px; }
.ncs-filter-row select { width: auto; flex: 0 1 220px; min-width: 150px; }
.ncs-log-sum { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; font-size: 13.5px; color: var(--muted); }
.ncs-log-sum b { color: var(--text); }
.ncs-logs { display: flex; flex-direction: column; }
.ncs-logday { display: flex; align-items: center; gap: 10px; margin: 20px 0 6px; font-size: 12px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; color: var(--text); }
.ncs-logday small { color: var(--dim); font-weight: 600; letter-spacing: 0; }
.ncs-logday::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--border-strong), transparent); }
.ncs-logday:first-child { margin-top: 0; }
.ncs-log { display: flex; gap: 12px; align-items: flex-start; padding: 9px 8px; border-radius: 10px; transition: background .12s; }
.ncs-log:hover { background: var(--hover); }
.ncs-log.bad { background: var(--danger-soft); box-shadow: inset 3px 0 0 var(--danger); }
.ncs-log-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex: none; background: var(--surface-2); color: var(--muted); }
.ncs-log-ic svg { width: 15px; height: 15px; }
.ncs-log-ic.good { background: var(--ncs-ok-soft); color: var(--ok); }
.ncs-log-ic.bad { background: var(--danger-soft); color: var(--danger); }
.ncs-log.bad .ncs-log-ic.bad { background: var(--danger); color: #fff; }
.ncs-log-ic.warn { background: var(--ncs-warn-soft); color: var(--ncs-amber); }
.ncs-log-ic.admin { background: var(--accent-soft); color: var(--accent); }
.ncs-log-main { flex: 1; min-width: 0; }
.ncs-log-text { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.ncs-log-text b { font-weight: 650; }
.ncs-log-sub { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 12px; color: var(--dim); margin-top: 2px; }
.ncs-ip { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11.5px; }
.ncs-ip.hot { color: var(--danger); font-weight: 700; }
.ncs-plink { background: none; border: 0; padding: 0; font: inherit; color: var(--text); font-weight: 650; cursor: pointer; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent); text-underline-offset: 3px; text-align: left; }
.ncs-plink:hover { color: var(--accent); text-decoration-color: var(--accent); }
.ncs-q { font-weight: 600; }

/* ---------- Storage ---------- */
.ncs-srows { display: flex; flex-direction: column; }
.ncs-srow { display: flex; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1px solid var(--border); }
.ncs-srow:last-child { border-bottom: 0; }
.ncs-srow-main { flex: 1; min-width: 0; }
.ncs-srow-top { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.ncs-srow-top .ncs-plink { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ncs-size { font-variant-numeric: tabular-nums; flex: none; }
.ncs-srow small { color: var(--dim); font-size: 12px; }
.ncs-checks { display: flex; flex-direction: column; gap: 10px; }
.ncs-check { display: flex; gap: 11px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 1px solid var(--border-strong); background: var(--ncs-panel); cursor: pointer; transition: border-color .15s, background .15s; }
.ncs-check:hover { border-color: var(--accent); }
.ncs-check:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.ncs-check input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--accent); margin: 2px 0 0; flex: none; cursor: pointer; }
.ncs-check-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ncs-check-text b { font-size: 14px; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.ncs-check-text small { color: var(--muted); font-size: 12.5px; line-height: 1.45; }
select.nc-input.ncs-inline-sel { width: auto; height: 30px; padding: 0 8px; font-size: 13px; margin-left: 4px; }

/* ---------- Backup ---------- */
.ncs-tip {
  display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; font-size: 13.5px; line-height: 1.5;
  background: linear-gradient(135deg, rgba(79, 210, 255, .1), rgba(10, 60, 255, .12)); border: 1px solid rgba(79, 170, 255, .3);
}
.ncs-tip > .ncs-ic { width: 20px; height: 20px; color: var(--accent); margin-top: 1px; }
.ncs-drop {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 16px; border-radius: 16px; border: 2px dashed var(--border-strong);
  text-align: center; cursor: pointer; color: var(--muted); font-size: 13.5px; transition: border-color .2s, background .2s, box-shadow .2s;
}
.ncs-drop b { color: var(--text); font-size: 15px; }
.ncs-drop u { color: var(--accent); text-underline-offset: 3px; }
.ncs-drop small { color: var(--dim); font-size: 12.5px; }
.ncs-drop-ic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); margin-bottom: 4px; transition: transform .2s; }
.ncs-drop-ic svg { width: 26px; height: 26px; }
.ncs-drop:hover, .ncs-drop.drag { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 4px var(--accent-soft), 0 0 34px -8px rgba(59, 130, 246, .6); }
.ncs-drop.drag { border-style: solid; }
.ncs-drop.drag .ncs-drop-ic, .ncs-drop:hover .ncs-drop-ic { transform: translateY(-3px); }
.ncs-drop:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.ncs-stage { display: flex; flex-direction: column; gap: 12px; }
.ncs-stage > .ncs-note { margin-top: 0; }
.ncs-file { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); }
.ncs-file > .ncs-ic { width: 22px; height: 22px; color: var(--accent); }
.ncs-file > div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ncs-file b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ncs-file small { color: var(--dim); font-size: 12px; }
.ncs-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.ncs-sum > div { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; background: var(--ncs-panel); border: 1px solid var(--border); min-width: 0; }
.ncs-sum span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--dim); }
.ncs-sum b { font-size: 16px; font-weight: 800; overflow-wrap: anywhere; }
.ncs-sum small { color: var(--muted); font-size: 12px; }
.ncs-sum-2 { width: 100%; max-width: 360px; }
.ncs-stage .ncs-subhead { margin: 6px 0 0; }
.ncs-done { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 8px 0 4px; animation: ncsPop .3s ease both; }
.ncs-done h4 { margin: 0; font-size: 17px; font-weight: 800; }
.ncs-done-ic { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--ok); color: #fff; box-shadow: 0 0 30px -4px color-mix(in srgb, var(--ok) 70%, transparent); }
.ncs-done-ic svg { width: 26px; height: 26px; stroke-width: 2.6; }
.ncs-done-ic.warn { background: var(--ncs-amber); box-shadow: 0 0 30px -4px rgba(251, 191, 36, .7); }

/* ---------- light theme touches ---------- */
[data-theme="light"] .ncs-caution { background: repeating-linear-gradient(-45deg, #f59e0b 0 12px, #1f2937 12px 24px); }
[data-theme="light"] .ncs-coolchip { background: rgba(6, 182, 212, .1); border-color: rgba(6, 182, 212, .35); }
[data-theme="light"] .ncs-swatch { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
[data-theme="light"] .ncs-swatch.on { box-shadow: 0 0 0 3px var(--bg), 0 0 0 5px var(--text); }

/* ---------- phones ---------- */
@media (max-width: 560px) {
  .ncs-hero { padding: 16px; gap: 14px; }
  .ncs-hero-icon { width: 46px; height: 46px; border-radius: 13px; }
  .ncs-hero-icon svg { width: 24px; height: 24px; }
  .nc-switch.ncs-bigswitch { transform: scale(1.2); margin: 0 6px 0 auto; }
  .ncs-hero-text { flex-basis: calc(100% - 140px); }
  .ncs-hero-text h2 { font-size: 18px; }
  .ncs-mlist { grid-template-columns: 1fr; }
  .ncs-mtools .nc-search { max-width: none; }
  .ncs-checklist { grid-template-columns: 1fr; }
  .ncs-filter-row > * { flex: 1 1 100%; }
  .ncs-filter-row select { flex: 1 1 100%; }
  .ncs-filter-row .nc-tabs { flex: 0 1 auto; }
  .ncs-banner { padding: 14px 16px; gap: 12px; }
  .ncs-zone { padding: 16px; }
  .ncs-caution { margin: -16px -16px 14px; }
  .ncs-order-row { gap: 9px; padding: 8px; }
  .ncs-order-btns { margin-left: 35px; }
  .ncs-split-top { flex-wrap: wrap; }
  .ncs-fb-go { display: none; }
  .ncs-ring { width: 72px; height: 72px; }
  .ncs-ret td:last-child { white-space: normal; }
  .ncs-req { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px 12px; padding: 12px 14px; }
  .ncs-req-ic { width: 38px; height: 38px; border-radius: 11px; }
  .ncs-req-text { display: contents; }
  .ncs-req-text b { grid-column: 2; grid-row: 1; font-size: 14px; }
  .ncs-req-text small { grid-column: 1 / -1; grid-row: 2; }
  .ncs-req .nc-switch { grid-column: 3; grid-row: 1; }
  .ncs-own-status { padding: 10px 12px; }
}
@media (max-width: 760px) {
  .ncs-own-form, .ncs-support-grid { grid-template-columns: minmax(0, 1fr); }
  .ncs-support-sw .ncs-setting { padding-top: 4px; }
}

/* Very narrow phones: a long card-head button (e.g. "Ask everyone to accept again") wraps instead of spilling out. */
@media (max-width: 360px) {
  .ncs-ch-right { max-width: 100%; }
  .ncs-ch-right .nc-btn { white-space: normal; height: auto; min-height: 32px; padding-top: 6px; padding-bottom: 6px; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  [class*="ncs-"], [class*="ncs-"]::before, [class*="ncs-"]::after, mark.ncs-hit { animation: none !important; transition: none !important; }
  .ncs-progress.indet > i { left: 0; width: 100% !important; opacity: .6; }
}
