/* ATBAI Project Modal Icons v1 - scoped, safe */

.project-modal .project-detail-icon {
  font-size: 0 !important;
  display: grid !important;
  place-items: center !important;
}

.project-modal .project-detail-icon::before {
  content: "" !important;
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  background: currentColor !important;
  mask-size: contain !important;
  mask-position: center !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  -webkit-mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
}

.project-modal .project-detail-card.problem .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2 22 20H2L12 2Zm0 5.8L6.8 18h10.4L12 7.8ZM11 10h2v4h-2v-4Zm0 5h2v2h-2v-2Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2 22 20H2L12 2Zm0 5.8L6.8 18h10.4L12 7.8ZM11 10h2v4h-2v-4Zm0 5h2v2h-2v-2Z'/%3E%3C/svg%3E");
}

.project-modal .project-detail-card.solution .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9.2 16.6 4.9 12.3 3.5 13.7l5.7 5.7L21 7.6 19.6 6.2 9.2 16.6Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9.2 16.6 4.9 12.3 3.5 13.7l5.7 5.7L21 7.6 19.6 6.2 9.2 16.6Z'/%3E%3C/svg%3E");
}

.project-modal .project-detail-card.status .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 19h16v2H2V3h2v16Zm3-2V9h3v8H7Zm5 0V5h3v12h-3Zm5 0v-6h3v6h-3Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 19h16v2H2V3h2v16Zm3-2V9h3v8H7Zm5 0V5h3v12h-3Zm5 0v-6h3v6h-3Z'/%3E%3C/svg%3E");
}

.project-modal .project-detail-card.tech .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m8.7 16.3-1.4 1.4L1.6 12l5.7-5.7 1.4 1.4L4.4 12l4.3 4.3Zm6.6 0 4.3-4.3-4.3-4.3 1.4-1.4 5.7 5.7-5.7 5.7-1.4-1.4ZM11.4 20l-1.9-.6L12.6 4l1.9.6L11.4 20Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='m8.7 16.3-1.4 1.4L1.6 12l5.7-5.7 1.4 1.4L4.4 12l4.3 4.3Zm6.6 0 4.3-4.3-4.3-4.3 1.4-1.4 5.7 5.7-5.7 5.7-1.4-1.4ZM11.4 20l-1.9-.6L12.6 4l1.9.6L11.4 20Z'/%3E%3C/svg%3E");
}

.project-modal .project-detail-card.learned .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 21h6v-2H9v2Zm3-20A7 7 0 0 0 8 13.7V17h8v-3.3A7 7 0 0 0 12 1Zm2 14h-4v-2.2l-.5-.4A5 5 0 1 1 14.5 12l-.5.4V15Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 21h6v-2H9v2Zm3-20A7 7 0 0 0 8 13.7V17h8v-3.3A7 7 0 0 0 12 1Zm2 14h-4v-2.2l-.5-.4A5 5 0 1 1 14.5 12l-.5.4V15Z'/%3E%3C/svg%3E");
}

.project-modal .project-detail-card.roadmap .project-detail-icon::before {
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 4h12v7H3V4Zm2 2v3h8V6H5Zm4 7h12v7H9v-7Zm2 2v3h8v-3h-8ZM6 11h2v3h3v2H6v-5Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M3 4h12v7H3V4Zm2 2v3h8V6H5Zm4 7h12v7H9v-7Zm2 2v3h8v-3h-8ZM6 11h2v3h3v2H6v-5Z'/%3E%3C/svg%3E");
}

/* ATBAI Project Modal Premium Cards v1 - safe */

/* jemnější pohyb jen pro detail cards */
.project-modal .project-detail-card {
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease !important;
}

.project-modal .project-detail-card:hover {
  transform: translateY(-2px) !important;
}

/* icon glow */
.project-modal .project-detail-icon {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.05),
    0 0 24px rgba(255,255,255,.04) !important;
}

/* Problem */
.project-modal .project-detail-card.problem {
  background:
    radial-gradient(circle at 7% 20%, rgba(255,111,111,.13), transparent 30%),
    linear-gradient(135deg, rgba(255,111,111,.055), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 0 0 1px rgba(255,111,111,.04) !important;
}

.project-modal .project-detail-card.problem:hover {
  border-color: rgba(255,111,111,.55) !important;
  box-shadow:
    0 18px 50px rgba(255,111,111,.08),
    inset 0 0 0 1px rgba(255,111,111,.08) !important;
}

.project-modal .project-detail-card.problem .project-detail-icon {
  box-shadow: 0 0 26px rgba(255,111,111,.16) !important;
}

/* Solution */
.project-modal .project-detail-card.solution {
  background:
    radial-gradient(circle at 7% 20%, rgba(117,246,207,.16), transparent 30%),
    linear-gradient(135deg, rgba(117,246,207,.06), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 0 0 1px rgba(117,246,207,.04) !important;
}

.project-modal .project-detail-card.solution:hover {
  border-color: rgba(117,246,207,.55) !important;
  box-shadow:
    0 18px 50px rgba(117,246,207,.09),
    inset 0 0 0 1px rgba(117,246,207,.08) !important;
}

.project-modal .project-detail-card.solution .project-detail-icon {
  box-shadow: 0 0 28px rgba(117,246,207,.18) !important;
}

/* Status */
.project-modal .project-detail-card.status {
  background:
    radial-gradient(circle at 7% 20%, rgba(92,220,255,.15), transparent 30%),
    linear-gradient(135deg, rgba(92,220,255,.055), rgba(255,255,255,.025)) !important;
}

.project-modal .project-detail-card.status:hover {
  border-color: rgba(92,220,255,.55) !important;
  box-shadow:
    0 18px 50px rgba(92,220,255,.08),
    inset 0 0 0 1px rgba(92,220,255,.08) !important;
}

.project-modal .project-detail-card.status .project-detail-icon {
  box-shadow: 0 0 28px rgba(92,220,255,.16) !important;
}

/* Technologie */
.project-modal .project-detail-card.tech {
  background:
    radial-gradient(circle at 7% 20%, rgba(183,120,255,.16), transparent 30%),
    linear-gradient(135deg, rgba(183,120,255,.06), rgba(255,255,255,.025)) !important;
}

.project-modal .project-detail-card.tech:hover {
  border-color: rgba(183,120,255,.58) !important;
  box-shadow:
    0 18px 50px rgba(183,120,255,.09),
    inset 0 0 0 1px rgba(183,120,255,.08) !important;
}

.project-modal .project-detail-card.tech .project-detail-icon {
  box-shadow: 0 0 28px rgba(183,120,255,.18) !important;
}

/* Learned */
.project-modal .project-detail-card.learned {
  background:
    radial-gradient(circle at 7% 20%, rgba(255,195,92,.15), transparent 30%),
    linear-gradient(135deg, rgba(255,195,92,.055), rgba(255,255,255,.025)) !important;
}

.project-modal .project-detail-card.learned:hover {
  border-color: rgba(255,195,92,.55) !important;
  box-shadow:
    0 18px 50px rgba(255,195,92,.08),
    inset 0 0 0 1px rgba(255,195,92,.08) !important;
}

.project-modal .project-detail-card.learned .project-detail-icon {
  box-shadow: 0 0 28px rgba(255,195,92,.17) !important;
}

/* Roadmap */
.project-modal .project-detail-card.roadmap {
  background:
    radial-gradient(circle at 7% 20%, rgba(92,220,255,.13), transparent 30%),
    linear-gradient(135deg, rgba(92,220,255,.05), rgba(255,255,255,.025)) !important;
}

.project-modal .project-detail-card.roadmap:hover {
  border-color: rgba(92,220,255,.50) !important;
  box-shadow:
    0 18px 50px rgba(92,220,255,.07),
    inset 0 0 0 1px rgba(92,220,255,.08) !important;
}

.project-modal .project-detail-card.roadmap .project-detail-icon {
  box-shadow: 0 0 28px rgba(92,220,255,.15) !important;
}

/* ATBAI Top Architecture Icons v3 - JS class based */

.project-modal .arch-node .icon {
  font-size: 0 !important;
  display: grid !important;
  place-items: center !important;
}

.project-modal .arch-node .icon::before {
  content: "" !important;
  width: 28px !important;
  height: 28px !important;
  display: block !important;
  background: #5cdcff !important;
  mask-size: contain !important;
  mask-position: center !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  -webkit-mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
}

.project-modal .arch-node.arch-jobs .icon::before {
  background: #5cdcff !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm6.9 9h-3.1a15.7 15.7 0 0 0-1.2-5 8.1 8.1 0 0 1 4.3 5ZM12 4.1c.7 1 1.5 3 1.8 6.9h-3.6C10.5 7.1 11.3 5.1 12 4.1ZM4.2 13h3.9c.1 2 .4 3.7.9 5.1A8.1 8.1 0 0 1 4.2 13Zm3.9-2H4.2A8.1 8.1 0 0 1 9 5.9 18 18 0 0 0 8.1 11Zm3.9 8.9c-.7-1-1.5-3-1.8-6.9h3.6c-.3 3.9-1.1 5.9-1.8 6.9Zm3-1.8c.5-1.4.8-3.1.9-5.1h3.9a8.1 8.1 0 0 1-4.8 5.1Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm6.9 9h-3.1a15.7 15.7 0 0 0-1.2-5 8.1 8.1 0 0 1 4.3 5ZM12 4.1c.7 1 1.5 3 1.8 6.9h-3.6C10.5 7.1 11.3 5.1 12 4.1ZM4.2 13h3.9c.1 2 .4 3.7.9 5.1A8.1 8.1 0 0 1 4.2 13Zm3.9-2H4.2A8.1 8.1 0 0 1 9 5.9 18 18 0 0 0 8.1 11Zm3.9 8.9c-.7-1-1.5-3-1.8-6.9h3.6c-.3 3.9-1.1 5.9-1.8 6.9Zm3-1.8c.5-1.4.8-3.1.9-5.1h3.9a8.1 8.1 0 0 1-4.8 5.1Z'/%3E%3C/svg%3E");
}

.project-modal .arch-node.arch-linkedin .icon::before {
  background: #5cdcff !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4.98 3.5A2.5 2.5 0 1 1 5 8.5a2.5 2.5 0 0 1-.02-5ZM3 21h4V9H3v12Zm7-12h3.8v1.7h.1c.5-.9 1.8-1.9 3.7-1.9 4 0 4.7 2.6 4.7 6V21h-4v-5.3c0-1.3 0-3-1.8-3s-2.1 1.4-2.1 2.9V21h-4V9Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4.98 3.5A2.5 2.5 0 1 1 5 8.5a2.5 2.5 0 0 1-.02-5ZM3 21h4V9H3v12Zm7-12h3.8v1.7h.1c.5-.9 1.8-1.9 3.7-1.9 4 0 4.7 2.6 4.7 6V21h-4v-5.3c0-1.3 0-3-1.8-3s-2.1 1.4-2.1 2.9V21h-4V9Z'/%3E%3C/svg%3E");
}

.project-modal .arch-node.arch-ai .icon::before {
  background: #75f6cf !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7v3h2V9a5 5 0 0 1 10 0v1h2V9a7 7 0 0 0-7-7Zm0 4a3 3 0 0 0-3 3v3c0 4.5-2.2 6.6-2.3 6.7L8 20.2c.1-.1 3-2.8 3-8.2V9a1 1 0 1 1 2 0v3c0 5.4 2.9 8.1 3 8.2l1.3-1.5c-.1-.1-2.3-2.2-2.3-6.7V9a3 3 0 0 0-3-3Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 0-7 7v3h2V9a5 5 0 0 1 10 0v1h2V9a7 7 0 0 0-7-7Zm0 4a3 3 0 0 0-3 3v3c0 4.5-2.2 6.6-2.3 6.7L8 20.2c.1-.1 3-2.8 3-8.2V9a1 1 0 1 1 2 0v3c0 5.4 2.9 8.1 3 8.2l1.3-1.5c-.1-.1-2.3-2.2-2.3-6.7V9a3 3 0 0 0-3-3Z'/%3E%3C/svg%3E");
}

.project-modal .arch-node.arch-scoring {
  border-color: rgba(183,120,255,.42) !important;
}

.project-modal .arch-node.arch-scoring .icon::before {
  background: #b778ff !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8.5 3A3.5 3.5 0 0 0 5 6.5v.2A3.8 3.8 0 0 0 3 10a3.7 3.7 0 0 0 1.3 2.8A4.2 4.2 0 0 0 8.5 20H10V3H8.5Zm7 0H14v17h1.5a4.2 4.2 0 0 0 4.2-7.2A3.7 3.7 0 0 0 21 10a3.8 3.8 0 0 0-2-3.3v-.2A3.5 3.5 0 0 0 15.5 3ZM8 7h2v2H8a1 1 0 0 0-1 1H5a3 3 0 0 1 3-3Zm6 0h2a3 3 0 0 1 3 3h-2a1 1 0 0 0-1-1h-2V7Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M8.5 3A3.5 3.5 0 0 0 5 6.5v.2A3.8 3.8 0 0 0 3 10a3.7 3.7 0 0 0 1.3 2.8A4.2 4.2 0 0 0 8.5 20H10V3H8.5Zm7 0H14v17h1.5a4.2 4.2 0 0 0 4.2-7.2A3.7 3.7 0 0 0 21 10a3.8 3.8 0 0 0-2-3.3v-.2A3.5 3.5 0 0 0 15.5 3ZM8 7h2v2H8a1 1 0 0 0-1 1H5a3 3 0 0 1 3-3Zm6 0h2a3 3 0 0 1 3 3h-2a1 1 0 0 0-1-1h-2V7Z'/%3E%3C/svg%3E");
}

.project-modal .arch-node.arch-notion .icon::before {
  background: #ffffff !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 3.5 17.8 2 21 4.5v15.2L6.2 22 3 19.5V5.2l1-.2V3.5Zm2 3.2v12.1l12.8-1.8V5.8L6 6.7Zm2.2 2.1 2.9-.2 3.7 5.7V8.3l2.2-.2v9l-2.5.2-4-6.1v6.4l-2.3.2v-9Z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M4 3.5 17.8 2 21 4.5v15.2L6.2 22 3 19.5V5.2l1-.2V3.5Zm2 3.2v12.1l12.8-1.8V5.8L6 6.7Zm2.2 2.1 2.9-.2 3.7 5.7V8.3l2.2-.2v9l-2.5.2-4-6.1v6.4l-2.3.2v-9Z'/%3E%3C/svg%3E");
}


/* ATBAI Top Architecture Brand Fix v1 */

/* vypneme předchozí masky jen v horní architektuře */
.project-modal .project-architecture .arch-node .icon::before {
  mask-image: none !important;
  -webkit-mask-image: none !important;
  background: none !important;
}

/* společný základ */
.project-modal .project-architecture .arch-node .icon {
  width: 48px !important;
  height: 48px !important;
  margin: 0 auto 10px !important;
  border-radius: 14px !important;
  display: grid !important;
  place-items: center !important;
  font-size: 0 !important;
}

/* Jobs.cz - lupa */
.project-modal .project-architecture .arch-node.arch-jobs .icon::before {
  content: "⌕" !important;
  font-size: 34px !important;
  line-height: 1 !important;
  color: #5cdcff !important;
  background: transparent !important;
}

/* LinkedIn - skutečný styl */
.project-modal .project-architecture .arch-node.arch-linkedin .icon {
  background: #0a66c2 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 26px rgba(10,102,194,.32) !important;
}

.project-modal .project-architecture .arch-node.arch-linkedin .icon::before {
  content: "in" !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 28px !important;
  font-weight: 900 !important;
  letter-spacing: -0.08em !important;
  color: #fff !important;
  background: transparent !important;
}

/* AI filtr - robot/AI */
.project-modal .project-architecture .arch-node.arch-ai .icon::before {
  content: "AI" !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: -.04em !important;
  color: #75f6cf !important;
  background: transparent !important;
}

/* Scoring - brain */
.project-modal .project-architecture .arch-node.arch-scoring .icon::before {
  content: "☷" !important;
  font-size: 34px !important;
  line-height: 1 !important;
  color: #b778ff !important;
  background: transparent !important;
}

/* Notion - kostka s N */
.project-modal .project-architecture .arch-node.arch-notion .icon {
  background: #fff !important;
  border: 2px solid #fff !important;
  border-radius: 9px !important;
  box-shadow: 0 0 24px rgba(255,255,255,.18) !important;
  transform: rotate(-2deg) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon::before {
  content: "N" !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  color: #111 !important;
  background: transparent !important;
}

/* Notion pseudo 3D horní hrana */
.project-modal .project-architecture .arch-node.arch-notion .icon::after {
  content: "" !important;
  position: absolute !important;
  top: -5px !important;
  left: 7px !important;
  width: 33px !important;
  height: 9px !important;
  border: 2px solid #111 !important;
  border-bottom: 0 !important;
  border-radius: 5px 5px 0 0 !important;
  background: #fff !important;
  transform: skewX(18deg) !important;
}


/* ATBAI Top Architecture SVG Icons v1 */

.project-modal .project-architecture .arch-node .icon::before,
.project-modal .project-architecture .arch-node .icon::after {
  display: none !important;
  content: none !important;
}

.project-modal .project-architecture .arch-node .icon {
  width: 56px !important;
  height: 56px !important;
  margin: 0 auto 12px !important;
  border-radius: 18px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03) !important;
}

.project-modal .project-architecture .arch-node .icon img {
  width: 32px !important;
  height: 32px !important;
  object-fit: contain !important;
  display: block !important;
  filter: brightness(0) invert(1) !important;
}

.project-modal .project-architecture .arch-node.arch-linkedin .icon {
  background: #0a66c2 !important;
  border-color: rgba(10,102,194,.65) !important;
  box-shadow: 0 0 30px rgba(10,102,194,.28) !important;
}

.project-modal .project-architecture .arch-node.arch-linkedin .icon img {
  filter: brightness(0) invert(1) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon {
  background: #ffffff !important;
  border-color: rgba(255,255,255,.85) !important;
  box-shadow: 0 0 26px rgba(255,255,255,.16) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon img {
  filter: none !important;
}

.project-modal .project-architecture .arch-node.arch-ai .icon {
  border-color: rgba(117,246,207,.35) !important;
  box-shadow: 0 0 28px rgba(117,246,207,.16) !important;
}

.project-modal .project-architecture .arch-node.arch-scoring .icon {
  border-color: rgba(183,120,255,.38) !important;
  box-shadow: 0 0 28px rgba(183,120,255,.16) !important;
}


/* ATBAI Neon Architecture Icons - closer to original mockup */

.project-modal .project-architecture .architecture-flow {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  overflow-x: auto !important;
  padding: 6px 0 2px !important;
}

.project-modal .project-architecture .arch-node {
  min-width: 112px !important;
  max-width: 122px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center !important;
}

.project-modal .project-architecture .arch-node .icon {
  width: 72px !important;
  height: 72px !important;
  margin: 0 auto 12px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(92,220,255,.07) !important;
  border: 2px solid rgba(92,220,255,.34) !important;
  box-shadow:
    0 0 22px rgba(92,220,255,.13),
    inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

.project-modal .project-architecture .arch-node .icon svg {
  width: 42px !important;
  height: 42px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.project-modal .project-architecture .arch-node.arch-jobs .icon {
  color: #5cdcff !important;
}

.project-modal .project-architecture .arch-node.arch-collect .icon,
.project-modal .project-architecture .arch-node.arch-dedupe .icon {
  color: #75f6cf !important;
  border-color: rgba(117,246,207,.42) !important;
  box-shadow: 0 0 24px rgba(117,246,207,.15) !important;
}

.project-modal .project-architecture .arch-node.arch-ai .icon {
  color: #c77dff !important;
  border-color: rgba(199,125,255,.5) !important;
  box-shadow: 0 0 28px rgba(199,125,255,.2) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon,
.project-modal .project-architecture .arch-node.arch-decision .icon {
  color: #ffffff !important;
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: 0 0 22px rgba(255,255,255,.10) !important;
}

.project-modal .project-architecture .arch-node strong {
  font-size: 15px !important;
  line-height: 1.15 !important;
  margin-bottom: 7px !important;
}

.project-modal .project-architecture .arch-node span {
  font-size: 14px !important;
  line-height: 1.35 !important;
  color: rgba(213,224,244,.74) !important;
}

.project-modal .project-architecture .arch-arrow {
  display: flex !important;
  align-items: center !important;
  padding-top: 25px !important;
  color: #75f6cf !important;
  font-size: 28px !important;
  text-shadow: 0 0 16px rgba(117,246,207,.55) !important;
}


/* ATBAI Architecture fit + Notion fix */

.project-modal .project-architecture .architecture-flow {
  overflow-x: visible !important;
  display: grid !important;
  grid-template-columns: repeat(11, auto) !important;
  align-items: start !important;
  gap: 10px !important;
}

.project-modal .project-architecture .arch-node {
  min-width: 82px !important;
  max-width: 92px !important;
}

.project-modal .project-architecture .arch-node .icon {
  width: 62px !important;
  height: 62px !important;
  border-radius: 15px !important;
  margin-bottom: 10px !important;
}

.project-modal .project-architecture .arch-node .icon svg {
  width: 36px !important;
  height: 36px !important;
}

.project-modal .project-architecture .arch-arrow {
  padding-top: 22px !important;
  font-size: 22px !important;
  min-width: 16px !important;
}

/* čistší Notion styl */
.project-modal .project-architecture .arch-node.arch-notion .icon {
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(255,255,255,.9) !important;
  color: #111 !important;
  transform: rotate(-2deg) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon svg {
  display: none !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon::before {
  display: block !important;
  content: "N" !important;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  color: #111 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 34px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}


/* Notion icon closer to mockup */

.project-modal .project-architecture .arch-node.arch-notion .icon {
  background:
    linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.03)) !important;
  border: 2px solid rgba(117,246,207,.46) !important;
  color: #ffffff !important;
  transform: none !important;
  box-shadow:
    0 0 24px rgba(117,246,207,.14),
    inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon svg {
  display: none !important;
}

.project-modal .project-architecture .arch-node.arch-notion .icon::before {
  content: "" !important;
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  background: #fff !important;
  color: transparent !important;
  font-size: 0 !important;
  mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='4' stroke-linejoin='round'%3E%3Cpath d='M18 16 45 13l7 6v32l-31 4-7-6V19l4-3Z'/%3E%3Cpath d='M21 21v29l27-3V19l-27 2Z'/%3E%3Cpath d='M27 42V26l4-.4 10 14V24.5l4-.5v20l-5 .6-10-14v15l-3 .4Z'/%3E%3C/g%3E%3C/svg%3E") !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='black' stroke-width='4' stroke-linejoin='round'%3E%3Cpath d='M18 16 45 13l7 6v32l-31 4-7-6V19l4-3Z'/%3E%3Cpath d='M21 21v29l27-3V19l-27 2Z'/%3E%3Cpath d='M27 42V26l4-.4 10 14V24.5l4-.5v20l-5 .6-10-14v15l-3 .4Z'/%3E%3C/g%3E%3C/svg%3E") !important;
  mask-size: contain !important;
  mask-position: center !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-size: contain !important;
  -webkit-mask-position: center !important;
  -webkit-mask-repeat: no-repeat !important;
}


/* Architecture text alignment polish */

.project-modal .project-architecture .arch-node {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.project-modal .project-architecture .arch-node strong {
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 15px !important;
  line-height: 1.18 !important;
  margin: 0 0 8px !important;
}

.project-modal .project-architecture .arch-node span {
  min-height: 58px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.project-modal .project-architecture .arch-arrow {
  align-self: flex-start !important;
  padding-top: 34px !important;
}


/* FORCE project-specific architecture icon colors */

.project-modal .project-architecture .arch-node.arch-sap .icon,
.project-modal .project-architecture .arch-node.arch-sap .icon svg {
  color: #4ea3ff !important;
  stroke: #4ea3ff !important;
}

.project-modal .project-architecture .arch-node.arch-analysis .icon,
.project-modal .project-architecture .arch-node.arch-analysis .icon svg {
  color: #5cdcff !important;
  stroke: #5cdcff !important;
}

.project-modal .project-architecture .arch-node.arch-group .icon,
.project-modal .project-architecture .arch-node.arch-group .icon svg {
  color: #75f6cf !important;
  stroke: #75f6cf !important;
}

.project-modal .project-architecture .arch-node.arch-ticket .icon,
.project-modal .project-architecture .arch-node.arch-ticket .icon svg {
  color: #ffc35c !important;
  stroke: #ffc35c !important;
}

.project-modal .project-architecture .arch-node.arch-servicenow .icon,
.project-modal .project-architecture .arch-node.arch-servicenow .icon svg {
  color: #86ed78 !important;
  stroke: #86ed78 !important;
}

.project-modal .project-architecture .arch-node.arch-decision .icon,
.project-modal .project-architecture .arch-node.arch-decision .icon svg {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

/* border + glow */
.project-modal .project-architecture .arch-node.arch-sap .icon {
  border-color: rgba(78,163,255,.55) !important;
  box-shadow: 0 0 28px rgba(78,163,255,.22) !important;
}

.project-modal .project-architecture .arch-node.arch-analysis .icon {
  border-color: rgba(92,220,255,.50) !important;
  box-shadow: 0 0 26px rgba(92,220,255,.18) !important;
}

.project-modal .project-architecture .arch-node.arch-group .icon {
  border-color: rgba(117,246,207,.52) !important;
  box-shadow: 0 0 28px rgba(117,246,207,.20) !important;
}

.project-modal .project-architecture .arch-node.arch-ticket .icon {
  border-color: rgba(255,195,92,.56) !important;
  box-shadow: 0 0 28px rgba(255,195,92,.20) !important;
}

.project-modal .project-architecture .arch-node.arch-servicenow .icon {
  border-color: rgba(134,237,120,.52) !important;
  box-shadow: 0 0 28px rgba(134,237,120,.18) !important;
}


/* Remaining project architecture colors */

.project-modal .project-architecture .arch-node.arch-market .icon,
.project-modal .project-architecture .arch-node.arch-market .icon svg {
  color: #5cdcff !important;
  stroke: #5cdcff !important;
}

.project-modal .project-architecture .arch-node.arch-rules .icon,
.project-modal .project-architecture .arch-node.arch-rules .icon svg {
  color: #ffc35c !important;
  stroke: #ffc35c !important;
}

.project-modal .project-architecture .arch-node.arch-alert .icon,
.project-modal .project-architecture .arch-node.arch-alert .icon svg {
  color: #ff6f6f !important;
  stroke: #ff6f6f !important;
}

.project-modal .project-architecture .arch-node.arch-workflow .icon,
.project-modal .project-architecture .arch-node.arch-workflow .icon svg {
  color: #75f6cf !important;
  stroke: #75f6cf !important;
}

.project-modal .project-architecture .arch-node.arch-calendar .icon,
.project-modal .project-architecture .arch-node.arch-calendar .icon svg {
  color: #b778ff !important;
  stroke: #b778ff !important;
}

.project-modal .project-architecture .arch-node.arch-market .icon { border-color: rgba(92,220,255,.50) !important; box-shadow: 0 0 26px rgba(92,220,255,.18) !important; }
.project-modal .project-architecture .arch-node.arch-rules .icon { border-color: rgba(255,195,92,.52) !important; box-shadow: 0 0 26px rgba(255,195,92,.18) !important; }
.project-modal .project-architecture .arch-node.arch-alert .icon { border-color: rgba(255,111,111,.52) !important; box-shadow: 0 0 26px rgba(255,111,111,.18) !important; }
.project-modal .project-architecture .arch-node.arch-workflow .icon { border-color: rgba(117,246,207,.52) !important; box-shadow: 0 0 26px rgba(117,246,207,.18) !important; }
.project-modal .project-architecture .arch-node.arch-calendar .icon { border-color: rgba(183,120,255,.52) !important; box-shadow: 0 0 26px rgba(183,120,255,.18) !important; }


/* DK Market Watch - Telegram notification final */

.project-modal .project-architecture .arch-node.arch-alert .icon,
.project-modal .project-architecture .arch-node.arch-alert .icon svg {
  color: #2AABEE !important;
  stroke: #2AABEE !important;
}

.project-modal .project-architecture .arch-node.arch-alert .icon {
  border-color: rgba(42,171,238,.56) !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(42,171,238,.14), rgba(42,171,238,.05) 55%, rgba(255,255,255,.02) 100%) !important;
  box-shadow:
    inset 0 0 18px rgba(42,171,238,.08),
    0 0 28px rgba(42,171,238,.22) !important;
}

.project-modal .project-architecture .arch-node.arch-alert .icon svg {
  fill: none !important;
  stroke-width: 2.4 !important;
  filter: drop-shadow(0 0 6px rgba(42,171,238,.45)) !important;
}


/* ===== DK Market Watch - Market icon ===== */

.arch-market .icon{
    border-color:#46d2ff !important;

    background:
        radial-gradient(circle at 35% 28%,
            rgba(70,210,255,.18),
            rgba(70,210,255,.06) 55%,
            rgba(255,255,255,.02) 100%) !important;

    box-shadow:
        inset 0 0 22px rgba(70,210,255,.10),
        0 0 24px rgba(70,210,255,.22) !important;
}

.arch-market .icon svg{
    stroke:#59d8ff !important;
    fill:none !important;
    stroke-width:2.4 !important;

    filter:
        drop-shadow(0 0 4px rgba(89,216,255,.45))
        drop-shadow(0 0 10px rgba(89,216,255,.25));
}

.arch-market .icon::after{
    content:"";
    position:absolute;
    inset:-16px;
    border-radius:50%;
    background:radial-gradient(circle,
        rgba(70,210,255,.18),
        transparent 72%);
    pointer-events:none;
}



/* DK Market Watch - price icon green only */

.project-modal .project-architecture .arch-node.arch-price .icon,
.project-modal .project-architecture .arch-node.arch-price .icon svg {
  color: #4ef28d !important;
  stroke: #4ef28d !important;
}

.project-modal .project-architecture .arch-node.arch-price .icon {
  border-color: rgba(78,242,141,.55) !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(78,242,141,.16), rgba(78,242,141,.05) 58%, rgba(255,255,255,.02) 100%) !important;
  box-shadow:
    inset 0 0 18px rgba(78,242,141,.08),
    0 0 26px rgba(78,242,141,.22) !important;
}


/* Project header icon */

.project-modal-left {
  position: relative !important;
}

.project-header-icon {
  width: 68px !important;
  height: 68px !important;
  border-radius: 18px !important;
  display: grid !important;
  place-items: center !important;
  margin-bottom: 14px !important;
  background: rgba(92,220,255,.08) !important;
  border: 2px solid rgba(92,220,255,.38) !important;
  box-shadow:
    0 0 28px rgba(92,220,255,.16),
    inset 0 0 0 1px rgba(255,255,255,.05) !important;
}

.project-header-icon svg {
  width: 40px !important;
  height: 40px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.6 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* project-specific colors */
.project-header-icon.ai-job-hunter {
  color: #75f6cf !important;
}

.project-header-icon.sap-idoc-automation {
  color: #4ea3ff !important;
  border-color: rgba(78,163,255,.48) !important;
  box-shadow: 0 0 28px rgba(78,163,255,.18) !important;
}

.project-header-icon.dk-market-watch {
  color: #4ef28d !important;
  border-color: rgba(78,242,141,.52) !important;
  box-shadow: 0 0 28px rgba(78,242,141,.18) !important;
}

.project-header-icon.lead-processing {
  color: #2AABEE !important;
  border-color: rgba(42,171,238,.52) !important;
  box-shadow: 0 0 28px rgba(42,171,238,.18) !important;
}

.project-header-icon.business-analytics-tracker {
  color: #ffc35c !important;
  border-color: rgba(255,195,92,.52) !important;
  box-shadow: 0 0 28px rgba(255,195,92,.18) !important;
}


/* Project header visual cards */

.project-header-icon.project-visual-card {
  width: 180px !important;
  height: 78px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin-bottom: 20px !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  display: block !important;
}

.project-header-icon.project-visual-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 22px !important;
  border: 1px solid rgba(92,220,255,.28) !important;
  box-shadow: 0 0 32px rgba(92,220,255,.12) !important;
}


/* Replace wide project visuals with compact project app icons */

.project-header-icon.project-visual-card {
  width: 76px !important;
  height: 76px !important;
  margin-bottom: 18px !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(92,220,255,.08) !important;
  border: 1px solid rgba(92,220,255,.35) !important;
  box-shadow:
    0 0 26px rgba(92,220,255,.16),
    inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

.project-header-icon.project-visual-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 18px !important;
  border: 0 !important;
  box-shadow: none !important;
}