/* Externalized page and component styles. Inline styles are intentionally forbidden by CSP. */
.project-color-strip { height: 9px; border-radius: 8px; margin: -4px 0 10px; }
.project-avatar { border-radius: 12px; width: 84px; height: 84px; color: #0b1326; font-size: 39px; overflow: hidden; }
.project-board-avatar { border-radius: 14px; width: 72px; height: 72px; color: #0b1326; font-size: 34px; overflow: hidden; }
.csp-color-dot { display: inline-block; border-radius: 999px; }
.csp-color-dot-small { width: 10px; height: 10px; }
.csp-color-dot-status { width: 12px; height: 12px; border-radius: 50%; }

/* views/components/issue-dialog.ejs */
.modal.hidden { display: none; }
  .modal { position: fixed; inset: 0; z-index: 1000; }
  .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
  .modal-card { position: relative; width: min(820px, 92vw); margin: 8vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
  .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
  .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
  .component-badge { display:inline-block; padding:2px 6px; font-size:11px; border-radius:4px; background: color-mix(in srgb, var(--comp-color, #64748b) 12%, transparent); color: #111; border: 1px solid var(--comp-color, #64748b); }
/* views/pages/backlog.ejs */
.ctx-menu.hidden { display:none; }
  .ctx-menu { position: fixed; z-index: 2000; background:#fff; color:#111; border:1px solid #e5e7eb; border-radius:8px; box-shadow: 0 12px 26px rgba(0,0,0,0.16); min-width: 220px; padding:6px; }
  .ctx-item { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 8px; border-radius:6px; cursor:pointer; user-select:none; position:relative; }
  .ctx-item:hover { background:#f1f5f9; }
  .ctx-label { pointer-events:none; }
  .ctx-sub::after { content:'›'; opacity:0.6; }
  .ctx-sep { height:1px; background:#e5e7eb; margin:6px 4px; }
  .ctx-submenu { position:absolute; left:calc(100% - 2px); top:0; margin-left:0; display:none; min-width:200px; background:#fff; border:1px solid #e5e7eb; border-radius:8px; box-shadow: 0 12px 26px rgba(0,0,0,0.16); padding:6px; }
  .ctx-item:hover > .ctx-submenu, .ctx-submenu:hover { display:block; }
/* views/pages/backlog.ejs */
.bl-col-body.dragover, .bl-col.dragover .bl-col-body { outline: 2px dashed #93c5fd; outline-offset: -6px; background: #f8fafc; }
  .issue-card.dragging { opacity: 0.6; }
  .issue-card { cursor: grab; }
  .issue-card:active { cursor: grabbing; }
/* views/pages/boards.ejs */
.ctx-menu.hidden { display:none; }
  .ctx-menu { position: fixed; z-index: 2000; background:#fff; color:#111; border:1px solid #e5e7eb; border-radius:8px; box-shadow: 0 12px 26px rgba(0,0,0,0.16); min-width: 220px; padding:6px; }
  .ctx-item { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 8px; border-radius:6px; cursor:pointer; user-select:none; position:relative; }
  .ctx-item:hover { background:#f1f5f9; }
  .ctx-label { pointer-events:none; }
  .ctx-sub::after { content:'›'; opacity:0.6; }
  .ctx-sep { height:1px; background:#e5e7eb; margin:6px 4px; }
  .ctx-submenu { position:absolute; left:calc(100% - 2px); top:0; margin-left:0; display:none; min-width:200px; background:#fff; border:1px solid #e5e7eb; border-radius:8px; box-shadow: 0 12px 26px rgba(0,0,0,0.16); padding:6px; }
  .ctx-item:hover > .ctx-submenu, .ctx-submenu:hover { display:block; }
/* views/pages/boards.ejs */
.kan-col-body.dragover, .kan-col.dragover .kan-col-body { outline: 2px dashed #93c5fd; outline-offset: -6px; background: #f8fafc; }
  .issue-card.dragging { opacity: 0.6; }
  .issue-card { cursor: grab; }
  .issue-card:active { cursor: grabbing; }
/* views/pages/diagram-editor.ejs */
/* Aktiven Modus farblich hervorheben (Hintergrund) */
      .toolbar #btnDelete.btn.btn-secondary {
        background: #dbeafe; /* helles Blau */
        border-color: #93c5fd;
        color: #0c4a6e;
      }
      /* Toolbar icon sizing */
      .toolbar .btn { display: inline-flex; align-items: center; justify-content: center; padding: 8px; width: 36px; height: 36px; }
      .toolbar .btn .icon { width: 18px; height: 18px; display: block; }
      .diagram-read-only .editor-layout,
      .diagram-read-only .tag-picker { pointer-events: none; opacity: .8; }
/* views/pages/diagram-editor.ejs */
.ctx-menu.hidden { display: none; }
      .ctx-menu {
        position: fixed;
        z-index: 1200;
        background: #ffffff;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 10px 24px rgba(15,23,42,0.12);
        min-width: 160px;
        padding: 4px;
        color: #0f172a;
      }
      .ctx-menu .item {
        display: block;
        width: 100%;
        text-align: left;
        padding: 8px 10px;
        background: transparent;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        font-weight: 600;
      }
      .ctx-menu .item:hover { background: #f3f4f6; }
      .ctx-menu .separator { height: 1px; background: #e5e7eb; margin: 4px 0; }
      .ctx-menu .item.text-danger { color: #ef4444; }
      .ctx-menu .item.text-danger:hover { background: #fef2f2; }
      /* Modal Basis */
      .modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1100; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(520px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; cursor: move; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
      /* Type picker grid */
      .type-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:8px; padding:4px; max-height: 400px; overflow-y: auto; }
      .type-item { display:flex; align-items:center; justify-content:center; padding:6px; border:1px solid #e5e7eb; border-radius:8px; background:#fafafa; cursor:pointer; }
      .type-item:hover { background:#f3f4f6; }
      .type-item .icon { width:48px; height:36px; display:block; background:#ffffff; border:1px solid #e5e7eb; border-radius:6px; }
/* views/pages/diagram-editor.ejs */
.editor-layout { align-items: stretch; }
      .resizer {
        width: 6px;
        cursor: col-resize;
        background: transparent;
        transition: background 0.2s;
        z-index: 10;
        border-radius: 3px;
      }
      .resizer:hover, .resizer.dragging {
        background: #cbd5e1;
      }
      .node-library { border:1px solid #e2e8f0; border-radius:8px; background:#fff; padding:0; height: 68vh; min-height:420px; overflow:auto; }
      .node-library .lib-category { border-bottom: 1px solid #e2e8f0; }
      .node-library .lib-category:last-child { border-bottom: none; }
      .node-library .lib-header {
        display: flex; align-items: center; gap: 6px; width: 100%; padding: 8px 10px;
        background: #f8fafc; border: none; text-align: left; font-weight: 600;
        cursor: pointer; color: #475569; user-select: none;
      }
      .node-library .lib-header:hover { background: #f1f5f9; }
      .node-library .lib-header::before { content: '▸'; display: inline-block; width: 12px; transition: transform 0.2s; }
      .node-library .lib-category.open .lib-header::before { transform: rotate(90deg); }
      .node-library .lib-content { display: none; padding: 8px; }
      .node-library .lib-category.open .lib-content { display: block; }
      .node-library .lib-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap:6px; }
      .lib-item { display:flex; align-items:center; justify-content:center; padding:4px; border:1px solid #e5e7eb; border-radius:8px; cursor:grab; user-select:none; background:#fafafa; }
      .lib-item:active { cursor:grabbing; }
      .lib-item .icon { width:48px; height:36px; display:block; background:#ffffff; border:1px solid #e5e7eb; border-radius:6px; }
      .lib-item .label { display:none; }
/* views/pages/diagramme.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(720px, 92vw); margin: 10vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; cursor: move; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
/* views/pages/dokumente.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(820px, 92vw); margin: 8vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; cursor: move; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
      .dropzone { border: 2px dashed #cbd5e1; background: #f8fafc; color: #334155; border-radius: 8px; padding: 18px; text-align:center; margin: 8px 0 16px; transition: all 0.15s ease; }
      .dropzone.dragover { background: #eef2ff; border-color: #6366f1; color: #1e293b; }
      .dropzone small { color: #64748b; }
      .file-link { text-decoration: none; color: #1d4ed8; }
      .file-link:hover { text-decoration: underline; }
      .mini-table { border-collapse: collapse; font-size: 11px; color: #0f172a; background: #fff; }
      .mini-table td { border: 1px solid #e2e8f0; padding: 2px 6px; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .mini-table-wrap { max-width: 520px; overflow: auto; background: #f8fafc; border:1px solid #e2e8f0; border-radius:6px; padding:6px; }
      /* Table editor */
      .editor-table { border-collapse: collapse; font-size: 13px; color: #0f172a; background: #fff; }
      .editor-table td { border: 1px solid #e2e8f0; min-width: 90px; padding: 0; vertical-align: top; }
      .editor-table td > div { padding: 6px; outline: none; min-height: 26px; }
      .editor-table td.selected { outline: 2px solid #38bdf8; outline-offset: -2px; }
      .te-grid-wrap { max-height: 360px; overflow: auto; background: #f8fafc; border:1px solid #e2e8f0; border-radius:6px; }
      .table-editor .btn { padding: 6px 8px; }
      /* Drag & Resize handle */
      .modal-card.dragging { cursor: grabbing; }
      .modal-card.resizing { cursor: se-resize; }
      .modal-card .modal-resize-handle { position: absolute; width: 14px; height: 14px; right: 8px; bottom: 8px; cursor: se-resize; background:
        linear-gradient(135deg, #cbd5e1 25%, transparent 25%),
        linear-gradient(315deg, #cbd5e1 25%, transparent 25%),
        linear-gradient(45deg, #e5e7eb 25%, transparent 25%);
        background-size: 8px 8px; background-position: 0 0, 0 0, 4px 4px; border-radius: 4px; opacity: 0.85; }
      .modal-card .modal-resize-handle:hover { opacity: 1; }

      /* Dokumente als Karten (1:√2) */
      .doc-cards { display:grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
      .doc-card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; color:#0f172a; display:flex; flex-direction:column; box-shadow: 0 1px 2px rgba(15,23,42,0.06); }
      .doc-card-page { aspect-ratio: 1 / 1.41421356; background:#f8fafc; border-bottom:1px solid #e5e7eb; display:flex; align-items:stretch; justify-content:stretch; overflow:auto; }
      .doc-card-page .mini-table-wrap { max-width: 100%; max-height: 100%; padding: 6px; border:0; background:transparent; }
      .doc-card-page .mini-table { font-size: 10px; }
      .doc-card-md { padding: 10px; font-size:12px; line-height:1.35; color:#334155; overflow: hidden; display:-webkit-box; -webkit-line-clamp: 12; -webkit-box-orient: vertical; }
      .doc-card-md code { background:#e2e8f0; padding:1px 4px; border-radius:4px; color:#0f172a; }
      .doc-card-md .md-h1,
      .doc-card-md .md-h2,
      .doc-card-md .md-h3,
      .doc-card-md .md-h4,
      .doc-card-md .md-h5,
      .doc-card-md .md-h6 { display:block; font-weight:700; color:#0f172a; margin: 4px 0 3px; }
      .doc-card-md .md-h1 { font-size:14px; }
      .doc-card-md .md-h2 { font-size:13px; }
      .doc-card-md .md-h3 { font-size:12.5px; }
      .doc-card-md .md-h4 { font-size:12px; }
      .doc-card-md .md-h5 { font-size:12px; font-weight:600; }
      .doc-card-md .md-h6 { font-size:11.5px; font-weight:600; }
      .doc-card-meta { padding: 10px 12px; display:flex; flex-direction:column; gap:6px; }
      .doc-card-title { font-weight:700; font-size:14px; color:#0f172a; }
      .doc-card-info { font-size:12px; color:#475569; display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
      .doc-card-actions { display:flex; gap:8px; margin-top:2px; }
      .doc-card .btn { padding:6px 8px; }
      .doc-file { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; text-decoration:none; color:inherit; gap:6px; padding: 8px; }
      .doc-file-ext { font-weight:800; font-size:22px; letter-spacing:1px; color:#1e293b; }
      .doc-file-name { font-size:12px; color:#475569; max-width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
      /* PDF & Diagram preview */
      .doc-pdf-wrap, .doc-pdf { width:100%; height:100%; display:block; }
      .doc-pdf { border:0; background:#fff; }
      .doc-diagram { width:100%; height:100%; display:block; background:#ffffff; }
/* views/pages/landing.ejs */
.landing { display:flex; min-height:100vh; align-items:center; justify-content:center; padding:24px; }
    .landing-inner { width:min(900px, 96vw); text-align:center; }
    .landing-brand { color:#fff; font-weight:800; letter-spacing:.3px; margin-bottom:8px; }
    .landing-title { margin:4px 0; font-size:28px; }
    .landing-sub { color: var(--muted); margin: 0 0 18px 0; }
    .auth-container { display:flex; align-items:stretch; justify-content:center; gap:18px; }
    @media (max-width: 900px) { .auth-container { flex-direction:column; } }
/* views/pages/projekt-board.ejs */
.card { background:#fff; border:1px solid #e5e7eb; }
      .muted { color:#64748b; }
      .file-link { text-decoration: none; color: #1d4ed8; }
      .file-link:hover { text-decoration: underline; }
      .mini-table { border-collapse: collapse; font-size: 11px; color: #0f172a; background: #fff; }
      .mini-table td { border: 1px solid #e2e8f0; padding: 2px 6px; max-width: 120px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
      .mini-table-wrap { overflow:auto; background: #f8fafc; border:1px solid #e2e8f0; border-radius:6px; padding:6px; }
      /* Tag pill */
      /* Optional: nicer thin scrollbar for the cards area */
      .cards-scroll { scrollbar-width: thin; }
      .cards-scroll::-webkit-scrollbar { height: 8px; width: 8px; }
      .cards-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
      .cards-scroll::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 8px; }

      /* Dokumente als Karten (1:√2) – reuse styles from Dokumente/Alle Dokumente */
      .doc-cards { display:grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
      .doc-card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; color:#0f172a; display:flex; flex-direction:column; box-shadow: 0 1px 2px rgba(15,23,42,0.06); }
      .doc-card-page { aspect-ratio: 1 / 1.41421356; background:#f8fafc; border-bottom:1px solid #e5e7eb; display:flex; align-items:stretch; justify-content:stretch; overflow:auto; }
      .doc-card-page .mini-table-wrap { max-width: 100%; max-height: 100%; padding: 6px; border:0; background:transparent; }
      .doc-card-page .mini-table { font-size: 10px; }
      .doc-card-md { padding: 10px; font-size:12px; line-height:1.35; color:#334155; overflow: hidden; display:-webkit-box; -webkit-line-clamp: 12; -webkit-box-orient: vertical; }
      .doc-card-md code { background:#e2e8f0; padding:1px 4px; border-radius:4px; color:#0f172a; }
      .doc-card-md .md-h1,
      .doc-card-md .md-h2,
      .doc-card-md .md-h3,
      .doc-card-md .md-h4,
      .doc-card-md .md-h5,
      .doc-card-md .md-h6 { display:block; font-weight:700; color:#0f172a; margin: 4px 0 3px; }
      .doc-card-md .md-h1 { font-size:14px; }
      .doc-card-md .md-h2 { font-size:13px; }
      .doc-card-md .md-h3 { font-size:12.5px; }
      .doc-card-md .md-h4 { font-size:12px; }
      .doc-card-md .md-h5 { font-size:12px; font-weight:600; }
      .doc-card-md .md-h6 { font-size:11.5px; font-weight:600; }
      .doc-card-meta { padding: 10px 12px; display:flex; flex-direction:column; gap:6px; }
      .doc-card-title { font-weight:700; font-size:14px; color:#0f172a; }
      .doc-card-info { font-size:12px; color:#475569; display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
      .doc-file { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; text-decoration:none; color:inherit; gap:6px; padding: 8px; }
      .doc-file-ext { font-weight:800; font-size:22px; letter-spacing:1px; color:#1e293b; }
      .doc-file-name { font-size:12px; color:#475569; max-width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
      /* PDF & Diagram preview */
      .doc-pdf-wrap, .doc-pdf { width:100%; height:100%; display:block; }
      .doc-pdf { border:0; background:#fff; }
      .doc-diagram { width:100%; height:100%; display:block; background:#ffffff; }
/* views/pages/projekte.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(820px, 92vw); margin: 8vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; cursor: move; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }

      /* Drag & Resize handle */
      .modal-card.dragging { cursor: grabbing; }
      .modal-card.resizing { cursor: se-resize; }
      .modal-card .modal-resize-handle { position: absolute; width: 14px; height: 14px; right: 8px; bottom: 8px; cursor: se-resize; background:
        linear-gradient(135deg, #cbd5e1 25%, transparent 25%),
        linear-gradient(315deg, #cbd5e1 25%, transparent 25%),
        linear-gradient(45deg, #e5e7eb 25%, transparent 25%);
        background-size: 8px 8px; background-position: 0 0, 0 0, 4px 4px; border-radius: 4px; opacity: 0.85; }
      .modal-card .modal-resize-handle:hover { opacity: 1; }

      /* Project tiles +50% sizing */
      .project-grid { grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 24px; }
      .project-grid .user-card { padding: 21px 24px; border-radius: 21px; min-height: 360px; display: flex; flex-direction: column; padding-bottom: 78px; overflow-wrap: anywhere; }
      .project-grid .user-card-main { gap: 18px; align-items: flex-start; }
      .project-grid .project-avatar { flex: 0 0 auto; }
      .project-grid .project-tile-info { flex: 1 1 auto; min-width: 0; display: grid; gap: 6px; }
      .project-grid .project-tile-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; margin: 0 0 14px; }
      .project-grid .project-tile-meta > * { max-width: 100%; overflow-wrap: anywhere; }
      .project-grid .project-tile-meta > .project-tile-key, .project-grid .project-tile-meta > .project-tile-status { display: inline-block; box-sizing: border-box; max-width: 100%; padding: 3px 9px; border: 1px solid var(--tag-color, #cbd5e1); border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 1.4; color: #1e293b; background: color-mix(in srgb, var(--tag-color, #64748b) 12%, #fff); white-space: normal; overflow-wrap: anywhere; }
      .project-grid .project-tile-title { margin: 0; color: #0f172a; font-size: 22px; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
      .project-grid .project-tile-lead { color: #64748b; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
      .project-grid .project-issues { margin-bottom: 12px; }
      @media (max-width: 768px) {
        .project-grid .user-card { min-height: 220px; padding-bottom: 78px !important; }
        .project-grid .project-avatar { width: 64px; height: 64px; font-size: 30px; }
        .project-grid .user-card-main { gap: 12px; }
      }
      .project-grid .tile-edit-btn { width: 48px; height: 48px; border-radius: 12px; padding: 6px; right: 12px; bottom: 12px; z-index: 2; }
      .project-grid .tile-edit-btn img { width: 27px; height: 27px; }
      .project-grid .project-desc { margin-top: 10px; color: #475569; font-size: 13px; line-height: 1.5; max-height: 18em; overflow: hidden; }
      /* Markdown heading styles inside project description */
      .project-grid .project-desc .md-h1,
      .project-grid .project-desc .md-h2,
      .project-grid .project-desc .md-h3,
      .project-grid .project-desc .md-h4,
      .project-grid .project-desc .md-h5,
      .project-grid .project-desc .md-h6 { display:block; font-weight:700; color:#0f172a; margin: 6px 0 4px; }
      .project-grid .project-desc .md-h1 { font-size: 14px; }
      .project-grid .project-desc .md-h2 { font-size: 13.5px; }
      .project-grid .project-desc .md-h3 { font-size: 13px; }
      .project-grid .project-desc .md-h4 { font-size: 12.5px; }
      .project-grid .project-desc .md-h5 { font-size: 12px; }
      .project-grid .project-desc .md-h6 { font-size: 12px; font-weight:600; }
/* views/pages/projekt-board.ejs: Issue views, quick actions and priority swimlanes */
.project-issues-section { margin-top: 24px; }
.project-issues-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:12px; }
.project-issues-heading h2 { margin-bottom:4px; }
.project-issues-hint { margin:0; font-size:13px; }
.project-issue-view-switcher { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 16px; }
.project-issue-view-button[aria-pressed="true"] { box-shadow:inset 0 0 0 1px rgba(15,23,42,.18); }
.project-issue-card { position:relative; }
.project-issue-card .title { overflow-wrap:anywhere; }
.project-issue-list-wrap { overflow-x:auto; }
.project-issue-list-table { min-width:720px; }
.project-issue-list-table th { white-space:nowrap; }
.project-issue-sort { appearance:none; border:0; background:transparent; color:inherit; font:inherit; font-weight:700; padding:0; cursor:pointer; text-align:left; }
.project-issue-sort:hover, .project-issue-sort:focus-visible { color:#1d4ed8; text-decoration:underline; }
.project-issue-sort[data-project-sort-direction="asc"]::after { content:' ↑'; }
.project-issue-sort[data-project-sort-direction="desc"]::after { content:' ↓'; }
.project-priority-swimlanes { display:grid; gap:12px; }
.project-priority-lane { display:grid; grid-template-columns:150px minmax(0, 1fr); gap:12px; align-items:stretch; }
.project-priority-lane-header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px; border:1px solid #dbe3ef; border-radius:10px; background:#f8fafc; }
.project-priority-count { min-width:24px; padding:2px 7px; border-radius:999px; background:#e2e8f0; color:#334155; font-size:12px; font-weight:700; text-align:center; }
.project-priority-lane-body { display:flex; flex-wrap:wrap; align-content:flex-start; gap:10px; min-height:72px; padding:10px; border:1px dashed #cbd5e1; border-radius:10px; background:#fff; transition:background .15s ease, outline-color .15s ease; }
.project-priority-lane-body.dragover { background:#eff6ff; outline:2px dashed #93c5fd; outline-offset:-5px; }
.project-priority-card { width:min(290px, 100%); min-height:72px; cursor:grab; }
.project-priority-card:active { cursor:grabbing; }
.project-priority-card.dragging { opacity:.55; }
.project-priority-card-meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px; color:#64748b; font-size:12px; }

.issue-attachments { margin-top: 12px; padding-top: 10px; border-top: 1px solid #e2e8f0; }
.issue-attachments-title { font-size: 13px; font-weight: 700; color: #334155; }
.issue-attachment-list { display: grid; gap: 8px; margin: 8px 0; padding: 0; list-style: none; }
.issue-attachment-item { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 13px; }
.issue-attachment-preview { width: 68px; height: 48px; object-fit: cover; border: 1px solid #cbd5e1; border-radius: 6px; background: #f8fafc; }
.issue-attachment-remove, .issue-attachment-upload { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.issue-attachment-remove .btn { padding: 3px 8px; font-size: 12px; }
.issue-attachment-upload { margin-top: 8px; flex-wrap: wrap; font-size: 13px; padding: 8px; border: 1px dashed #94a3b8; border-radius: 6px; }
.issue-attachment-upload.is-dragover { border-color: #2563eb; background: #eff6ff; }
.issue-attachment-upload-status { flex: 1 1 260px; margin: 0; }
.issue-attachment-upload-progress { flex: 1 1 180px; }

/* views/pages/issues.ejs: searchable, filterable Issue overview */
.issue-overview { display: grid; gap: 14px; }
.issue-overview-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.issue-overview-header h2 { margin: 0; }
.issue-overview-hint { margin: 4px 0 0; font-size: 13px; }
.issue-overview-total { display: inline-grid; min-width: 32px; min-height: 32px; place-items: center; padding: 2px 9px; border-radius: 999px; background: #e0e7ff; color: #3730a3; font-size: 13px; font-weight: 800; }
.issue-overview-toolbar { display: grid; grid-template-columns: minmax(240px, 2fr) repeat(3, minmax(148px, 1fr)); gap: 10px; align-items: end; padding: 14px; border: 1px solid #dbe3ef; border-radius: 12px; background: linear-gradient(135deg, #f8fafc, #f1f5f9); }
.issue-overview-control { display: grid; gap: 5px; min-width: 0; color: #334155; font-size: 12px; font-weight: 700; }
.issue-overview-control input, .issue-overview-control select { min-width: 0; min-height: 38px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #0f172a; font: inherit; font-size: 14px; font-weight: 400; padding: 7px 10px; }
.issue-overview-control input:focus, .issue-overview-control select:focus, .issue-overview-toggle:focus-within { outline: 3px solid rgba(59, 130, 246, .28); outline-offset: 1px; }
.issue-overview-toggle { display: inline-flex; min-height: 38px; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #334155; font-size: 13px; font-weight: 700; }
.issue-overview-toggle input { width: 17px; height: 17px; accent-color: #2563eb; }
.issue-overview-reset { min-height: 38px; white-space: nowrap; }
.issue-overview-summary { min-height: 20px; margin: -4px 0 0; color: #475569; font-size: 13px; }
.issue-overview-empty { margin: 0; padding: 16px; border: 1px dashed #cbd5e1; border-radius: 10px; text-align: center; }
.issue-overview-table-wrap { margin-top: -2px; }
.issue-overview-table { min-width: 1160px; }
.issue-overview-table th { white-space: nowrap; }
.issue-overview-sort { appearance: none; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; padding: 0; cursor: pointer; text-align: left; }
.issue-overview-sort:hover, .issue-overview-sort:focus-visible { color: #1d4ed8; text-decoration: underline; outline: none; }
.issue-overview-sort[data-issue-sort-direction="asc"]::after { content: ' ↑'; }
.issue-overview-sort[data-issue-sort-direction="desc"]::after { content: ' ↓'; }
.issue-overview-id { color: #475569; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 12px; font-weight: 700; white-space: nowrap; }
.issue-overview-row[hidden] { display: none; }
.project-priority-empty { margin:auto 0; }
#projectIssueCtxMenu .ctx-item { width:100%; border:0; background:transparent; font:inherit; color:inherit; text-align:left; }
#projectIssueCtxMenu .ctx-sub { width:auto; }
#projectIssueCtxMenu .ctx-submenu .ctx-item { display:block; }
@media (max-width: 768px) {
  .issue-overview-header { align-items: center; }
  .issue-overview-toolbar { grid-template-columns: 1fr 1fr; padding: 10px; }
  .issue-overview-search { grid-column: 1 / -1; }
  .issue-overview-toggle, .issue-overview-reset { min-height: 42px; }
  .issue-overview-table { min-width: 0; }
  .issue-overview-table thead { display: none; }
  .issue-overview-table, .issue-overview-table tbody, .issue-overview-table tr, .issue-overview-table td { display: block; width: 100%; border: 0; }
  .issue-overview-table tr { margin: 0 0 10px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
  .issue-overview-table td { display: block; padding: 8px 0; border-bottom: 1px solid #eef2f7; text-align: left; }
  .issue-overview-table td:last-child { border-bottom: 0; }
  .issue-overview-table td::before { content: attr(data-mobile-label); display: block; margin-bottom: 4px; color: #64748b; font-size: 12px; font-weight: 700; }
  .project-issues-heading { flex-direction:column; }
  .project-priority-lane { grid-template-columns:1fr; gap:6px; }
  .project-priority-lane-header { padding:9px 10px; }
  .project-issue-list-table { min-width:0; }
  .project-issue-list-table thead { display:none; }
  .project-issue-list-table, .project-issue-list-table tbody, .project-issue-list-table tr, .project-issue-list-table td { display:block; width:100%; border:0; }
  .project-issue-list-table tr { margin:0 0 10px; padding:10px 12px; border:1px solid #e5e7eb; border-radius:10px; background:#fff; box-shadow:0 1px 2px rgba(15,23,42,.04); }
  .project-issue-list-table td { display:grid; grid-template-columns:minmax(96px, 38%) 1fr; gap:8px; padding:6px 0; border-bottom:1px solid #eef2f7; text-align:left; }
  .project-issue-list-table td:last-child { border-bottom:0; }
  .project-issue-list-table td::before { content:attr(data-mobile-label); color:#64748b; font-size:12px; font-weight:700; }
}
@media (max-width: 460px) {
  .issue-overview-toolbar { grid-template-columns: 1fr; }
  .issue-overview-search { grid-column: auto; }
}
/* views/pages/settings/components.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(560px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
      .component-chip { appearance:none; background: transparent; border: 2px solid var(--comp-color, #64748b); color: #0f172a; padding: 4px 10px; border-radius: 4px; font-weight: 700; font-size: 12px; letter-spacing: 0.3px; cursor: pointer; }
      .component-chip-list { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
      .component-chip:hover { background: color-mix(in srgb, var(--comp-color, #64748b) 10%, transparent); }
      .component-chip:focus { outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--comp-color, #64748b) 25%, #93c5fd); }
/* views/pages/settings/groups.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(560px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
/* views/pages/settings/issue-typen.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(560px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
/* views/pages/settings/status.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(560px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
/* views/pages/settings/tags.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(560px, 92vw); margin: 12vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
      /* Small badge used elsewhere */
      /* Compact tag tiles for management page */
/* views/pages/settings/user.ejs */
.modal.hidden { display: none; }
      .modal { position: fixed; inset: 0; z-index: 1000; }
      .modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); }
      .modal-card { position: relative; width: min(720px, 92vw); margin: 8vh auto; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); padding: 12px 16px; }
      .modal-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #eee; padding-bottom: 8px; }
      .modal-close { background: transparent; border: none; font-size: 24px; line-height: 1; cursor: pointer; }
/* views/pages/settings/user.ejs */
/* User tiles 25% larger on this page only */
      #users-list .user-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
      #users-list .user-card { padding: 18px 20px; border-radius: 18px; }
      #users-list .user-card-main { gap: 15px; }
      #users-list .user-avatar { width: 70px; height: 70px; }
      #users-list .user-avatar .init { font-size: 22px; }
      #users-list .tile-edit-btn { width: 40px; height: 40px; border-radius: 10px; padding: 5px; }
      #users-list .tile-edit-btn img { width: 22px; height: 22px; }

/* Former static style attributes. The classes are explicit source-level CSP migration output. */
.csp-inline-001 { padding-top:8px; }
.csp-inline-002 { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.csp-inline-003 { display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.csp-inline-004 { text-transform:capitalize; }
.csp-inline-005 { margin-top:8px; display:flex; gap:8px; justify-content:flex-end; }
.csp-inline-006 { display:none; }
.csp-inline-007 { display:none; margin-top:8px; background:#f8fafc; border:1px solid #e5e7eb; padding:8px; border-radius:8px; }
.csp-inline-008 { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.csp-inline-009 { flex:1 1 220px; }
.csp-inline-010 { display:inline-flex; align-items:center; gap:6px; }
.csp-inline-011 { font-size:12px; margin-top:6px; }
.csp-inline-012 { position: fixed; bottom: 6px; right: 10px; font-size: 12px; color: #666; opacity: 0.8; }
.csp-inline-013 { font-size: 11px; color: var(--muted); padding: 0 12px 6px 12px; text-align: right; }
.csp-inline-014 { margin:0; }
.csp-inline-015 { display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-top:1rem; }
.csp-inline-016 { margin-top:.75rem;color:#6b7280;font-size:.9rem; }
.csp-inline-017 { max-width: 560px; }
.csp-inline-018 { text-align:center; margin: 20px 0; }
.csp-inline-019 { display:block; margin-bottom: 18px; }
.csp-inline-020 { width:100%; margin-top:6px; font-family:monospace; }
.csp-inline-021 { margin-top:18px; }
.csp-inline-022 { max-width: 460px; }
.csp-inline-023 { margin-top:20px; }
.csp-inline-024 { margin-top:12px; }
.csp-inline-025 { max-width: 600px; }
.csp-inline-026 { font-family:monospace; columns:2; padding-left:24px; }
.recovery-code { margin:7px 0; }
.csp-inline-028 { display:flex; align-items:center; gap:10px; justify-content:space-between; margin:8px 0 12px; }
.csp-inline-029 { font-size:13px; color:#6b7280; display:flex; flex-wrap:wrap; gap:12px; }
.csp-inline-030 { display:flex; gap:8px; }
.csp-inline-031 { margin:12px 0; }
.csp-inline-032 { display:grid; grid-template-columns: repeat(4, 1fr); gap: 14px; align-items:start; }
.csp-inline-033 { background:#ffffff; border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; color:#0f172a; display:flex; flex-direction:column; min-height:80px; }
.csp-inline-034 { padding:10px 12px; border-bottom:1px solid #e5e7eb; display:flex; align-items:center; justify-content:space-between; }
.csp-inline-035 { background:#0b1326; color:#e5e7eb; border:1px solid #2a364d; padding:2px 8px; border-radius:999px; font-size:12px; }
.csp-inline-036 { display:flex; flex-direction:column; gap:10px; padding:10px; min-height: 40px; }
.csp-inline-037 { padding:10px 12px; color:#6b7280; font-size:12px; }
.csp-inline-038 { border:1px solid #e5e7eb; border-radius:10px; padding:10px 12px; background:#fff; }
.csp-inline-039 { font-weight:700; }
.csp-inline-040 { display:flex; gap:10px; align-items:center; font-size:12px; color:#475569; margin-top:6px; flex-wrap:wrap; }
.csp-inline-041 { opacity:0.8; }
.csp-inline-042 { text-transform:capitalize; display:inline-flex; align-items:center; gap:6px; }
.csp-inline-043 { font-size:12px; color:#475569; margin-top:8px; max-height:5.7em; overflow:hidden; }
.csp-inline-044 { margin-top:8px; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.csp-inline-045 { font-size:13px; color:#6b7280; }
.csp-inline-046 { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; align-items:start; }
.csp-inline-047 { margin:0 0 8px; font-size:16px; }
.csp-inline-048 { grid-column: 1 / -1; }
.csp-inline-049 { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:8px 0 6px; }
.csp-inline-050 { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.csp-inline-051 { font-size:12px; color:#64748b; }
.csp-inline-052 { font-size:28px; font-weight:800; line-height:1; }
.csp-inline-053 { margin-top:16px; }
.csp-inline-054 { font-size:18px; margin:0 0 8px 0; }
.csp-inline-055 { grid-template-columns: repeat(4, 1fr); }
.csp-inline-056 { font-size:26px; font-weight:800; }
.csp-inline-057 { font-size:18px; margin:0; }
.csp-inline-058 { margin-top:8px; }
.csp-inline-059 { width:80px; }
.csp-inline-060 { width:140px; }
.csp-inline-061 { width:90px; }
.csp-inline-062 { width:190px; }
.csp-inline-063 { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0; }
.csp-inline-064 { display:flex; gap:8px; align-items:center; margin: 8px 0 10px; }
.csp-inline-065 { margin-left:auto; color:#475569; }
.csp-inline-066 { display:grid; grid-template-columns: 88px 6px 1fr; gap: 4px; }
.csp-inline-067 { border:1px solid #e2e8f0; border-radius:8px; position:relative; height: 68vh; min-height:420px; background:#fff; }
.csp-inline-068 { width:100%; height:100%; display:block; }
.csp-inline-069 { padding:10px 2px 2px 2px; }
.csp-inline-070 { margin:10px 0 4px; display:flex; gap:8px; justify-content:flex-end; }
.csp-inline-071 { margin: 12px 0; display:flex; gap:8px; align-items:center; }
.csp-inline-072 { margin:16px 0; }
.csp-inline-073 { overflow:auto; }
.csp-inline-074 { width:100%; min-width:900px; border-collapse: collapse; }
.csp-inline-075 { text-align:left; padding:6px; border-bottom:1px solid #ddd; }
.csp-inline-076 { padding:6px; border-bottom:1px solid #eee; font-weight:600; }
.csp-inline-077 { padding:6px; border-bottom:1px solid #eee; }
.csp-inline-078 { display:inline; }
.csp-inline-079 { color:#dc2626; }
.csp-inline-080 { max-height:100%; }
.csp-inline-081 { font-size:11px; }
.csp-inline-082 { display:flex;align-items:center;justify-content:center; }
.csp-inline-083 { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin: 6px 0 8px; }
.csp-inline-084 { margin:0 6px; }
.csp-inline-085 { display:flex; align-items:center; gap:6px; }
.csp-inline-086 { margin: 12px 0; display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.csp-inline-087 { display:flex; gap:8px; align-items:center; }
.csp-inline-088 { margin: 8px 0 0; padding:8px 10px; border-radius:8px; background:#0f1a30; border:1px solid #1f2937; }
.csp-inline-089 { font-size:12px; margin-top:4px; }
.csp-inline-090 { margin:16px 0; display:none; }
.csp-inline-091 { color:#a00; }
.csp-inline-092 { max-width:800px; gap:10px; }
.csp-inline-093 { font-weight:600; }
.csp-inline-094 { font-size:12px; color:#666; max-width:520px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; line-height:1.35; }
.csp-inline-095 { margin-top:4px; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.csp-inline-096 { padding:6px; border-bottom:1px solid #eee; text-transform:capitalize; }
.csp-inline-097 { padding:6px; border-bottom:1px solid #eee; font-size:12px; color:#666; }
.csp-inline-098 { padding:20px 22px; width: 400px; max-width: 100%; }
.csp-inline-099 { margin:0 0 12px 0; font-size:18px; }
.csp-inline-100 { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; padding:8px 10px; border-radius:8px; margin:8px 0 12px 0; }
.csp-inline-101 { width:100% }
.csp-inline-102 { padding:20px 22px; }
.csp-inline-103 { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; padding:8px 10px; border-radius:8px; margin:8px 0 12px 0; }
.csp-inline-104 { margin-top:8px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.csp-inline-105 { margin-top:14px; font-size:12px; }
.csp-inline-106 { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.csp-inline-107 { display:flex; align-items:center; gap:14px; }
.csp-inline-108 { width:100%; height:100%; object-fit:contain; display:block; background: rgba(255,255,255,0.85); }
.csp-inline-109 { display:flex; width:100%; height:100%; align-items:center; justify-content:center; background: rgba(255,255,255,0.85); }
.csp-inline-110 { margin:0 0 4px 0; }
.csp-inline-111 { display:flex; flex-wrap:wrap; gap:8px; align-items:center; color:#334155; }
.csp-inline-112 { font-size:12px; color:#93c5fd; background:#0b1326; border:1px solid var(--border); padding:2px 6px; border-radius:999px; }
.csp-inline-113 { display:grid; grid-template-columns: 1.2fr 1fr; gap: 16px; margin-top: 12px; align-items:start; }
.csp-inline-114 { padding:12px; border-radius:10px; }
.csp-inline-115 { color:#475569; font-size:14px; line-height:1.5; }
.csp-inline-116 { max-height: 360px; overflow-y: auto; overflow-x: hidden; padding-right: 4px; }
.csp-inline-117 { display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.csp-inline-118 { padding:12px; }
.csp-inline-119 { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.csp-inline-120 { display:inline-block; padding:2px 6px; border-radius:999px; border:1px solid rgba(0,0,0,0.06); font-size:12px; color:#0f172a; }
.csp-inline-121 { background:#0b1326; color:#93c5fd; border:1px solid var(--border); padding:2px 8px; border-radius:999px; font-size:12px; white-space:nowrap; }
.csp-inline-122 { margin-top:8px; font-weight:700; line-height:1.3; color:#0f172a; }
.csp-inline-123 { margin-top:8px; display:flex; flex-wrap:wrap; gap:8px; font-size:12px; color:#475569; }
.csp-inline-124 { background:#f1f5f9; color:#0f172a; padding:2px 6px; border-radius:6px; }
.csp-inline-125 { display:grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.csp-inline-126 { font-size:12px; }
.csp-inline-127 { font-size:24px; font-weight:700; }
.csp-inline-128 { margin-top:10px; }
.csp-inline-129 { font-weight:600; margin-bottom:6px; }
.csp-inline-130 { display:flex; justify-content:space-between; font-size:13px; padding:2px 0; }
.csp-inline-131 { padding:12px; border-radius:10px; margin-top:12px; }
.csp-inline-132 { display:flex; flex-direction:column; gap:8px; }
.csp-inline-133 { margin: 12px 0; display:flex; gap:8px; }
.csp-inline-134 { padding-top: 10px; position: relative; }
.csp-inline-135 { align-items:flex-start; }
.csp-inline-136 { display:flex; align-items:center; gap:8px; }
.csp-inline-137 { font-size:12px; color:#93c5fd; background:#0b1326; border:1px solid var(--border); padding:2px 6px; border-radius: 999px; }
.csp-inline-138 { font-size:12px; color:#93c5fd; background:#0b1326; border:1px solid var(--border); padding:2px 6px; border-radius:999px; text-decoration:none; }
.csp-inline-139 { margin-left:10px; }
.csp-inline-140 { position:absolute; inset:0; z-index:1; border-radius: 18px; }
.csp-inline-141 { margin: 4px 0 8px 0; }
.csp-inline-142 { display:flex; flex-direction:column; gap:6px; margin-top:8px; }
.csp-inline-143 { margin-top:8px; display:flex; gap:8px; justify-content:flex-end; align-items:center; }
.csp-inline-144 { display:none; margin-top:8px; }
.csp-inline-145 { max-width: 640px; gap: 10px; }
.csp-inline-146 { border:1px solid #e5e7eb; border-radius:8px; padding:12px; }
.csp-inline-147 { padding:0 6px; color:#374151; }
.csp-inline-148 { display:grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:10px; }
.csp-inline-149 { display:flex; align-items:center; gap:8px; padding:6px 8px; border:1px solid #e5e7eb; border-radius:8px; }
.csp-inline-150 { font-size:12px; color:#6b7280; }
.csp-inline-151 { font-weight:600; text-transform:capitalize; }
.csp-inline-152 { margin:4px 0 10px; color:#6b7280; font-size:13px; }
.csp-inline-153 { display:flex; flex-direction:column; gap:10px; }
.csp-inline-154 { display:flex; align-items:center; gap:14px; padding:8px 10px; border:1px solid #e5e7eb; border-radius:8px; }
.csp-inline-155 { min-width:220px; display:flex; align-items:center; gap:8px; }
.csp-inline-156 { display:flex; gap:16px; flex-wrap:wrap; }
.csp-inline-157 { margin-top:16px; font-size:12px; color:#6b7280; }
.csp-inline-158 { margin: 12px 0; }
.csp-inline-159 { margin-top:8px;display:flex;gap:8px;justify-content:space-between;align-items:center; }
.csp-inline-160 { display:none; margin-right:auto; }
.csp-inline-161 { display:flex; gap:8px; margin-left:auto; }
.csp-inline-162 { border:1px solid #e5e7eb;padding:8px;border-radius:8px; }
.csp-inline-163 { display:inline-flex;align-items:center;gap:6px;margin-right:12px; }
.csp-inline-164 { display:inline-flex;align-items:center;gap:6px; }
.csp-inline-165 { margin: 12px 0; display:flex; justify-content:flex-end; }
.csp-inline-166 { width:60px }
.csp-inline-167 { width:80px }
.csp-inline-168 { text-align:right; }
.csp-inline-169 { max-width: 920px; gap: 12px; }
.csp-inline-170 { display:flex; flex-direction:column; gap:12px; }
.csp-inline-171 { border:1px solid #e5e7eb; border-radius:10px; padding:10px; }
.csp-inline-172 { display:grid; grid-template-columns: 2fr 1fr; gap: 10px; }
.csp-inline-173 { width:100%; min-height:140px; }
.csp-inline-174 { margin-top:8px; display:flex; justify-content:flex-end; }
.csp-inline-175 { margin-top:8px; display:flex; gap:8px; }
.csp-inline-176 { margin: 12px 0; display:flex; justify-content:flex-end; gap:8px; }
.csp-inline-177 { display:grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items:start; }
.csp-inline-178 { margin:8px 0 6px; }
.csp-inline-179 { width:140px }
.csp-inline-180 { display:inline-flex; align-items:center; gap:8px; }
.csp-inline-181 { text-align:right; display:flex; gap:6px; justify-content:flex-end; }
.csp-inline-182 { color:var(--muted); font-size:12px; margin-top:8px; max-width:140px; }
.csp-inline-183 { display:inline-flex; align-items:center; gap:6px; margin-right:12px; }

/* User type controls must stay hidden despite form label display rules. */
#userDialog [hidden] { display: none !important; }
#userDialog .user-groups { border: 0; padding: 0; margin: 0; }
#userDialog .user-groups legend { padding: 0; margin-bottom: 8px; font-weight: 600; }
#userDialog #groups-container { display: grid; gap: 8px; }
#userDialog #groups-container label { display: flex; flex-direction: row; align-items: center; gap: 8px; margin: 0; }
#userDialog #groups-container input { width: auto; margin: 0; }