/*
 * ndevr-kanban.css — OWL Kanban board widget (Trello-style, themed to OWL).
 * Published + version-busted by the OWL server (DirectServerAction::ensureWebAssets). All selectors
 * are scoped under .nk-root so the widget stays self-contained and never leaks styles into the page.
 * Theming: colors consume the shared --nd-* tokens (/shared/css/theme.css) with the original dark literals as var() fallbacks.
 */
/* Breathing room from the page's left/right edge (the board otherwise sits flush against the window). */
.ndevr-kanban{display:block;margin-left:18px;margin-right:18px}
@media(max-width:600px){.ndevr-kanban{margin-left:10px;margin-right:10px}}
.nk-root{ --nk-gold-dim:#caa44a;
  --nk-shadow:0 6px 20px rgba(0,0,0,.45); --nk-radius:10px;
  background:var(--nd-surface, #1b1e24); color:var(--nd-text, #e8eaed);
  font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  border:1px solid var(--nd-border, #353b46); border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column; min-height:360px;
  /* height is set inline by fitHeight() so the board fills the window and lists scroll internally */
}
.nk-root *{box-sizing:border-box}
.nk-root a{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));text-decoration:none}
/* Neutralize host-theme bleed onto our controls (themes style bare button/input/textarea/select). */
.nk-root button,.nk-scrim button{text-transform:none;letter-spacing:normal;font-family:inherit;line-height:normal}
.nk-root input,.nk-root textarea,.nk-root select,.nk-scrim input,.nk-scrim textarea,.nk-scrim select{
  box-sizing:border-box;text-transform:none;letter-spacing:normal;max-width:100%;margin:0}

/* ---- context strip (product tie-in) ---- */
.nk-ctx{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:9px 16px;
  background:linear-gradient(90deg,rgba(255,182,59,.10),rgba(255,182,59,0) 60%);
  border-bottom:1px solid var(--nd-border, #353b46);font-size:12.5px;color:var(--nd-muted, #9aa3b2);
}
.nk-ctx .nk-boardname{font-size:15px;font-weight:700;color:var(--nd-text, #e8eaed)}
.nk-ctx .nk-boardpick{-webkit-appearance:none;appearance:none;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  color:var(--nd-text, #e8eaed);font:700 14px/1.2 inherit;padding:7px 30px 7px 12px;border-radius:8px;cursor:pointer;max-width:280px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%239aa3b2' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;box-shadow:none;text-transform:none}
.nk-ctx .nk-boardpick:focus{outline:none;border-color:var(--nk-gold-dim)}
.nk-ctx b{color:var(--nd-text, #e8eaed)}
.nk-auto{display:inline-flex;align-items:center;gap:6px;color:var(--nk-gold-dim);
  border:1px dashed var(--nk-gold-dim);border-radius:999px;padding:3px 10px;font-size:11px}
.nk-ctx .nk-filter{margin-left:auto;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;
  color:var(--nd-text, #e8eaed);padding:6px 10px;font:inherit;min-width:150px}
.nk-ctx .nk-filter:focus{outline:none;border-color:var(--nk-gold-dim)}
.nk-ctx .nui-btn{padding:6px 11px;font-size:12.5px}

/* ---- board ---- */
.nk-board{flex:1;display:flex;gap:14px;padding:16px;overflow-x:auto;overflow-y:hidden;align-items:flex-start}
.nk-col{width:288px;flex:0 0 auto;background:var(--nd-surface-2, #23272f);border:1px solid var(--nd-border, #353b46);
  border-radius:var(--nk-radius);display:flex;flex-direction:column;max-height:100%}
.nk-col-head{display:flex;align-items:center;gap:8px;padding:11px 12px 9px;cursor:grab}
/* Force our own box model on bare <input>/<button> so flex + sizing hold regardless of inherited styles. */
.nk-col-head .nk-cname{flex:1 1 auto;min-width:0;width:auto;font-weight:700;font-size:13.5px;background:transparent;
  border:0;box-shadow:none;color:var(--nd-text, #e8eaed);font-family:inherit;padding:2px 4px;margin:0;border-radius:5px;
  -webkit-appearance:none;appearance:none;box-sizing:border-box}
.nk-col-head .nk-cname:focus{outline:none;background:var(--nd-border, #353b46)}
/* margin-left:auto pushes the right-hand group over even if the theme breaks the title's flex-grow. */
.nk-col-head .nk-relflag{margin-left:auto;flex:0 0 auto;font-size:10px;color:var(--nd-accent-contrast,#1b1e24);background:var(--nd-ok,#8ff0b6);border-radius:4px;padding:1px 6px;font-weight:800}
.nk-col-head .nk-count{margin-left:auto;flex:0 0 auto;color:var(--nd-muted, #9aa3b2);font-size:12px;background:var(--nd-line, #2a2f39);
  border-radius:999px;padding:2px 8px;line-height:1.4}
.nk-col-head .nk-cdel{flex:0 0 auto;-webkit-appearance:none;appearance:none;background:transparent !important;border:0 !important;
  box-shadow:none !important;color:var(--nd-muted, #9aa3b2);cursor:pointer;font:400 18px/1 inherit !important;opacity:0;
  padding:0 2px !important;margin:0 !important;min-width:0 !important;width:auto !important;height:auto !important;
  border-radius:0 !important;text-transform:none}
.nk-col:hover .nk-cdel{opacity:.7}
.nk-col-head .nk-cdel:hover{color:var(--nd-error,#ff9a9a);opacity:1}
.nk-cards{list-style:none;margin:0;padding:4px 8px 8px;overflow-y:auto;flex:1;min-height:14px;
  display:flex;flex-direction:column;gap:8px}
.nk-col-foot{padding:6px 8px 10px}
/* "Manual add" toggle in the context bar (default off → ✨ Describe is the primary way to add cards). */
.nk-ctx .nk-manualadd-l{display:inline-flex;align-items:center;gap:6px;color:var(--nd-muted, #9aa3b2);font-size:12px;cursor:pointer;user-select:none}
.nk-ctx .nk-manualadd-l input{accent-color:var(--nd-accent, #ffb63b);cursor:pointer;margin:0}
/* Per-list footer hint shown when manual add is OFF — launches the QUAIL describe workflow. */
.nk-addcard-hint{width:100%;text-align:left;background:transparent;border:none;color:var(--nk-gold-dim);
  cursor:pointer;font:inherit;padding:8px 6px;border-radius:6px}
.nk-addcard-hint:hover{background:var(--nd-line, #2a2f39);color:var(--nd-accent-text, var(--nd-accent, #ffb63b))}
.nk-addcard{width:100%;text-align:left;background:transparent;border:none;color:var(--nd-muted, #9aa3b2);
  padding:7px 8px;border-radius:7px;cursor:pointer;font:inherit}
.nk-addcard:hover{background:var(--nd-line, #2a2f39);color:var(--nd-text, #e8eaed)}
.nk-addcol{width:288px;flex:0 0 auto;background:rgba(255,255,255,.03);border:1px dashed var(--nd-border, #353b46);
  border-radius:var(--nk-radius);color:var(--nd-muted, #9aa3b2);padding:12px;cursor:pointer;text-align:left;font:inherit}
.nk-addcol:hover{color:var(--nd-text, #e8eaed);border-color:var(--nk-gold-dim)}

/* ---- card ---- */
.nk-card{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:9px 10px;
  cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.nk-card:hover{border-color:var(--nk-gold-dim)}
/* Drag grip: a full-width bar at the top edge — the ONLY drag-start area, so the card body stays free for
   touch-scrolling/panning the board on mobile. Full-bleed to the card's top corners; touch-action:none so a
   drag from here doesn't fight the browser's scroll. */
.nk-card-grip{display:flex;align-items:center;justify-content:center;height:18px;margin:-9px -10px 8px;
  border-radius:7px 7px 0 0;background:rgba(255,255,255,.035);color:var(--nd-muted, #9aa3b2);cursor:grab;
  touch-action:none;opacity:.85;transition:background .12s ease,color .12s ease,opacity .12s ease}
.nk-card-grip:hover{background:rgba(255,255,255,.08);color:var(--nd-text, #e8eaed);opacity:1}
.nk-card-grip:active{cursor:grabbing}
.nk-card-grip svg{display:block;fill:currentColor}
/* When a cover follows the grip, sit them flush (no gap, no double top-rounding on the cover). */
.nk-card-grip.on-cover{margin-bottom:0}
.nk-card-grip.on-cover + .nk-cover{margin-top:0;border-radius:0}
.nk-card .nk-labels{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px}
.nk-label{height:8px;width:34px;border-radius:4px}
.nk-card .nk-ctitle{font-size:13.5px;line-height:1.35;white-space:pre-wrap;word-break:break-word}
.nk-card .nk-meta{display:flex;align-items:center;gap:10px;margin-top:8px;color:var(--nd-muted, #9aa3b2);font-size:11.5px;flex-wrap:wrap}
.nk-card .nk-m{display:inline-flex;align-items:center;gap:4px}
.nk-badge-ver{background:rgba(255,182,59,.14);color:var(--nd-accent-text, var(--nd-accent, #ffb63b));border:1px solid var(--nk-gold-dim);border-radius:5px;padding:1px 6px;font-weight:600}
.nk-badge-prod{background:rgba(126,200,255,.14);color:#7ec8ff;border:1px solid rgba(126,200,255,.4);border-radius:5px;padding:1px 6px;font-weight:600;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* product/module inherited from the board (card has none of its own) — dimmed + dashed so it reads as a fallback */
.nk-badge-prod.nk-badge-inherit{opacity:.6;border-style:dashed}
/* QUAIL-bird icon on the "Describe…" buttons that launch the card drafter. The buttons are laid out as
   flex rows so the icon sits to the LEFT of the label even when a global rule forces img{display:block}
   (which would otherwise push the text onto its own line, dropping the icon above it). */
.nk-describe,.nk-addcard-hint{display:inline-flex;align-items:center;gap:6px}
.nk-quail-ic{flex:0 0 auto;width:15px;height:15px;border-radius:3px;object-fit:cover}
/* bug-fix workflow: fix committed + waiting on a build / shipped in build vX */
.nk-badge-wait{background:rgba(214,168,255,.14);color:#d6a8ff;border:1px solid rgba(214,168,255,.4);border-radius:5px;padding:1px 6px;font-weight:600}
.nk-badge-fixed{background:rgba(154,255,196,.14);color:#9affc4;border:1px solid rgba(154,255,196,.4);border-radius:5px;padding:1px 6px;font-weight:600}
.nk-wait-l{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--nd-text, #e8eaed);padding:6px 0}
/* Board context-bar product/module tie-in */
.nk-ctx .nk-tielbl{display:inline-flex;align-items:center;color:var(--nd-muted, #9aa3b2);font-size:12px}
.nk-ctx .nk-tiepick{-webkit-appearance:none;appearance:none;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  color:var(--nd-text, #e8eaed);font:inherit;padding:6px 26px 6px 10px;border-radius:8px;cursor:pointer;max-width:220px}
.nk-ctx .nk-tiepick:focus{outline:none;border-color:var(--nk-gold-dim)}
.nk-tieview{color:var(--nd-muted, #9aa3b2)}
/* Upload percent dial (OWL-style ring) */
.nk-dial-scrim{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;background:var(--nd-overlay, rgba(12,14,18,.62));backdrop-filter:blur(2px)}
.nk-dial{position:relative;width:120px;height:120px}
.nk-dial-svg{width:120px;height:120px;transform:rotate(-90deg)}
.nk-dial-bg{fill:none;stroke:rgba(255,255,255,.12);stroke-width:9}
.nk-dial-fg{fill:none;stroke:var(--nd-accent, #ffb63b);stroke-width:9;stroke-linecap:round;transition:stroke-dashoffset .18s ease}
.nk-dial-pct{position:absolute;inset:0;display:grid;place-items:center;font:700 24px/1 inherit;color:var(--nd-text, #e8eaed)}
.nk-dial-label{color:var(--nd-text, #e8eaed);font-size:13px;max-width:70vw;text-align:center;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.nk-due{border-radius:5px;padding:1px 6px}
.nk-due.soon{background:rgba(255,182,59,.16);color:var(--nd-accent-text, var(--nd-accent, #ffb63b))}
.nk-due.over{background:rgba(255,99,99,.18);color:var(--nd-error,#ff9a9a)}
.nk-card .nk-cav{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:9.5px;font-weight:700;color:var(--nd-accent-contrast,#1b1e24);margin-left:auto;background-size:cover;background-position:center}
.nk-card .nk-cav.has-img{color:transparent}
.nk-ncomments{color:var(--nd-muted, #9aa3b2);font-size:11px}

/* card cover image (the resource's IconPreview) */
.nk-card .nk-cover{margin:-9px -10px 8px;border-radius:7px 7px 0 0;overflow:hidden;max-height:120px}
.nk-card .nk-cover img{width:100%;display:block;object-fit:cover;max-height:120px}

/* attachments strip (in the card modal) */
.nk-scrim .nk-mcover{margin:0 0 14px;border-radius:8px;overflow:hidden;max-height:220px}
.nk-scrim .nk-mcover img{width:100%;display:block;object-fit:cover;max-height:220px}
.nk-atts{display:flex;flex-direction:column;gap:6px}
.nk-att{display:flex;align-items:center;gap:8px;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:7px 10px;cursor:pointer}
.nk-att:hover{border-color:var(--nk-gold-dim)}
.nk-att-ic{font-size:15px}
.nk-att-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nk-att-size{color:var(--nd-muted, #9aa3b2);font-size:11px}
.nk-att-empty{color:var(--nd-muted, #9aa3b2);font-size:12px}
.nk-attrow{display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
.nk-comments-note{color:var(--nd-muted, #9aa3b2);font-size:12.5px;background:var(--nd-line, #2a2f39);border:1px dashed var(--nd-border, #353b46);border-radius:8px;padding:8px 10px}
/* reusable comment thread (ndevr-comments.js), rendered inside the card modal */
.nk-comments-host{min-height:40px}
/* When the real chat widget is embedded here it needs a definite height to fill + scroll internally.
   Sized to fill most of the viewport (the modal scrolls as a whole) so the thread gets real room instead
   of a cramped 380px box; capped so it never runs past a tall screen. */
.nk-comments-host.nk-comments-chat{height:min(70vh,760px)}
.nk-comments-host .ndevr-chat.nchat-embedded{height:100%}
.ncm{display:flex;flex-direction:column;gap:8px}
.ncm-list{display:flex;flex-direction:column;gap:8px;max-height:260px;overflow-y:auto}
.ncm-note{color:var(--nd-muted, #9aa3b2);font-size:12.5px;padding:6px 2px}
.ncm-msg{display:flex;gap:10px}
.ncm-av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--nd-accent-contrast,#1b1e24);flex:0 0 auto}
.ncm-bub{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:7px 10px;font-size:13px;flex:1;white-space:pre-wrap;word-break:break-word}
.ncm-who{color:var(--nk-gold-dim);font-weight:600;font-size:12px;margin-right:6px}
.ncm-when{color:var(--nd-muted, #9aa3b2);font-size:11px}
.ncm-txt{margin-top:2px}
.ncm-txt .nchat-img{display:block;max-width:100%;max-height:320px;width:auto;height:auto;border-radius:8px;margin:4px 0}
/* Markdown in the lightweight comment thread — same `nchat-*` classes the shared renderer emits, so AI/Trello
   comment bodies format like chat (the .ncm-bub bubble already has white-space:pre-wrap for line breaks). */
.ncm-txt strong{font-weight:700}
.ncm-txt em{font-style:italic}
.ncm-txt del{opacity:.65}
.ncm-txt a{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));text-decoration:underline}
.ncm-txt code{background:rgba(255,255,255,.10);padding:1px 5px;border-radius:5px;font-family: var(--nd-font-mono, ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);font-size:.92em}
.ncm-txt .nchat-h{font-weight:700;line-height:1.25}
.ncm-txt .nchat-h1{font-size:1.3em}
.ncm-txt .nchat-h2{font-size:1.16em}
.ncm-txt .nchat-h3{font-size:1.06em}
.ncm-txt .nchat-h4,.ncm-txt .nchat-h5,.ncm-txt .nchat-h6{font-size:1em;opacity:.85}
.ncm-txt .nchat-mention{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));font-weight:600}
.ncm-txt .nchat-pre{display:block;white-space:pre;overflow-x:auto;background:rgba(255,255,255,.06);border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:8px 10px;margin:4px 0;font-family: var(--nd-font-mono, ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);font-size:.9em;line-height:1.45}
.ncm-txt .nchat-quote{display:block;border-left:3px solid var(--nd-accent-text, var(--nd-accent, #ffb63b));padding:1px 0 1px 10px;margin:2px 0;color:var(--nd-muted, #9aa3b2)}
.ncm-txt .nchat-hr{display:block;height:0;border-top:1px solid var(--nd-border, #353b46);margin:8px 0}
/* automation system line (plaintext OWLSYS messages) — centered, muted, no bubble */
.ncm-sys{align-self:center;text-align:center;color:var(--nd-muted, #9aa3b2);font-size:12px;font-style:italic;border:1px dashed var(--nd-border, #353b46);border-radius:10px;padding:4px 10px;margin:2px auto;max-width:90%}
.ncm-sys .ncm-when{margin-left:6px}
.ncm-list.ncm-dropping{outline:2px dashed var(--nk-gold-dim);outline-offset:-4px;border-radius:8px}
.ncm-attach{display:flex;align-items:center;gap:9px;margin-top:3px;text-decoration:none;background:var(--nd-border, #353b46);
  border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:7px 9px;color:var(--nd-text, #e8eaed)}
.ncm-attach:hover{border-color:var(--nk-gold-dim)}
.ncm-attach-ic{font-size:18px;flex:0 0 auto}
.ncm-attach-meta{display:flex;flex-direction:column;min-width:0;flex:1}
.ncm-attach-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ncm-attach-sub{font-size:11px;color:var(--nd-muted, #9aa3b2)}
.ncm-attach-open{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));font-weight:700;flex:0 0 auto}
.ncm-attach-btn{flex:0 0 auto;padding:6px 9px;font-size:14px}
.ncm-compose{display:flex;gap:8px;margin-top:4px}
.ncm-input{flex:1;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;color:var(--nd-text, #e8eaed);padding:8px 10px;font:inherit}
.ncm-send{flex:0 0 auto}

/* SortableJS helpers */
.nk-drag-ghost{opacity:.35}
.nk-drag-chosen{box-shadow:var(--nk-shadow)}
.nk-col.nk-drag-ghost{opacity:.4}

/* ---- state ---- */
.nk-empty,.nk-loading{padding:40px 16px;text-align:center;color:var(--nd-muted, #9aa3b2)}
.nk-ctx .nk-bdel:hover{border-color:#ff6363;color:#ff6363;background:rgba(255,99,99,.08)}
.nk-empty .nk-newboard-empty{margin-left:8px}

/* ---- card modal ---- */
/* The modal lives on document.body (outside .nk-root) so it re-declares the palette here — CSS custom
   properties only cascade from the element they're defined on. */
.nk-scrim{ --nk-gold-dim:#caa44a;
  --nk-shadow:0 6px 20px rgba(0,0,0,.45);
  position:fixed;inset:0;background:var(--nd-overlay, rgba(0,0,0,.6));display:none;align-items:flex-start;justify-content:center;padding:48px 16px;z-index:9000;overflow:auto}
.nk-scrim.open{display:flex}
.nk-modal{width:640px;max-width:100%;background:var(--nd-surface-2, #23272f);border:1px solid var(--nd-border, #353b46);border-radius:14px;
  box-shadow:var(--nk-shadow);padding:20px 22px 24px;color:var(--nd-text, #e8eaed);
  font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}
.nk-modal h2{margin:0 6px 2px 0;font-size:18px;display:flex;align-items:flex-start;gap:10px}
.nk-modal .nk-mtitle{flex:1;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;
  color:var(--nd-text, #e8eaed);font:600 17px/1.3 inherit;padding:7px 10px;resize:none;overflow:hidden}
.nk-modal .nk-sub{color:var(--nd-muted, #9aa3b2);font-size:12px;margin:8px 0 16px}
.nk-modal .nk-row{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.nk-modal .nk-field label{display:block;color:var(--nd-muted, #9aa3b2);font-size:11px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.nk-modal .nk-field input,.nk-modal .nk-field select{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  border-radius:8px;color:var(--nd-text, #e8eaed);padding:7px 9px;font:inherit;min-width:140px}
/* ---- custom assignee picker (avatars in a native <select> aren't possible) ---- */
.nk-asg{position:relative;min-width:170px}
.nk-asg-btn{display:flex;align-items:center;gap:8px;width:100%;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  border-radius:8px;color:var(--nd-text, #e8eaed);padding:5px 9px;font:inherit;cursor:pointer;text-align:left}
.nk-asg-btn:hover{border-color:var(--nk-gold-dim)}
.nk-asg-btn:disabled{cursor:default;opacity:.85}
.nk-asg.is-ro .nk-asg-btn{cursor:default}
.nk-asg-caret{margin-left:auto;color:var(--nd-muted, #9aa3b2);font-size:11px}
.nk-asg-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nk-asg-menu{position:absolute;z-index:60;top:calc(100% + 4px);left:0;right:0;background:var(--nd-surface-2, #23272f);
  border:1px solid var(--nd-border, #353b46);border-radius:8px;box-shadow:var(--nk-shadow);padding:4px;max-height:260px;overflow:auto}
.nk-asg-menu[hidden]{display:none}
.nk-asg-opt{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;cursor:pointer}
.nk-asg-opt:hover{background:var(--nd-line, #2a2f39)}
.nk-asg-opt.sel{background:var(--nd-border, #353b46)}
.nk-asg-av{width:22px;height:22px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;font-size:9.5px;
  font-weight:700;color:var(--nd-accent-contrast,#1b1e24);background-size:cover;background-position:center}
.nk-asg-av.is-quail{background:var(--nd-border, #353b46);color:var(--nd-text, #e8eaed)}
.nk-asg-av.has-img{color:transparent}
.nk-asg-av-none{width:22px;height:22px;flex:0 0 auto;border-radius:50%;border:1px dashed var(--nd-border, #353b46);
  display:grid;place-items:center;background:transparent}
.nk-modal .nk-desc{width:100%;min-height:84px;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  border-radius:8px;color:var(--nd-text, #e8eaed);padding:10px;font:inherit;resize:vertical}
/* Rendered (markdown) description view — same formatting rules as chat messages. */
.nk-desc-wrap{margin:0}
.nk-desc-view{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;color:var(--nd-text, #e8eaed);
  padding:10px;min-height:44px;white-space:pre-wrap;word-break:break-word;font-size:14px;line-height:1.5}
.nk-desc-wrap.editable .nk-desc-view{cursor:text}
.nk-desc-wrap.editable .nk-desc-view:hover{border-color:var(--nk-gold-dim)}
.nk-desc-view.empty{color:var(--nd-muted, #9aa3b2);font-style:italic}
.nk-desc-view strong{font-weight:700}
.nk-desc-view em{font-style:italic}
.nk-desc-view code{background:rgba(255,255,255,.10);padding:1px 5px;border-radius:5px;
  font-family: var(--nd-font-mono, ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);font-size:.92em}
.nk-desc-view a{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));text-decoration:underline}
.nk-desc-view .nchat-h{font-weight:700;line-height:1.25}
.nk-desc-view .nchat-h1{font-size:1.3em}
.nk-desc-view .nchat-h2{font-size:1.16em}
.nk-desc-view .nchat-h3{font-size:1.06em}
.nk-desc-view .nchat-h4,.nk-desc-view .nchat-h5,.nk-desc-view .nchat-h6{font-size:1em;opacity:.85}
.nk-desc-view .nchat-mention{color:var(--nd-accent-text, var(--nd-accent, #ffb63b));font-weight:600}
.nk-desc-view .nchat-pre{display:block;white-space:pre;overflow-x:auto;background:rgba(255,255,255,.06);border:1px solid var(--nd-border, #353b46);
  border-radius:8px;padding:8px 10px;margin:4px 0;font-family: var(--nd-font-mono, ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);font-size:.9em;line-height:1.45}
.nk-desc-view .nchat-quote{display:block;border-left:3px solid var(--nd-accent-text, var(--nd-accent, #ffb63b));padding:1px 0 1px 10px;margin:2px 0;color:var(--nd-muted, #9aa3b2)}
.nk-desc-view .nchat-hr{display:block;height:0;border-top:1px solid var(--nd-border, #353b46);margin:8px 0}
.nk-desc-view del{opacity:.65}
.nk-desc-view .nchat-img{max-width:100%;max-height:320px;border-radius:8px;display:block;margin:6px 0;border:1px solid var(--nd-border, #353b46)}
.nk-desc-imglink{display:inline-flex;align-items:center;gap:5px;background:var(--nd-border, #353b46);border:1px solid var(--nd-border, #353b46);
  border-radius:6px;padding:2px 8px;margin:2px 0;font-size:13px;text-decoration:none !important}
.nk-chipset{display:flex;gap:6px;flex-wrap:wrap}
.nk-lblchip{border:1px solid var(--nd-border, #353b46);border-radius:999px;padding:4px 10px;font-size:12px;cursor:pointer;user-select:none;opacity:.45}
.nk-lblchip.on{opacity:1}
.nk-modal .nk-sec{font-size:12px;color:var(--nd-muted, #9aa3b2);text-transform:uppercase;letter-spacing:.5px;margin:16px 0 8px}
/* Full reset so inherited <button> styling (bg / border / radius / shadow / padding) can't bleed
   into our icon close button. */
.nk-scrim .nk-modal h2 .nk-close{margin:-2px -4px 0 auto;-webkit-appearance:none;appearance:none;
  background:transparent !important;border:0 !important;box-shadow:none !important;outline:none;
  color:var(--nd-muted, #9aa3b2);font:400 22px/1 inherit;text-transform:none;letter-spacing:normal;cursor:pointer;
  padding:4px !important;width:32px;height:32px;min-width:0;border-radius:8px !important;flex:0 0 auto;
  display:grid;place-items:center;box-sizing:border-box}
.nk-scrim .nk-modal h2 .nk-close:hover{background:var(--nd-line, #2a2f39) !important;color:var(--nd-text, #e8eaed)}
.nk-modal .nk-mfoot{display:flex;gap:10px;align-items:center;margin-top:18px;border-top:1px solid var(--nd-border, #353b46);padding-top:14px}
.nk-modal .nk-mdel{margin-left:auto;background:transparent;border:1px solid var(--nd-border, #353b46);color:var(--nd-error,#ff9a9a);border-radius:8px;padding:6px 11px;cursor:pointer;font:inherit}
.nk-modal .nk-mdel:hover{background:rgba(255,99,99,.12)}

/* ---- "Describe issue / feature" QUAIL drafter ------------------------------------------------- */
.nk-dmodal{width:680px;display:flex;flex-direction:column;max-height:calc(100vh - 96px)}
.nk-dmodal h2 span{flex:1}
.nk-dmodal .nk-sub{margin:8px 0 14px}
/* Bug / Feature segmented toggle (sliding pill — mirrors the auth widget's Sign in / Create account). */
.nk-seg{position:relative;display:flex;gap:4px;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  border-radius:10px;padding:4px;margin-bottom:14px;flex:0 0 auto}
.nk-seg .nk-seg-pill{position:absolute;top:4px;bottom:4px;left:0;width:0;border-radius:7px;
  background:var(--nd-border, #353b46);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 1px 4px rgba(0,0,0,.35);
  z-index:0;pointer-events:none;transition:transform .26s cubic-bezier(.4,0,.2,1),width .26s cubic-bezier(.4,0,.2,1)}
.nk-seg .nk-seg-tab{position:relative;z-index:1;flex:1 1 0;text-align:center;cursor:pointer;
  background:transparent;border:0;border-radius:7px;padding:9px 10px;color:var(--nd-muted, #9aa3b2);
  font:600 14px/1.4 inherit;transition:color .2s ease}
.nk-seg .nk-seg-tab.is-active,.nk-seg .nk-seg-tab:hover{color:var(--nd-text, #e8eaed)}
@media (prefers-reduced-motion:reduce){.nk-seg .nk-seg-pill{transition:none}}
/* Chat host — gives the embedded ndevr-qa panel a definite height to scroll inside. */
.nk-dchat{flex:0 0 auto;display:flex;flex-direction:column;height:44vh;min-height:280px;
  background:var(--nd-surface, #1b1e24);border:1px solid var(--nd-border, #353b46);border-radius:10px;overflow:hidden}
.nk-dchat .ndevr-qa{flex:1 1 auto;min-height:0}
/* Editable draft preview, revealed once QUAIL proposes a card (chat is hidden, so it can fill + scroll). */
.nk-draft{flex:1 1 auto;min-height:0;overflow-y:auto;padding-top:2px}
.nk-draft .nk-draft-bar{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.nk-draft .nk-draft-bar .nk-draft-back{flex:0 0 auto;padding:5px 11px;font-size:12.5px}
.nk-draft .nk-draft-bar .nk-draft-sec{margin:0}
.nk-draft .nk-draft-appendinfo{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;padding:10px 12px;margin-bottom:12px;font-size:13px;color:var(--nd-muted, #9aa3b2)}
.nk-draft .nk-draft-appendinfo b{color:var(--nd-text, #e8eaed)}
.nk-draft .nk-draft-existing{margin-top:8px;padding:8px 10px;background:var(--nd-surface, #1b1e24);border:1px solid var(--nd-border, #353b46);border-radius:6px;color:var(--nd-muted, #9aa3b2);font-size:12px;max-height:130px;overflow:auto;white-space:pre-wrap}
.nk-draft .nk-draft-dups{margin-bottom:12px;background:rgba(255,182,59,.08);border:1px solid var(--nk-gold-dim);border-radius:8px;padding:8px 10px}
.nk-draft .nk-draft-dups .nk-dup-h{font-size:12.5px;color:var(--nd-accent-text, var(--nd-accent, #ffb63b));margin-bottom:4px}
.nk-draft .nk-draft-dups .nk-dup-item{display:block;width:100%;text-align:left;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:6px;color:var(--nd-text, #e8eaed);padding:6px 9px;margin:4px 0 0;cursor:pointer;font:inherit;font-size:12.5px}
.nk-draft .nk-draft-dups .nk-dup-item:hover{border-color:var(--nk-gold-dim)}
.nk-draft .nk-draft-title{width:100%;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;
  color:var(--nd-text, #e8eaed);font:600 16px/1.3 inherit;padding:8px 10px;margin:0 0 10px}
.nk-draft .nk-chipset{margin-bottom:10px}
.nk-draft .nk-draft-desc{width:100%;min-height:140px;background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);
  border-radius:8px;color:var(--nd-text, #e8eaed);padding:10px;font:inherit;resize:vertical}
.nk-draft .nk-draft-imgs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.nk-draft .nk-draft-imgs img{width:84px;height:84px;object-fit:cover;border-radius:8px;border:1px solid var(--nd-border, #353b46)}
.nk-draft .nk-draft-foot{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.nk-draft .nk-dfield{display:inline-flex;align-items:center;color:var(--nd-muted, #9aa3b2);font-size:13px}
.nk-draft .nk-dfield select{background:var(--nd-line, #2a2f39);border:1px solid var(--nd-border, #353b46);border-radius:8px;color:var(--nd-text, #e8eaed);padding:6px 9px;font:inherit}
.nk-draft .nk-draft-hint{color:var(--nd-muted, #9aa3b2);font-size:12px}
.nk-draft .nk-draft-add{margin-left:auto}