* { box-sizing: border-box; }:root {
  --bg: #0f0f12;
  --bg-elevated: #131318;
  --surface: #1a1a1f;
  --surface-hover: #1e1e26;
  --border: #2d2d35;
  --border-focus: rgba(255, 215, 0, 0.65);
  --text: #f8f8f8;
  --text-secondary: #c4c4d0;
  --muted: #8888a0;
  --accent: #e11d48;
  --accent-soft: rgba(225, 29, 72, 0.16);
  --accent-hover: #f43f5e;
  --gold: #d4af37;
  --gold-soft: rgba(212, 175, 55, 0.2);
  --white-soft: #f9fafb;
  --success: #22c55e;
  --danger: #ef4444;
  --radius-lg: 14px;
  --radius-md: 10px;
  --radius-sm: 8px;
  --shadow-soft: 0 20px 50px rgba(0, 0, 0, 0.45);
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.25);
  --shadow-card-hover: 0 8px 32px rgba(0, 0, 0, 0.3);
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.28s ease;
  --app-font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0.05s ease;
    --transition-normal: 0.08s ease;
    --transition-slow: 0.12s ease;
  }
}html {
  scroll-behavior: smooth;
  width: 100%;
  overflow-x: hidden;
  max-width: 100%;
  font-family: var(--app-font-family);
}body {
  margin: 0;
  min-height: 100vh;
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  max-width: 100%;
  font-family: var(--app-font-family);
  background: radial-gradient(ellipse 120% 80% at 50% -20%, rgba(220, 38, 38, 0.16), transparent 52%),
    radial-gradient(ellipse 80% 50% at 80% 50%, rgba(212, 175, 55, 0.12), transparent 50%),
    linear-gradient(180deg, #12080b 0%, #14060b 38%, #08070a 100%);
  color: var(--text);
  /* Reduce outer whitespace; spacing handled by modern panels. */
  padding: 0;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}.app-shell {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  /* Minimal outer inset for the whole app. */
  padding: 0.35rem;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  /* Let the inner panels (cards) define structure; remove outdated outer frame. */
  background: transparent;
  border-radius: 0;
  border: none;
  box-shadow: none;
  transition: none;
}.app-shell:hover {
  box-shadow: none;
}.app-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}.app-title-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}.app-title {
  margin: 0;
  font-size: clamp(1.35rem, 2.8vw, 1.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
  line-height: 1.25;
}.app-title-row {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}.app-subtitle {
  margin: 0;
  font-size: clamp(0.8rem, 1.2vw, 0.875rem);
  color: var(--muted);
  max-width: 540px;
  line-height: 1.45;
}.app-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--muted);
  background: rgba(15, 23, 42, 0.7);
  width: fit-content;
}.app-header-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}.app-header-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
}.app-header-actions small {
  font-size: 0.68rem;
  color: var(--muted);
}.data-pill-group {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.2rem 0.5rem;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(148, 163, 184, 0.4);
  background: rgba(15, 23, 42, 0.85);
  transition: border-color var(--transition-fast);
}.data-pill-group:hover {
  border-color: rgba(148, 163, 184, 0.6);
}.data-pill-group--rates {
  flex-direction: column;
  align-items: flex-start;
}.data-pill-group--rates .data-pill-label {
  margin-right: 0;
}.exchange-rates-date-label {
  margin: 0.25rem 0 0 0;
  font-size: 0.65rem;
  line-height: 1.3;
  color: var(--muted);
}.data-pill-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  margin-right: 0.25rem;
}.data-pill-btn {
  border-radius: var(--radius-sm);
  border: none;
  padding: 0.25rem 0.55rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  box-shadow: none;
  transition: background var(--transition-fast), color var(--transition-fast);
}.data-pill-btn:hover {
  background: rgba(37, 99, 235, 0.35);
}.data-pill-btn.secondary {
  color: var(--muted);
}.data-pill-divider {
  width: 1px;
  height: 16px;
  background: rgba(55, 65, 81, 0.9);
  margin-inline: 0.15rem;
}.app-layout {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1.9fr);
  grid-template-rows: auto;
  gap: 1rem;
  align-items: start;
  flex: 0 1 auto;
  min-height: 0;
  width: 100%;
}

@media (max-width: 1400px) {
  .app-layout {
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }
}

@media (max-width: 640px) {
  .app-layout {
    gap: 0.75rem;
  }
}

@media (max-width: 520px) {
  .app-header {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    margin-bottom: 1.25rem;
  }
  .app-header-actions {
    align-items: stretch;
  }
  .app-header-actions-row {
    justify-content: stretch;
  }
  .app-header-actions-row .data-pill-group {
    flex: 1;
  }
}.card {
  background: linear-gradient(165deg, rgba(185, 28, 28, 0.18) 0%, rgba(26, 12, 16, 0.98) 100%);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(148, 163, 184, 0.22);
  padding: 1.05rem 1.15rem;
  box-shadow: var(--shadow-card);
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-normal);
}.card:hover {
  border-color: rgba(148, 163, 184, 0.32);
  box-shadow: var(--shadow-card-hover);
}.card-plain {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.97) 0%, rgba(15, 23, 42, 0.94) 100%);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(51, 65, 85, 0.75);
  padding: 1.05rem 1.15rem;
  box-shadow: var(--shadow-card);
  min-height: 0;
  display: flex;
  flex-direction: column;
}.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
  flex-wrap: wrap;
}.card-title {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a5b4fc;
}.card-caption {
  margin: 0;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.4;
}label {
  display: block;
  margin-bottom: 0.3rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
  font-weight: 500;
}input,
select,
textarea,
button {
  font: inherit;
}input,
select,
textarea {
  width: 100%;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: rgba(15, 23, 42, 0.9);
  color: var(--text);
  padding: 0.55rem 0.7rem;
  font-size: 0.875rem;
  min-height: 40px;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}/* Force exact typing for numeric fields: remove browser spinner controls. */
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--border-focus);
  box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.2);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px var(--border-focus);
}textarea {
  resize: vertical;
  min-height: 70px;
  max-height: 180px;
}button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  border-radius: var(--radius-md);
  border: none;
  padding: 0.55rem 0.95rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast), opacity var(--transition-fast);
  background: linear-gradient(135deg, #b91c1c, #dc2626);
  color: var(--white-soft);
  box-shadow: 0 4px 14px rgba(185, 28, 28, 0.4);
}button:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(185, 28, 28, 0.5);
  background: linear-gradient(135deg, #b91c1c, #ef4444);
}button:active {
  transform: translateY(0);
  box-shadow: 0 2px 10px rgba(79, 70, 229, 0.45);
}button:disabled {
  opacity: 0.55;
  cursor: default;
  box-shadow: none;
  transform: none;
}.btn-secondary {
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.55);
  color: #e5e7eb;
  box-shadow: none;
}.btn-secondary:hover {
  background: rgba(30, 64, 175, 0.35);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.9);
}.btn-danger {
  background: linear-gradient(135deg, #dc2626, #f97373);
  box-shadow: 0 12px 30px rgba(220, 38, 38, 0.55);
}.btn-ghost {
  background: transparent;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  padding-inline: 0.75rem;
  color: var(--muted);
  box-shadow: none;
}.btn-ghost:hover {
  background: rgba(15, 23, 42, 0.9);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.9);
  color: #e5e7eb;
}.pill {
  border-radius: 999px;
  padding: 0.25rem 0.6rem;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: 1px solid rgba(148, 163, 184, 0.35);
  color: var(--muted);
  background: rgba(15, 23, 42, 0.85);
}.pill-accent {
  border-color: rgba(129, 140, 248, 0.75);
  color: #a5b4fc;
  background: radial-gradient(circle at top left, rgba(129, 140, 248, 0.35), rgba(15, 23, 42, 0.96));
}.pill-muted {
  background: rgba(15, 23, 42, 0.9);
}/* Profiles panel */
.profiles-panel {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}.profile-form-row {
  display: flex;
  gap: 0.5rem;
  align-items: flex-end;
  flex-wrap: wrap;
}.profile-form-field {
  flex: 1 1 0;
  min-width: 0;
}.profile-form-field label {
  display: block;
  margin-bottom: 0.25rem;
}.profile-form-row input {
  width: 100%;
}.profile-add-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.65rem 1.15rem;
  min-height: 44px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(96, 165, 250, 0.45);
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(15, 23, 42, 0.98) 100%);
  color: #93c5fd;
  font-size: 0.875rem;
  font-weight: 500;
  transition: border-color var(--transition-normal), background var(--transition-normal), box-shadow var(--transition-normal), color var(--transition-normal);
}.profile-add-btn:hover {
  border-color: rgba(96, 165, 250, 0.8);
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.35) 0%, rgba(15, 23, 42, 0.98) 100%);
  box-shadow: 0 4px 16px rgba(30, 64, 175, 0.3);
  color: #bfdbfe;
}.profile-add-btn-icon {
  flex-shrink: 0;
}.profile-add-btn-text {
  white-space: nowrap;
}.profile-password-hint {
  flex: 1 1 100%;
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--muted);
}.profile-password-error {
  margin-top: 0.35rem;
}.profile-locked-banner {
  margin-bottom: 0.85rem;
  padding: 0.75rem 0.9rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(212, 175, 55, 0.55);
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.65), rgba(254, 226, 226, 0.55));
}.profile-locked-banner-inner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}.profile-locked-banner-icon {
  font-size: 1.25rem;
  line-height: 1;
}.profile-locked-banner-text {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  color: var(--id-text-soft, var(--muted));
}.profile-locked-banner-copy {
  flex: 1 1 200px;
  min-width: 0;
}.profile-locked-unlock-form {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex: 1 1 280px;
  min-width: min(100%, 320px);
}.profile-locked-unlock-form input[type="password"] {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 40px;
  border-radius: 12px;
}.profile-locked-unlock-form button[type="submit"] {
  flex-shrink: 0;
  min-height: 40px;
  padding-inline: 1rem;
}.profile-locked-unlock-alt-btn {
  flex: 0 0 auto;
  font-size: 0.75rem;
  white-space: nowrap;
}.profile-locked-inline-error {
  margin: 0.45rem 0 0;
}.filters-shell--locked {
  opacity: 0.55;
  pointer-events: none;
  user-select: none;
}.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}.profile-item-lock-badge {
  margin-left: 0.35rem;
  font-size: 0.85rem;
  line-height: 1;
  opacity: 0.9;
}.profile-delete-password-wrap {
  margin-top: 0.75rem;
}.profile-delete-password-wrap label {
  display: block;
  margin-bottom: 0.25rem;
}.profile-delete-password-wrap input {
  width: 100%;
  max-width: 320px;
}

@media (max-width: 520px) {
  .profile-form-row {
    flex-direction: column;
    align-items: stretch;
  }
  .profile-form-field {
    flex: 0 0 auto;
  }
  .profile-add-btn {
    align-self: flex-start;
  }
}.profiles-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
}.profile-item-row {
  display: flex;
  align-items: stretch;
  gap: 0.35rem;
  position: relative;
  padding: 0.15rem 0;
}.profile-item-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}.profile-icon-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(148, 163, 184, 0.4);
  background: rgba(15, 23, 42, 0.9);
  color: #94a3b8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast);
}/* View: blue/cyan – read-only,
info */
.profile-icon-btn--view {
  color: #67e8f9;
  border-color: rgba(34, 211, 238, 0.45);
  background: rgba(6, 182, 212, 0.12);
}.profile-icon-btn--view:hover {
  color: #a5f3fc;
  border-color: rgba(34, 211, 238, 0.8);
  background: rgba(6, 182, 212, 0.22);
  transform: translateY(-1px);
}/* Edit: amber – modify */
.profile-icon-btn--edit {
  color: #fcd34d;
  border-color: rgba(251, 191, 36, 0.5);
  background: rgba(245, 158, 11, 0.12);
}.profile-icon-btn--edit:hover {
  color: #fde68a;
  border-color: rgba(251, 191, 36, 0.85);
  background: rgba(245, 158, 11, 0.22);
  transform: translateY(-1px);
}/* Delete: red – destructive */
.profile-icon-btn--danger {
  color: #fca5a5;
  border-color: rgba(248, 113, 113, 0.5);
  background: rgba(239, 68, 68, 0.1);
}.profile-icon-btn--danger:hover {
  color: #fee2e2;
  border-color: rgba(248, 113, 113, 0.9);
  background: rgba(248, 113, 113, 0.2);
  transform: translateY(-1px);
}.profile-icon-btn svg {
  display: block;
  pointer-events: none;
}.profile-icon-wrap {
  position: relative;
  display: inline-flex;
}.roadmap-field-tooltip-wrap {
  position: relative;
  min-width: 0;
}.profile-item-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
}.profile-item-name {
  font-size: 0.86rem;
  font-weight: 600;
}.profile-item-meta {
  font-size: 0.72rem;
  color: var(--muted);
}.profile-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  font-size: 0.72rem;
  color: var(--muted);
  margin-top: 0.25rem;
}.profile-empty {
  font-size: 0.8rem;
  color: var(--muted);
}

@media (max-width: 420px) {
  .profile-item-row {
    flex-wrap: wrap;
  }
  .profile-item-actions {
    width: 100%;
    justify-content: flex-end;
    padding-top: 0.25rem;
  }
}/* Roadmaps side */
.roadmaps-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}.roadmaps-header-left {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}.roadmaps-header-title {
  font-size: clamp(0.875rem, 1.5vw, 0.95rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #93c5fd;
}.roadmaps-header-subtitle {
  font-size: clamp(0.75rem, 1.1vw, 0.8125rem);
  color: var(--muted);
  line-height: 1.4;
}.roadmaps-header-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 0.8125rem;
  margin-top: 0.25rem;
}.roadmaps-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}/* View toggle: Table / Board */
.view-toggle-group {
  display: inline-flex;
  border-radius: var(--radius-md);
  border: 1px solid rgba(148, 163, 184, 0.4);
  background: rgba(15, 23, 42, 0.8);
  padding: 0.2rem;
  gap: 0.15rem;
}.view-toggle-btn {
  padding: 0.4rem 0.75rem;
  min-height: 36px;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast);
}.view-toggle-btn:hover {
  color: #e5e7eb;
  background: rgba(148, 163, 184, 0.15);
}.view-toggle-btn--active {
  background: rgba(185, 28, 28, 0.38);
  color: #fff1f2;
  box-shadow: 0 2px 8px rgba(185, 28, 28, 0.3);
}.view-toggle-btn--active:hover {
  background: rgba(220, 38, 38, 0.48);
  color: #fff7ed;
}.view-toggle-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}/* Roadmaps view container */
.roadmaps-view {
  min-height: 0;
  display: flex;
  flex-direction: column;
}.roadmaps-view--board {
  flex: 1;
  min-height: 400px;
  display: flex;
  flex-direction: column;
}.roadmaps-view--board .scrum-board-toolbar {
  flex-shrink: 0;
}.roadmaps-view--board .scrum-board {
  flex: 1;
  min-height: 0;
  align-items: stretch;
}.roadmaps-view--table {
  flex: 1;
  min-height: 400px;
  display: flex;
  flex-direction: column;
}.roadmaps-view--table .roadmaps-table-toolbar {
  flex-shrink: 0;
}.roadmaps-view--table .table-wrapper {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
}.roadmaps-view--map {
  flex: 0 0 auto;
  flex-direction: column;
  min-height: 0;
  align-self: start;
}.roadmaps-view--map .roadmaps-map-toolbar {
  flex-shrink: 0;
  position: relative;
  z-index: 5;
  overflow: visible;
}.roadmaps-view--map .roadmaps-map-legend {
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}.roadmaps-view--map .roadmaps-map-container {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 2.05 / 1;
  height: auto;
  max-height: min(42vh, 480px);
  min-height: 0;
  overflow: hidden;
}.roadmaps-view--map .roadmaps-map-container .leaflet-container {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}.roadmaps-view--raci {
  flex: 1;
  min-height: 400px;
  display: flex;
  flex-direction: column;
}.roadmaps-view--raci .roadmaps-raci-toolbar {
  flex-shrink: 0;
}.roadmaps-view--raci .raci-matrix-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid rgba(212, 175, 55, 0.38);
  border-radius: 14px;
  background: linear-gradient(180deg, #fffdfb 0%, #fffaf4 100%);
  box-shadow: 0 8px 26px rgba(127, 29, 29, 0.07);
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}.raci-matrix-board-host {
  min-width: 0;
  width: 100%;
}.raci-matrix-board-host--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 12rem;
}.raci-matrix-board {
  width: 100%;
}/* Desktop table panel — hidden on tablet/phone */
.raci-matrix-table-panel {
  display: none;
}.raci-matrix-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0.65rem;
}.raci-matrix-domain-toggle__buttons {
  position: relative;
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(4.5rem, 1fr));
  gap: 0.22rem;
  padding: 0.24rem;
  border-radius: 12px;
  border: 1px solid rgba(212, 175, 55, 0.55);
  background: linear-gradient(180deg, #fffdf8 0%, #fff7e8 100%);
  box-shadow: 0 2px 10px rgba(180, 83, 9, 0.1);
}.raci-matrix-domain-indicator {
  position: absolute;
  top: 0.24rem;
  bottom: 0.24rem;
  left: 0.24rem;
  width: calc((100% - 0.48rem - 0.44rem) / 3);
  border-radius: 9px;
  background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%);
  box-shadow: 0 4px 12px rgba(185, 28, 28, 0.24);
  pointer-events: none;
  z-index: 0;
  transition: transform 0.24s cubic-bezier(0.34, 1.02, 0.38, 1);
  will-change: transform;
}.raci-matrix-domain-toggle__buttons[data-active-domain="Tech"] .raci-matrix-domain-indicator {
  transform: translateX(calc(100% + 0.22rem));
}.raci-matrix-domain-toggle__buttons[data-active-domain="All"] .raci-matrix-domain-indicator {
  transform: translateX(calc(200% + 0.44rem));
}.raci-matrix-domain-btn {
  position: relative;
  z-index: 1;
  min-height: 36px;
  padding: 0.4rem 0.95rem;
  border: none !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #8a5b16 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: none !important;
  filter: none !important;
  transition: color 0.18s ease, transform 0.12s ease !important;
}.raci-matrix-domain-btn:hover:not(.raci-matrix-domain-btn--active) {
  color: #9f1239 !important;
  transform: translateY(-0.5px);
  filter: none !important;
  box-shadow: none !important;
}.raci-matrix-domain-btn--active,
.raci-matrix-domain-btn[aria-selected="true"] {
  color: #fff9f4 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}.raci-matrix-domain-btn:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(185, 28, 28, 0.42) !important;
}.raci-matrix-empty {
  margin: 2rem 1.25rem;
  padding: 1.25rem 1rem;
  font-size: 0.9rem;
  line-height: 1.5;
  color: #78716c;
  text-align: center;
  border-radius: 12px;
  border: 1px dashed rgba(202, 138, 4, 0.28);
  background: rgba(255, 251, 245, 0.72);
}/* Shared role badge */
.raci-matrix-role-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.45rem;
  height: 1.45rem;
  border-radius: 7px;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
}[data-raci-role="responsible"] .raci-matrix-role-badge,
.raci-matrix-grid__cell--role[data-raci-role="responsible"] .raci-matrix-role-badge,
.raci-matrix-card__role[data-raci-role="responsible"] .raci-matrix-role-badge {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid rgba(59, 130, 246, 0.28);
}[data-raci-role="accountable"] .raci-matrix-role-badge,
.raci-matrix-grid__cell--role[data-raci-role="accountable"] .raci-matrix-role-badge,
.raci-matrix-card__role[data-raci-role="accountable"] .raci-matrix-role-badge {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid rgba(16, 185, 129, 0.32);
}[data-raci-role="consulted"] .raci-matrix-role-badge,
.raci-matrix-grid__cell--role[data-raci-role="consulted"] .raci-matrix-role-badge,
.raci-matrix-card__role[data-raci-role="consulted"] .raci-matrix-role-badge {
  background: #fffbeb;
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.32);
}[data-raci-role="informed"] .raci-matrix-role-badge,
.raci-matrix-grid__cell--role[data-raci-role="informed"] .raci-matrix-role-badge,
.raci-matrix-card__role[data-raci-role="informed"] .raci-matrix-role-badge {
  background: #f5f3ff;
  color: #6d28d9;
  border: 1px solid rgba(139, 92, 246, 0.28);
}/* Desktop grid (5 columns: Roadmap + 4 RACI roles) */
.raci-matrix-grid {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(202, 138, 4, 0.2);
  border-radius: 12px;
  overflow: hidden;
  background: #fffdfb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}.raci-matrix-grid__row {
  display: grid;
  grid-template-columns: minmax(14rem, 1.2fr) repeat(4, minmax(8.5rem, 1fr));
  grid-auto-flow: row;
  align-items: stretch;
  border-bottom: 1px solid rgba(202, 138, 4, 0.1);
  transition: background 0.14s ease;
}.raci-matrix-grid__row:last-child {
  border-bottom: none;
}.raci-matrix-grid__row--head {
  position: sticky;
  top: 0;
  z-index: 4;
  background: linear-gradient(180deg, #fff8eb 0%, #fff3dc 100%);
  box-shadow: 0 2px 8px rgba(127, 29, 29, 0.06);
  border-bottom: 1px solid rgba(202, 138, 4, 0.2);
}.raci-matrix-grid__row--head::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, #3b82f6 0%, #059669 33%, #d97706 66%, #7c3aed 100%);
  pointer-events: none;
}.raci-matrix-grid__cell {
  min-width: 0;
  padding: 0.62rem 0.75rem;
  text-align: left;
  border-right: 1px solid rgba(202, 138, 4, 0.08);
}.raci-matrix-grid__cell:last-child {
  border-right: none;
}.raci-matrix-grid__cell--roadmap {
  border-right: 1px solid rgba(202, 138, 4, 0.16);
}.raci-matrix-grid__row--head .raci-matrix-grid__cell {
  padding-top: 0.78rem;
  padding-bottom: 0.68rem;
  font-size: 0.67rem;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #92400e;
}.raci-matrix-grid__row--head .raci-matrix-grid__cell--roadmap {
  font-size: 0.68rem;
  letter-spacing: 0.08em;
}.raci-matrix-grid__row--head .raci-matrix-col-head__label {
  font-size: 0.67rem;
}.raci-matrix-grid__cell--role[data-raci-role="responsible"] {
  box-shadow: inset 0 3px 0 #3b82f6;
}.raci-matrix-grid__cell--role[data-raci-role="accountable"] {
  box-shadow: inset 0 3px 0 #059669;
}.raci-matrix-grid__cell--role[data-raci-role="consulted"] {
  box-shadow: inset 0 3px 0 #d97706;
}.raci-matrix-grid__cell--role[data-raci-role="informed"] {
  box-shadow: inset 0 3px 0 #7c3aed;
}.raci-matrix-grid__row:not(.raci-matrix-grid__row--head):nth-child(even) {
  background: rgba(255, 251, 245, 0.45);
}.raci-matrix-grid__row:not(.raci-matrix-grid__row--head):nth-child(even) .raci-matrix-grid__cell--roadmap {
  background: rgba(255, 249, 240, 0.65);
}.raci-matrix-grid__row:not(.raci-matrix-grid__row--head):hover {
  background: #fff7ed;
}.raci-matrix-grid__row:not(.raci-matrix-grid__row--head):hover .raci-matrix-grid__cell--roadmap {
  background: #fff3e8;
}.raci-matrix-grid__row--external-profile {
  background: rgba(238, 242, 255, 0.28);
}.raci-matrix-grid__row--external-profile .raci-matrix-grid__cell--roadmap {
  background: rgba(238, 242, 255, 0.28);
}.raci-matrix-grid__row--external-profile .raci-matrix-grid__roadmap--has-owner {
  border-color: rgba(199, 210, 254, 0.62);
  box-shadow:
    inset 3px 0 0 rgba(99, 102, 241, 0.55),
    0 1px 4px rgba(99, 102, 241, 0.08);
}.raci-matrix-grid__cell--roadmap {
  position: sticky;
  left: 0;
  z-index: 1;
  background: #fffdfb;
  display: flex;
  align-items: stretch;
  padding-top: 0.48rem;
  padding-bottom: 0.48rem;
}.raci-matrix-grid__row--head .raci-matrix-grid__cell--roadmap {
  z-index: 5;
  background: linear-gradient(180deg, #fff8eb 0%, #fff3dc 100%);
  align-items: flex-end;
}.raci-matrix-grid__roadmap {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  width: 100%;
  align-self: stretch;
}.raci-matrix-grid__roadmap--has-owner {
  gap: 0;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(199, 210, 254, 0.45);
  background: #fffdfb;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.06);
}.raci-matrix-grid__roadmap--has-owner .raci-matrix-grid__roadmap-link {
  flex: 1 1 auto;
  border-left: none !important;
  border-radius: 0 !important;
  padding: 0.38rem 0.52rem 0.4rem 0.55rem !important;
  background: transparent !important;
}.raci-matrix-grid__roadmap--has-owner .raci-matrix-grid__roadmap-link:hover {
  background: rgba(255, 247, 237, 0.72) !important;
}.raci-matrix-grid__roadmap-link {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0.32rem 0.5rem 0.32rem 0.62rem !important;
  border: none !important;
  border-left: 3px solid rgba(202, 138, 4, 0.5) !important;
  border-radius: 0 6px 6px 0 !important;
  background: transparent !important;
  color: #9a3412 !important;
  font-size: 0.83rem !important;
  font-weight: 700 !important;
  line-height: 1.35;
  letter-spacing: 0.015em;
  text-align: left !important;
  text-decoration: none !important;
  text-transform: none;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  cursor: pointer;
  box-shadow: none !important;
  filter: none !important;
  transition: color 0.14s ease, border-color 0.14s ease, background 0.14s ease !important;
}.raci-matrix-grid__roadmap-link:hover {
  color: #7c2d12 !important;
  border-left-color: #dc2626 !important;
  background: rgba(255, 247, 237, 0.65) !important;
  box-shadow: none !important;
  transform: none !important;
}.raci-matrix-grid__roadmap-link:focus-visible {
  outline: none !important;
  box-shadow: inset 0 0 0 2px rgba(220, 38, 38, 0.2) !important;
  background: rgba(255, 247, 237, 0.5) !important;
}.raci-matrix-col-head {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  min-width: 0;
}.raci-matrix-col-head__label {
  line-height: 1.15;
  white-space: nowrap;
}.raci-matrix-grid .raci-matrix-role-value,
.raci-matrix-grid .raci-matrix-role-value--grid {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  width: 100%;
}.raci-matrix-grid .raci-matrix-name-list {
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0.28rem;
  align-items: center;
}.raci-matrix-grid .raci-matrix-name-list--compact {
  max-width: 100%;
}.raci-matrix-grid .raci-matrix-role-value--compact {
  min-width: 0;
}.raci-matrix-domain-stack {
  display: flex;
  flex-direction: column;
  gap: 0.32rem;
  width: 100%;
  min-width: 0;
}.raci-matrix-domain-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.28rem;
  align-items: start;
  min-width: 0;
}.raci-matrix-domain-row__mark {
  flex-shrink: 0;
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  color: #78716c;
  line-height: 1.35;
  padding-top: 0.18rem;
  white-space: nowrap;
}.raci-matrix-domain-row--tech .raci-matrix-domain-row__mark {
  color: #1d4ed8;
}.raci-matrix-domain-row--business .raci-matrix-domain-row__mark {
  color: #b45309;
}.raci-matrix-with-tooltip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-width: 0;
  cursor: help;
  outline: none;
  border-radius: 8px;
}.raci-matrix-with-tooltip:focus-visible,
.raci-matrix-with-tooltip:hover {
  border-radius: 8px;
}.raci-matrix-with-tooltip:focus-visible {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(185, 28, 28, 0.28);
}.raci-matrix-with-tooltip:hover .raci-matrix-name-chip--more,
.raci-matrix-with-tooltip:focus-visible .raci-matrix-name-chip--more {
  color: #57534e;
  border-color: rgba(120, 113, 108, 0.5);
  background: #fafaf9;
}.cell-type-tooltip--raci {
  min-width: min(11rem, calc(100vw - 1.5rem));
  max-width: min(18rem, calc(100vw - 1.5rem));
  border-radius: 10px !important;
  background: linear-gradient(180deg, #fffefb 0%, #fff8ef 100%) !important;
  border: 1px solid rgba(202, 138, 4, 0.35) !important;
  box-shadow:
    0 12px 28px rgba(63, 15, 25, 0.14),
    0 0 0 1px rgba(202, 138, 4, 0.12) !important;
  opacity: 0;
  visibility: hidden;
}.cell-type-tooltip--raci.cell-type-tooltip-visible {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto;
}.cell-type-tooltip--raci.cell-type-tooltip--scroll.cell-type-tooltip-visible {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}.cell-type-tooltip--raci.cell-type-tooltip--scroll.cell-type-tooltip--below.cell-type-tooltip-visible {
  transform: translate(-50%, 0) !important;
}.cell-type-tooltip--raci.cell-type-tooltip--scroll.cell-type-tooltip-visible:not(.cell-type-tooltip--below) {
  transform: translate(-50%, -100%) !important;
}.cell-type-tooltip--raci .cell-type-tooltip-title {
  padding: 0.5rem 0.75rem 0.42rem !important;
  font-size: 0.67rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: #92400e !important;
  border-bottom: 1px solid rgba(202, 138, 4, 0.2) !important;
  background: transparent !important;
}.cell-type-tooltip--raci .raci-matrix-tooltip-body {
  padding: 0.45rem 0.75rem 0.55rem !important;
  color: #292524 !important;
}.raci-matrix-tooltip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}.raci-matrix-tooltip-item {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  min-width: 0;
}.raci-matrix-tooltip-item__avatar {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}.raci-matrix-tooltip-item[data-raci-role="responsible"] .raci-matrix-tooltip-item__avatar {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid rgba(59, 130, 246, 0.28);
}.raci-matrix-tooltip-item[data-raci-role="accountable"] .raci-matrix-tooltip-item__avatar {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid rgba(16, 185, 129, 0.32);
}.raci-matrix-tooltip-item[data-raci-role="consulted"] .raci-matrix-tooltip-item__avatar {
  background: #fffbeb;
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.32);
}.raci-matrix-tooltip-item[data-raci-role="informed"] .raci-matrix-tooltip-item__avatar {
  background: #f5f3ff;
  color: #6d28d9;
  border: 1px solid rgba(139, 92, 246, 0.28);
}.raci-matrix-tooltip-item__name {
  font-size: 0.8rem;
  font-weight: 600;
  color: #292524;
  line-height: 1.3;
  word-break: break-word;
}.cell-type-tooltip--raci.cell-type-tooltip--scroll .raci-matrix-tooltip-body {
  max-height: min(220px, 42vh);
  overflow-y: auto;
  overscroll-behavior: contain;
}.raci-matrix-grid .raci-matrix-name-chip--more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 1.55rem;
  height: 22px;
  padding: 0 0.38rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.01em;
  color: #78716c;
  background: rgba(245, 245, 244, 0.95);
  border: 1px solid rgba(168, 162, 158, 0.38);
  box-shadow: none;
  pointer-events: none;
}.raci-matrix-grid .raci-matrix-name-chip--more:hover {
  color: #57534e;
  border-color: rgba(120, 113, 108, 0.45);
  background: #fafaf9;
}.raci-matrix-grid .raci-matrix-name-chip {
  padding: 0.18rem 0.42rem 0.18rem 0.18rem;
  border-color: rgba(148, 163, 184, 0.22);
  box-shadow: none;
  max-width: 100%;
}.raci-matrix-grid .raci-matrix-name-chip__avatar {
  width: 22px;
  height: 22px;
  font-size: 0.58rem;
}.raci-matrix-grid .raci-matrix-name-chip__label {
  font-size: 0.76rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 9rem;
}.raci-matrix-cell-empty {
  display: inline-flex;
  align-items: center;
  color: #d6d3d1;
  font-size: 0.9rem;
  font-weight: 500;
  font-style: normal;
  line-height: 1;
}.raci-matrix-grid .raci-matrix-cell-empty {
  padding: 0;
  min-width: 0;
  min-height: 0;
  border: none;
  background: transparent;
  color: #d6d3d1;
}.raci-matrix-table-panel .raci-matrix-cell-empty {
  justify-content: flex-start;
}.raci-matrix-role-value {
  min-width: 0;
}/* Mobile / tablet cards */
.raci-matrix-card {
  border: 1px solid rgba(202, 138, 4, 0.24);
  border-radius: 14px;
  background: #fffdfb;
  box-shadow: 0 2px 12px rgba(127, 29, 29, 0.06);
  overflow: hidden;
  transition: box-shadow 0.18s ease, border-color 0.18s ease;
}.raci-matrix-card:hover {
  border-color: rgba(202, 138, 4, 0.38);
  box-shadow: 0 4px 18px rgba(127, 29, 29, 0.09);
}.raci-matrix-card--external-profile {
  border-color: rgba(199, 210, 254, 0.55);
  box-shadow:
    0 0 0 1px rgba(99, 102, 241, 0.16),
    0 2px 12px rgba(79, 70, 229, 0.08);
}.raci-matrix-card--has-owner {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
}.raci-matrix-card--has-owner > .roadmap-owner-identity--card-strip {
  flex-shrink: 0;
  border-radius: 13px 13px 0 0;
  margin: 0;
}.raci-matrix-card--has-owner .raci-matrix-card__header {
  border-top: none;
  padding-top: 0.62rem;
}.raci-matrix-card__header {
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.14);
  background: linear-gradient(180deg, #fffefb 0%, #fff8f0 100%);
}.raci-matrix-card__roles {
  display: flex;
  flex-direction: column;
}.raci-matrix-card__role {
  display: grid;
  grid-template-columns: minmax(7.25rem, 36%) minmax(0, 1fr);
  gap: 0.45rem 0.65rem;
  align-items: start;
  padding: 0.62rem 0.85rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.08);
}.raci-matrix-card__role:last-child {
  border-bottom: none;
}.raci-matrix-card__role-label {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  min-width: 0;
  padding-top: 0.15rem;
}.raci-matrix-card__role-name {
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #92400e;
  line-height: 1.25;
}.raci-matrix-card__role[data-raci-role="responsible"] .raci-matrix-card__role-name {
  color: #1e40af;
}.raci-matrix-card__role[data-raci-role="accountable"] .raci-matrix-card__role-name {
  color: #047857;
}.raci-matrix-card__role[data-raci-role="consulted"] .raci-matrix-card__role-name {
  color: #b45309;
}.raci-matrix-card__role[data-raci-role="informed"] .raci-matrix-card__role-name {
  color: #6d28d9;
}.raci-matrix-card__role-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.28rem;
}.raci-matrix-card__role-value {
  min-width: 0;
}.raci-matrix-card__domain-stack {
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  min-width: 0;
}.raci-matrix-card__domain-row {
  display: block;
  min-width: 0;
}.raci-matrix-card__domain-row .raci-matrix-card__role-body {
  width: 100%;
}.raci-matrix-name-chip__domain {
  flex-shrink: 0;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1;
  color: #78716c;
}.raci-matrix-name-chip--tech .raci-matrix-name-chip__domain {
  color: #1d4ed8;
}.raci-matrix-name-chip--business .raci-matrix-name-chip__domain {
  color: #b45309;
}.raci-matrix-card .raci-matrix-name-chip__domain {
  margin-right: 0.08rem;
}.raci-matrix-name-chip--empty {
  color: #a8a29e;
  background: rgba(250, 250, 249, 0.95);
  border-style: dashed;
}.raci-matrix-name-chip__label--empty {
  color: #a8a29e;
  font-weight: 600;
}.raci-matrix-card__domain-row--collapsed .raci-matrix-card__role-extra {
  display: none;
}.raci-matrix-card__role--collapsed .raci-matrix-card__role-extra {
  display: none;
}.raci-matrix-card__role--expandable.raci-matrix-card__role--collapsed .raci-matrix-name-list,
.raci-matrix-card__domain-row--expandable.raci-matrix-card__domain-row--collapsed .raci-matrix-name-list {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.28rem;
}.raci-matrix-card__role--expandable.raci-matrix-card__role--collapsed .raci-matrix-name-chip:first-child,
.raci-matrix-card__domain-row--expandable.raci-matrix-card__domain-row--collapsed .raci-matrix-name-chip:first-child {
  flex: 1 1 auto;
  min-width: 0;
  max-width: calc(100% - 3.25rem);
}.raci-matrix-card__role--expandable.raci-matrix-card__role--collapsed
  .raci-matrix-name-chip:first-child
  .raci-matrix-name-chip__label,
.raci-matrix-card__domain-row--expandable.raci-matrix-card__domain-row--collapsed
  .raci-matrix-name-chip:first-child
  .raci-matrix-name-chip__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.raci-matrix-card__role--expandable.raci-matrix-card__role--collapsed .raci-matrix-name-chip--more,
.raci-matrix-card__domain-row--expandable.raci-matrix-card__domain-row--collapsed .raci-matrix-name-chip--more {
  flex: 0 0 auto;
}.raci-matrix-card__role--expanded .raci-matrix-name-list,
.raci-matrix-card__domain-row--expanded .raci-matrix-name-list {
  flex-direction: column;
  align-items: stretch;
  gap: 0.38rem;
}.raci-matrix-card__role--expanded .raci-matrix-name-chip:first-child,
.raci-matrix-card__domain-row--expanded .raci-matrix-name-chip:first-child {
  max-width: 100%;
}.raci-matrix-card__role--expanded
  .raci-matrix-name-chip:first-child
  .raci-matrix-name-chip__label,
.raci-matrix-card__domain-row--expanded
  .raci-matrix-name-chip:first-child
  .raci-matrix-name-chip__label {
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}.raci-matrix-name-chip-item--more {
  list-style: none;
  display: contents;
}.raci-matrix-card .raci-matrix-name-chip--more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 2.15rem;
  min-height: 32px;
  padding: 0.22rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.01em;
  color: #57534e;
  background: rgba(245, 245, 244, 0.95);
  border: 1px solid rgba(168, 162, 158, 0.42);
  box-shadow: none !important;
  filter: none !important;
  cursor: pointer;
  text-transform: none;
  width: auto !important;
  max-width: none !important;
  gap: 0;
}.raci-matrix-card .raci-matrix-name-chip--more:hover {
  color: #44403c;
  border-color: rgba(120, 113, 108, 0.5);
  background: #fafaf9 !important;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06) !important;
}.raci-matrix-card__role--expanded .raci-matrix-name-chip--more,
.raci-matrix-card__domain-row--expanded .raci-matrix-name-chip--more {
  align-self: flex-start;
  border-color: rgba(202, 138, 4, 0.35);
  background: linear-gradient(180deg, #fffefb 0%, #fff7ed 100%) !important;
  color: #92400e !important;
}.raci-matrix-card__role--expanded .raci-matrix-card__role-body {
  flex-direction: column;
  align-items: stretch;
}.raci-matrix-card .raci-matrix-name-chip--more:focus-visible,
.raci-matrix-card__role-toggle:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(185, 28, 28, 0.28);
}.raci-matrix-card .raci-matrix-roadmap-link {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.55rem 0.65rem !important;
  border: 1px solid rgba(202, 138, 4, 0.24) !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #fffefb 0%, #fff7ed 100%) !important;
  color: #9a3412 !important;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
  text-decoration: none !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  min-height: 44px;
  box-shadow: 0 1px 3px rgba(120, 53, 15, 0.06) !important;
}.raci-matrix-card .raci-matrix-roadmap-link:hover {
  color: #7c2d12 !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
  background: linear-gradient(180deg, #fff 0%, #fff7ed 100%) !important;
  box-shadow: 0 4px 14px rgba(127, 29, 29, 0.1) !important;
}.raci-matrix-name-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  min-width: 0;
}.raci-matrix-name-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  max-width: 100%;
  min-width: 0;
  padding: 0.22rem 0.52rem 0.22rem 0.22rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.28);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}.raci-matrix-name-chip__avatar {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}[data-raci-role="responsible"] .raci-matrix-name-chip__avatar {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid rgba(59, 130, 246, 0.28);
}[data-raci-role="accountable"] .raci-matrix-name-chip__avatar {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid rgba(16, 185, 129, 0.32);
}[data-raci-role="consulted"] .raci-matrix-name-chip__avatar {
  background: #fffbeb;
  color: #b45309;
  border: 1px solid rgba(245, 158, 11, 0.32);
}[data-raci-role="informed"] .raci-matrix-name-chip__avatar {
  background: #f5f3ff;
  color: #6d28d9;
  border: 1px solid rgba(139, 92, 246, 0.28);
}.raci-matrix-name-chip__label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #292524;
  line-height: 1.25;
  word-break: break-word;
  overflow-wrap: anywhere;
  min-width: 0;
}/* Desktop: show grid,
hide cards */
@media (min-width: 1025px) {
  .raci-matrix-table-panel {
    display: block;
    padding: 0;
    min-height: 0;
  }

  .roadmaps-view--raci {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .roadmaps-view--raci .raci-matrix-wrap {
    flex: 1 1 auto;
    min-height: 280px;
    max-height: min(72vh, 720px);
    height: min(65vh, 640px);
    overflow-x: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
  }

  .raci-matrix-board-host:not(.raci-matrix-board-host--empty) {
    padding: 0;
    min-height: min-content;
  }

  .raci-matrix-grid {
    overflow: visible;
  }

  .raci-matrix-grid__row--head {
    top: 0;
    z-index: 6;
  }

  .raci-matrix-grid__row:not(.raci-matrix-grid__row--head) {
    min-height: 2.85rem;
  }

  .raci-matrix-grid__cell--role {
    display: flex;
    align-items: flex-start;
    padding-top: 0.58rem;
    padding-bottom: 0.58rem;
  }

  .raci-matrix-grid .raci-matrix-role-value {
    align-items: flex-start;
    min-height: 0;
  }

  .raci-matrix-cards {
    display: none;
  }
}/* Tablet & phone: show cards,
hide table */
@media (max-width: 1024px) {
  .roadmaps-view--raci .roadmaps-raci-toolbar .view-toolbar__row--primary {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  .roadmaps-view--raci .view-toolbar__cluster--compact-controls {
    width: 100%;
    justify-content: space-between;
    gap: 0.5rem;
  }

  .roadmaps-view--raci .raci-matrix-domain-toggle {
    flex: 1;
    min-width: 0;
  }

  .raci-matrix-domain-toggle__buttons {
    width: 100%;
    max-width: none;
  }

  .roadmaps-view--raci .raci-matrix-wrap {
    overflow: visible;
  }

  .raci-matrix-card__role--all-domains {
    grid-template-columns: 1fr;
    gap: 0.42rem;
  }

  .raci-matrix-card__role--all-domains .raci-matrix-card__domain-stack {
    width: 100%;
  }

  .raci-matrix-cards {
    padding: 0.65rem;
  }

  .raci-matrix-empty {
    margin: 1rem 0.65rem;
    padding: 1rem 0.75rem;
    font-size: 0.85rem;
  }
}

@media (max-width: 480px) {
  .raci-matrix-cards {
    padding: 0.5rem;
    gap: 0.6rem;
  }

  .raci-matrix-card__role {
    grid-template-columns: 1fr;
    gap: 0.32rem;
    padding: 0.55rem 0.72rem;
  }

  .raci-matrix-card__role-toggle {
    min-height: 36px;
    font-size: 0.74rem;
    padding-inline: 0.72rem;
  }

  .raci-matrix-card .raci-matrix-name-chip--more {
    min-height: 36px;
    font-size: 0.74rem;
    padding-inline: 0.72rem;
  }

  .raci-matrix-card__role-label {
    padding-top: 0;
  }

  .raci-matrix-domain-btn {
    min-height: 40px;
    font-size: 0.68rem !important;
    padding-inline: 0.65rem !important;
  }

  .raci-matrix-name-chip__avatar {
    width: 24px;
    height: 24px;
    font-size: 0.6rem;
  }

  .raci-matrix-name-chip__label {
    font-size: 0.78rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .raci-matrix-domain-indicator,
  .raci-matrix-domain-btn,
  .raci-matrix-roadmap-link,
  .raci-matrix-card,
  .raci-matrix-card__role-toggle {
    transition: none !important;
  }
}.roadmaps-map-toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}.roadmaps-map-fullscreen-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-left: auto;
  padding: 0.35rem 0.6rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.4);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}.roadmaps-map-fullscreen-btn:hover {
  color: #e5e7eb;
  background: rgba(148, 163, 184, 0.15);
  border-color: rgba(148, 163, 184, 0.5);
}.roadmaps-map-fullscreen-btn .roadmaps-map-fullscreen-icon {
  flex-shrink: 0;
}/* Shared fullscreen button (board + MOSCOW) */
.view-fullscreen-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.6rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.4);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}.view-fullscreen-btn:hover {
  color: #e5e7eb;
  background: rgba(148, 163, 184, 0.15);
  border-color: rgba(148, 163, 184, 0.5);
}.view-fullscreen-btn .view-fullscreen-icon {
  flex-shrink: 0;
}.moscow-view-header {
  margin-bottom: 0.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 1rem;
}.moscow-view-header .view-fullscreen-btn {
  margin-left: auto;
}.moscow-sort-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}.moscow-sort-toggle input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
  cursor: pointer;
}.moscow-sort-toggle:hover {
  color: #e5e7eb;
}.roadmaps-map-metric-label {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--muted);
}.roadmaps-map-legend {
  font-size: 0.85rem;
  color: var(--muted);
  margin-bottom: 0.5rem;
}.roadmaps-map-legend--categorical {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.85rem;
  line-height: 1.45;
}.roadmaps-map-legend__summary {
  flex: 1 1 12rem;
  min-width: 0;
}.roadmaps-map-legend__swatches {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
}.roadmaps-map-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  color: var(--text);
  white-space: nowrap;
}.roadmaps-map-legend__swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}.roadmaps-map-container {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 2.05 / 1;
  height: auto;
  max-height: min(42vh, 480px);
  min-height: 0;
  background: var(--bg-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
}/* Fullscreen: map view fills the screen and map container grows */
.roadmaps-view--map:fullscreen,
.roadmaps-view--map::-webkit-full-screen,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--map {
  background: var(--bg-subtle);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
}.roadmaps-view--map:fullscreen .roadmaps-map-toolbar,
.roadmaps-view--map::-webkit-full-screen .roadmaps-map-toolbar,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--map .roadmaps-map-toolbar,
.roadmaps-view--map:fullscreen .roadmaps-map-legend,
.roadmaps-view--map::-webkit-full-screen .roadmaps-map-legend,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--map .roadmaps-map-legend {
  flex-shrink: 0;
}.roadmaps-view--map:fullscreen .roadmaps-map-container,
.roadmaps-view--map::-webkit-full-screen .roadmaps-map-container,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--map .roadmaps-map-container {
  flex: 1;
  min-height: 0;
}/* Fullscreen: board view */
.roadmaps-view--board:fullscreen,
.roadmaps-view--board::-webkit-full-screen,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--board {
  background: var(--bg);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
}.roadmaps-view--board:fullscreen .scrum-board-toolbar,
.roadmaps-view--board::-webkit-full-screen .scrum-board-toolbar,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--board .scrum-board-toolbar {
  flex-shrink: 0;
}.roadmaps-view--board:fullscreen .scrum-board,
.roadmaps-view--board::-webkit-full-screen .scrum-board,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--board .scrum-board {
  flex: 1;
  min-height: 0;
  overflow-x: auto;
  overflow-y: hidden;
}/* Fullscreen: MOSCOW view */
.roadmaps-view--moscow:fullscreen,
.roadmaps-view--moscow::-webkit-full-screen,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--moscow {
  background: var(--bg);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
}.roadmaps-view--moscow:fullscreen .moscow-view-header,
.roadmaps-view--moscow::-webkit-full-screen .moscow-view-header,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--moscow .moscow-view-header {
  flex-shrink: 0;
}.roadmaps-view--moscow:fullscreen .moscow-grid,
.roadmaps-view--moscow::-webkit-full-screen .moscow-grid,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--moscow .moscow-grid {
  flex: 1;
  min-height: 0;
  max-height: none;
}/* Fullscreen: table view */
.roadmaps-table-toolbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0.5rem 0;
  gap: 0.5rem;
}.refresh-rates-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
}.refresh-rates-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}/* When filters and header are moved into fullscreen view,
keep them at top and don't shrink */
.roadmaps-view .roadmaps-header-row,
.roadmaps-view .filters-shell {
  flex-shrink: 0;
}.roadmaps-view--table:fullscreen .roadmaps-table-toolbar,
.roadmaps-view--table::-webkit-full-screen .roadmaps-table-toolbar,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--table .roadmaps-table-toolbar {
  flex-shrink: 0;
}.roadmaps-view--table:fullscreen,
.roadmaps-view--table::-webkit-full-screen,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--table {
  background: var(--bg);
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
}.roadmaps-view--table:fullscreen .table-wrapper,
.roadmaps-view--table::-webkit-full-screen .table-wrapper,
.roadmaps-view.view-pseudo-fullscreen.roadmaps-view--table .table-wrapper {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
}.roadmaps-map-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 0;
  color: var(--muted);
  font-size: 0.95rem;
}/* Scrum board status legend */
.scrum-board-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  padding: 0.5rem 0;
}.scrum-board-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 0.5rem;
}.scrum-board-toolbar .scrum-board-legend {
  margin-bottom: 0;
  padding: 0;
}.scrum-board-sort-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}.scrum-board-sort-toggle input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
  cursor: pointer;
}.scrum-board-sort-toggle:hover {
  color: #e5e7eb;
}.scrum-board-legend-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-right: 0.25rem;
}.scrum-board-legend .cell-type-pill {
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
}/* Scrum board */
.scrum-board {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 0.75rem;
  min-height: 420px;
  margin-top: 0.5rem;
}.scrum-board::-webkit-scrollbar {
  height: 8px;
}.scrum-board::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.5);
  border-radius: 999px;
}.scrum-board::-webkit-scrollbar-thumb {
  background: rgba(71, 85, 105, 0.7);
  border-radius: 999px;
}.scrum-board-column {
  flex: 0 0 368px;
  width: 368px;
  min-width: 368px;
  max-width: 368px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(51, 65, 85, 0.8);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.92) 0%, rgba(15, 23, 42, 0.97) 100%);
  display: flex;
  flex-direction: column;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}.roadmaps-view--board .scrum-board-column {
  max-height: none;
}.scrum-board-column.scrum-board-column--drag-over {
  border-color: rgba(99, 102, 241, 0.6);
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.25);
}.scrum-board-column-header {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(51, 65, 85, 0.85);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-shrink: 0;
}.scrum-board-column[data-status="Not Started"] .scrum-board-column-header {
  border-top: 3px solid rgba(148, 163, 184, 0.9);
  background: linear-gradient(180deg, rgba(148, 163, 184, 0.12) 0%, transparent 100%);
}.scrum-board-column[data-status="Not Started"] .scrum-board-column-title {
  color: #94a3b8;
}.scrum-board-column[data-status="In Progress"] .scrum-board-column-header {
  border-top: 3px solid rgba(59, 130, 246, 0.9);
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.12) 0%, transparent 100%);
}.scrum-board-column[data-status="In Progress"] .scrum-board-column-title {
  color: #93c5fd;
}.scrum-board-column[data-status="On Hold"] .scrum-board-column-header {
  border-top: 3px solid rgba(251, 191, 36, 0.9);
  background: linear-gradient(180deg, rgba(251, 191, 36, 0.12) 0%, transparent 100%);
}.scrum-board-column[data-status="On Hold"] .scrum-board-column-title {
  color: #fcd34d;
}.scrum-board-column[data-status="Done"] .scrum-board-column-header {
  border-top: 3px solid rgba(52, 211, 153, 0.9);
  background: linear-gradient(180deg, rgba(52, 211, 153, 0.12) 0%, transparent 100%);
}.scrum-board-column[data-status="Done"] .scrum-board-column-title {
  color: #6ee7b7;
}.scrum-board-column[data-status="Cancelled"] .scrum-board-column-header {
  border-top: 3px solid rgba(248, 113, 113, 0.9);
  background: linear-gradient(180deg, rgba(248, 113, 113, 0.12) 0%, transparent 100%);
}.scrum-board-column[data-status="Cancelled"] .scrum-board-column-title {
  color: #fca5a5;
}.scrum-board-column-title {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #e2e8f0;
  margin: 0;
}.scrum-board-column-count {
  font-size: 0.75rem;
  color: var(--muted);
  background: rgba(51, 65, 85, 0.6);
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  font-weight: 500;
}.scrum-board-column-cards {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-height: 80px;
}.scrum-board-card {
  border-radius: var(--radius-md);
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
  padding: 0.8rem 0.95rem;
  cursor: grab;
  transition: none;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
}.scrum-board-card:hover {
  border-color: rgba(148, 163, 184, 0.35);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  transform: none;
}.scrum-board-column[data-status="Not Started"] .scrum-board-card {
  border-left: 4px solid rgba(148, 163, 184, 0.8);
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}.scrum-board-column[data-status="In Progress"] .scrum-board-card {
  border-left: 4px solid rgba(59, 130, 246, 0.9);
  background: linear-gradient(180deg, #ffffff 0%, #eff6ff 100%);
}.scrum-board-column[data-status="On Hold"] .scrum-board-card {
  border-left: 4px solid rgba(251, 191, 36, 0.9);
  background: linear-gradient(180deg, #ffffff 0%, #fffbeb 100%);
}.scrum-board-column[data-status="Done"] .scrum-board-card {
  border-left: 4px solid rgba(52, 211, 153, 0.9);
  background: linear-gradient(180deg, #ffffff 0%, #ecfdf5 100%);
}.scrum-board-column[data-status="Cancelled"] .scrum-board-card {
  border-left: 4px solid rgba(248, 113, 113, 0.9);
  background: linear-gradient(180deg, #ffffff 0%, #fef2f2 100%);
}.scrum-board-card:active {
  cursor: grabbing;
}.scrum-board-card.scrum-board-card--dragging {
  opacity: 0.94;
  transform: none;
  box-shadow: 0 8px 20px rgba(127, 29, 29, 0.14);
  border-color: rgba(185, 28, 28, 0.4);
  cursor: grabbing;
  z-index: 100;
}.drag-ghost {
  transform: none !important;
  transition: none !important;
  box-sizing: border-box !important;
}.scrum-board-card-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: #4b1d2a;
  margin: 0;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}.scrum-board-card-title-row {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
}.scrum-board-card-title-row .scrum-board-card-title {
  flex: 1 1 auto;
  min-width: 0;
}.scrum-board-card-meta {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  font-size: 0.72rem;
  color: #7a4b12;
  margin-top: 0.5rem;
  min-width: 0;
}.portfolio-board-card--structured .scrum-board-card-meta,
.portfolio-board-card--structured .moscow-board-card-meta {
  margin-top: 0;
}.board-card-metrics-row,
.scrum-board-card-metrics,
.moscow-board-card-metrics {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(161, 98, 7, 0.35) transparent;
  padding-bottom: 0.05rem;
}.board-card-metrics-row::-webkit-scrollbar {
  height: 3px;
}.board-card-metrics-row::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(161, 98, 7, 0.35);
}.board-card-metrics-row > * {
  flex-shrink: 0;
}.scrum-board-card-meta-left {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem 0.6rem;
}.scrum-board-card-type-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 0;
  cursor: help;
  flex-shrink: 0;
  color: #7a4b12;
}.scrum-board-card-icons {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  margin-left: 0;
}.board-card-metric-icon,
.scrum-board-card-type-wrap.board-card-metric-icon {
  flex-shrink: 0;
}.scrum-board-card-type-wrap svg {
  width: 1.1rem;
  height: 1.1rem;
  display: block;
}.scrum-board-card-rice {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(79, 70, 229, 0.35);
  background: linear-gradient(180deg, #eef2ff 0%, #e0e7ff 100%);
  color: #3730a3;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.01em;
  line-height: 1.15;
}.scrum-board-card-size {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  color: #475569;
  font-weight: 600;
  font-size: 0.76rem;
  line-height: 1.15;
}.scrum-board-card-financial {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(180, 83, 9, 0.45);
  background: linear-gradient(180deg, #fff7ed 0%, #fffbeb 100%);
  color: #9a3412;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.01em;
  line-height: 1.15;
}.card-meta-with-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: help;
}.card-title-with-tooltip {
  position: relative;
  cursor: help;
}.scrum-board-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
}.scrum-board-card-actions-order {
  display: flex;
  gap: 0.35rem;
  margin-left: auto;
  flex-shrink: 0;
}.scrum-board-card-btn {
  padding: 0.28rem 0.56rem;
  font-size: 0.7rem;
  font-weight: 600;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color var(--transition-fast), color var(--transition-fast);
  flex: 0 0 auto;
}.scrum-board-card-btn--view {
  background: #eef2ff;
  color: #4338ca;
  border-color: rgba(99, 102, 241, 0.35);
}.scrum-board-card-btn--view:hover {
  background: #e0e7ff;
  color: #3730a3;
}.scrum-board-card-btn--edit {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: rgba(59, 130, 246, 0.35);
}.scrum-board-card-btn--edit:hover {
  background: #dbeafe;
  color: #1e40af;
}.scrum-board-card-btn--delete {
  background: #fef2f2;
  color: #b91c1c;
  border-color: rgba(239, 68, 68, 0.35);
}.scrum-board-card-btn--delete:hover {
  background: #fee2e2;
  color: #991b1b;
}.scrum-board-card-btn--order {
  background: rgba(148, 163, 184, 0.2);
  color: var(--muted);
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1;
  min-width: 28px;
}.scrum-board-card-btn--order:hover:not(:disabled) {
  background: rgba(148, 163, 184, 0.35);
  color: #e5e7eb;
}.scrum-board-card-btn--order:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}.scrum-board-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.5;
}/* MOSCOW 2x2 grid — professional,
dynamic,
responsive */
.roadmaps-view--moscow {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-bottom: 0.5rem;
  flex: 1;
  min-height: 400px;
}.roadmaps-view--moscow .moscow-view-header {
  flex-shrink: 0;
}.roadmaps-view--moscow .moscow-grid {
  flex: 1 1 auto;
  min-height: 420px;
  max-height: min(72vh, 720px);
}.moscow-view-header {
  margin-bottom: 0.25rem;
}.moscow-grid-title {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
  margin: 0 0 0.35rem 0;
  line-height: 1.3;
}.moscow-board-hint {
  font-size: 0.8125rem;
  color: var(--muted);
  margin: 0;
  line-height: 1.5;
  max-width: 42ch;
}.moscow-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  min-height: 420px;
  height: min(65vh, 640px);
  max-height: min(72vh, 720px);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-card);
  transition: box-shadow var(--transition-normal);
}.moscow-grid:hover {
  box-shadow: var(--shadow-card-hover);
}.moscow-board-column.moscow-grid-cell {
  flex: none;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(51, 65, 85, 0.5);
  margin: -1px 0 0 -1px;
  background: var(--bg-elevated);
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), transform var(--transition-fast);
  overflow: hidden;
}.moscow-board-column.moscow-grid-cell:hover {
  z-index: 1;
}.moscow-board-column.moscow-grid-cell.moscow-board-column--drag-over {
  border-color: rgba(99, 102, 241, 0.7);
  box-shadow: inset 0 0 0 2px rgba(99, 102, 241, 0.25), 0 8px 24px rgba(99, 102, 241, 0.15);
  z-index: 50;
  transform: scale(1.02);
  position: relative;
}.moscow-quadrant-header {
  padding: 0.85rem 1rem 0.7rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(51, 65, 85, 0.5);
  position: relative;
  min-height: 4rem;
}.moscow-quadrant-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  padding-right: 2.75rem;
  box-sizing: border-box;
}.moscow-quadrant-header__title-line {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex: 1 1 auto;
  min-width: 0;
}.moscow-quadrant-fullname {
  display: none;
}.moscow-quadrant-label {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #fff;
  padding: 0.4rem 0.9rem;
  border-radius: var(--radius-sm);
  width: fit-content;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: transform var(--transition-fast), box-shadow var(--transition-fast);
}.moscow-board-column.moscow-grid-cell:hover .moscow-quadrant-label {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}.moscow-board-column[data-moscow="Must have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
  color: #fff;
}.moscow-board-column[data-moscow="Should have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
  color: #fff;
}.moscow-board-column[data-moscow="Could have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%);
  color: #0f172a;
}.moscow-board-column[data-moscow="Won't have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
  color: #fff;
}.moscow-quadrant-description {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.71875rem;
  color: var(--muted);
  margin: 0;
  line-height: 1.35;
  max-width: none;
}.moscow-board-column.moscow-grid-cell .moscow-board-column-count {
  position: absolute;
  top: 1rem;
  right: 1.1rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--text-secondary);
  background: rgba(51, 65, 85, 0.7);
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  letter-spacing: 0.02em;
}.moscow-board-column-cards {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding: 0.75rem;
  padding-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  scroll-behavior: smooth;
  scroll-padding-bottom: 0.75rem;
  -webkit-overflow-scrolling: touch;
}.moscow-board-column-cards::-webkit-scrollbar {
  width: 6px;
}.moscow-board-column-cards::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.4);
  border-radius: 999px;
}.moscow-board-column-cards::-webkit-scrollbar-thumb {
  background: rgba(71, 85, 105, 0.7);
  border-radius: 999px;
}.moscow-board-column-cards::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 116, 139, 0.8);
}.moscow-board-card {
  border-radius: var(--radius-md);
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
  padding: 0.7rem 0.95rem;
  cursor: grab;
  transition: none;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  min-height: 72px;
}.moscow-board-card:hover {
  border-color: rgba(148, 163, 184, 0.35);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  transform: none;
}.moscow-board-card:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}.moscow-board-column[data-moscow="Must have"] .moscow-board-card {
  border-left: 4px solid #ec4899;
}.moscow-board-column[data-moscow="Should have"] .moscow-board-card {
  border-left: 4px solid #14b8a6;
}.moscow-board-column[data-moscow="Could have"] .moscow-board-card {
  border-left: 4px solid #38bdf8;
}.moscow-board-column[data-moscow="Won't have"] .moscow-board-card {
  border-left: 4px solid #a78bfa;
}.moscow-board-card:active {
  cursor: grabbing;
}.moscow-board-card.moscow-board-card--dragging {
  opacity: 0.94;
  transform: none;
  box-shadow: 0 8px 20px rgba(127, 29, 29, 0.14);
  border-color: rgba(185, 28, 28, 0.4);
  cursor: grabbing;
  z-index: 100;
}.moscow-board-card-title {
  font-size: 0.84375rem;
  font-weight: 600;
  color: #4b1d2a;
  margin: 0;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}.moscow-board-card-title-row {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
}.moscow-board-card-title-row .moscow-board-card-title {
  flex: 1 1 auto;
  min-width: 0;
}.moscow-board-card-meta {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  font-size: 0.6875rem;
  color: #7a4b12;
  margin-top: 0.5rem;
  min-width: 0;
}.moscow-board-card-meta-left {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem 0.75rem;
}.moscow-board-card-rice {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(79, 70, 229, 0.35);
  background: linear-gradient(180deg, #eef2ff 0%, #e0e7ff 100%);
  color: #3730a3;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.01em;
  line-height: 1.15;
}.moscow-board-card-size {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  color: #475569;
  font-weight: 600;
  font-size: 0.76rem;
  line-height: 1.15;
}.moscow-board-card-financial {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(180, 83, 9, 0.45);
  background: linear-gradient(180deg, #fff7ed 0%, #fffbeb 100%);
  color: #9a3412;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.01em;
  line-height: 1.15;
}.moscow-board-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
}.moscow-board-card-actions-order {
  display: flex;
  gap: 0.35rem;
  margin-left: auto;
  flex-shrink: 0;
}.moscow-board-card-btn {
  padding: 0.3rem 0.6rem;
  font-size: 0.71875rem;
  font-weight: 600;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
  flex: 0 0 auto;
}.moscow-board-card-btn:hover {
  transform: translateY(-1px);
}.moscow-board-card-btn:active {
  transform: translateY(0);
}.moscow-board-card-btn--view {
  background: #eef2ff;
  color: #4338ca;
  border-color: rgba(99, 102, 241, 0.35);
}.moscow-board-card-btn--view:hover {
  background: #e0e7ff;
  color: #3730a3;
}.moscow-board-card-btn--edit {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: rgba(59, 130, 246, 0.35);
}.moscow-board-card-btn--edit:hover {
  background: #dbeafe;
  color: #1e40af;
}.moscow-board-card-btn--delete {
  background: #fef2f2;
  color: #b91c1c;
  border-color: rgba(239, 68, 68, 0.35);
}.moscow-board-card-btn--delete:hover {
  background: #fee2e2;
  color: #991b1b;
}

@media (max-width: 560px) {
  .scrum-board-card,
  .moscow-board-card {
    padding: 0.68rem 0.74rem;
  }

  .scrum-board-card-meta,
  .moscow-board-card-meta {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
  }

  .board-card-metrics-row,
  .scrum-board-card-metrics,
  .moscow-board-card-metrics {
    flex-wrap: nowrap;
  }

  .scrum-board-card-meta-left,
  .moscow-board-card-meta-left {
    flex-wrap: nowrap;
    gap: 0.3rem 0.45rem;
  }

  .scrum-board-card-icons {
    margin-left: 0;
    flex-direction: row;
    flex-wrap: nowrap;
  }

  .scrum-board-card-actions,
  .moscow-board-card-actions {
    gap: 0.3rem;
  }

  .scrum-board-card-btn,
  .moscow-board-card-btn {
    padding: 0.24rem 0.5rem;
    font-size: 0.68rem;
  }
}.moscow-board-card-btn--order {
  background: rgba(148, 163, 184, 0.2);
  color: var(--muted);
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1;
  min-width: 28px;
}.moscow-board-card-btn--order:hover:not(:disabled) {
  background: rgba(148, 163, 184, 0.35);
  color: #e5e7eb;
}.moscow-board-card-btn--order:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}.moscow-board-empty {
  text-align: center;
  padding: 2.5rem 1.5rem;
  color: var(--muted);
  font-size: 0.875rem;
  line-height: 1.6;
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
}

@media (prefers-reduced-motion: reduce) {
  .moscow-board-column.moscow-grid-cell .moscow-quadrant-label,
  .moscow-board-card:hover,
  .moscow-board-card.moscow-board-card--dragging,
  .moscow-board-card-btn:hover {
    transform: none;
  }
  .moscow-board-column.moscow-grid-cell.moscow-board-column--drag-over {
    transform: none;
  }
}

@media (max-width: 900px) {
  .scrum-board-column {
    flex: 0 0 300px;
    min-width: 300px;
    max-width: 300px;
  }

  .moscow-grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, minmax(0, auto));
    max-height: none;
    min-height: auto;
    height: auto;
  }

  .moscow-board-column.moscow-grid-cell {
    min-height: 200px;
    max-height: min(50vh, 420px);
  }

  .moscow-board-column-cards {
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
  }

  .moscow-quadrant-description {
    max-width: none;
  }
}

@media (max-width: 640px) {
  .view-toggle-group {
    order: -1;
    width: 100%;
    justify-content: center;
  }

  .roadmaps-header-actions {
    flex-wrap: wrap;
  }

  .scrum-board {
    gap: 0.75rem;
    padding-bottom: 0.5rem;
  }

  .moscow-grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, minmax(200px, auto));
    border-radius: var(--radius-md);
    min-height: auto;
  }

  .moscow-board-column.moscow-grid-cell {
    min-height: 180px;
  }

  .moscow-view-header {
    margin-bottom: 0;
  }

  .moscow-grid-title {
    font-size: 1.1rem;
  }

  .moscow-board-hint {
    font-size: 0.8rem;
  }

  .moscow-quadrant-header {
    padding: 0.85rem 1rem 0.75rem;
  }

  .moscow-board-column-cards {
    padding: 0.5rem;
    min-height: 64px;
  }

  .moscow-board-card {
    padding: 0.7rem 0.85rem;
  }

  .scrum-board-column {
    flex: 0 0 280px;
    min-width: 280px;
    max-width: 280px;
  }
}/* Filters */
.filters-shell {
  border-radius: var(--radius-md);
  border: 1px solid rgba(212, 175, 55, 0.3);
  padding: 1rem 1.1rem 1.05rem;
  margin-bottom: 1rem;
  background: linear-gradient(135deg, rgba(185, 28, 28, 0.2) 0%, rgba(24, 10, 14, 0.97) 100%);
  transition: border-color var(--transition-normal), box-shadow var(--transition-normal);
}.filters-shell:focus-within {
  border-color: rgba(59, 130, 246, 0.45);
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.15);
}.filters-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}.filters-title {
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #fde68a;
  font-weight: 600;
}.filters-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}.filters-active-pill {
  border-radius: 999px;
  padding: 0.2rem 0.5rem;
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid rgba(129, 140, 248, 0.6);
  color: #c7d2fe;
  background: rgba(30, 64, 175, 0.5);
}.filters-reset-btn {
  padding: 0.25rem 0.6rem;
  min-height: 32px;
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(148, 163, 184, 0.5);
  background: transparent;
  color: var(--muted);
  box-shadow: none;
  transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}.filters-reset-btn:hover {
  background: rgba(15, 23, 42, 0.9);
  color: #e5e7eb;
  border-color: rgba(148, 163, 184, 0.8);
}.filters-toggle-btn {
  padding: 0.3rem 0.6rem;
  min-height: 32px;
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  box-shadow: none;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.5);
  color: var(--muted);
  border-radius: var(--radius-sm);
  transition: background var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);
}.filters-toggle-btn:hover {
  background: rgba(30, 64, 175, 0.35);
  color: #e5e7eb;
  border-color: rgba(129, 140, 248, 0.5);
}.filters-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: flex-end;
}.filters-row + .filters-row {
  margin-top: 0.5rem;
}.filters-advanced {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(51, 65, 85, 0.6);
  display: none;
}.filters-advanced.visible {
  display: block;
}.filters-quick-label {
  font-size: 0.75rem;
  color: var(--muted);
  margin-top: 0.1rem;
}.filter-group {
  display: flex;
  flex-direction: column;
  min-width: 0;
}.filter-group--stretch {
  flex: 2 1 220px;
}.filter-group--compact {
  flex: 1 1 140px;
}.filter-group--date-range {
  flex: 1 1 220px;
}.filter-inline-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-bottom: 0.15rem;
}.filters-row input,
.filters-row select {
  min-width: 0;
}.filter-autocomplete {
  position: relative;
  width: 100%;
  min-width: 0;
}.filter-autocomplete__dropdown {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  z-index: 55;
  max-height: min(280px, 42dvh);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.55);
  background: rgba(15, 23, 42, 0.98);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}.filter-autocomplete__dropdown[hidden] {
  display: none !important;
}.filter-autocomplete__list {
  list-style: none;
  margin: 0;
  padding: 0.3rem;
  overflow-y: auto;
}.filter-autocomplete__option {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0.48rem 0.55rem;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #e5e7eb;
  font-size: 0.8rem;
  text-align: left;
  cursor: pointer;
}.filter-autocomplete__option:hover,
.filter-autocomplete__option--highlight {
  background: rgba(59, 130, 246, 0.22);
}.filter-autocomplete__option mark {
  padding: 0 0.05em;
  border-radius: 2px;
  background: rgba(251, 191, 36, 0.35);
  color: #fef3c7;
  font-weight: 700;
}.filter-autocomplete__option-icon {
  flex-shrink: 0;
  font-size: 0.72rem;
  opacity: 0.85;
}.filter-autocomplete__option-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}.filter-autocomplete__empty {
  margin: 0;
  padding: 0.5rem 0.6rem;
  font-size: 0.75rem;
  color: var(--muted);
  font-style: italic;
}.filter-countries {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100%;
}.filter-countries-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.4rem 0.55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(15, 23, 42, 0.95);
  cursor: pointer;
  font-size: 0.75rem;
  color: var(--muted);
  gap: 0.35rem;
}.filter-countries-toggle:hover {
  border-color: rgba(129, 140, 248, 0.8);
  background: rgba(30, 64, 175, 0.45);
  color: #e5e7eb;
}.filter-countries-toggle-icon {
  font-size: 0.7rem;
  opacity: 0.8;
}.filter-countries-popup {
  position: absolute;
  top: calc(100% + 0.25rem);
  left: 0;
  right: 0;
  z-index: 40;
  border-radius: 10px;
  border: 1px solid rgba(55, 65, 81, 0.95);
  background: radial-gradient(circle at top left, rgba(30, 64, 175, 0.75), rgba(15, 23, 42, 0.98));
  padding: 0.4rem 0.45rem 0.45rem;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.98);
  display: none;
}.filter-countries.open .filter-countries-popup {
  display: block;
}.filter-countries-list {
  max-height: 150px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: 0.25rem 0.3rem;
  background: rgba(15, 23, 42, 0.9);
}.filter-country-option {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.15rem 0.25rem;
  border-radius: 6px;
  font-size: 0.75rem;
  color: var(--muted);
  cursor: pointer;
}.filter-country-option:hover {
  background: rgba(37, 99, 235, 0.15);
  color: #e5e7eb;
}.filter-country-option input[type="checkbox"] {
  width: 14px;
  height: 14px;
  cursor: pointer;
}.filter-countries-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  min-height: 1.2rem;
  font-size: 0.7rem;
  color: var(--muted);
}.filter-countries-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 171, 184, 0.5);
  background: rgba(15, 23, 42, 0.95);
  white-space: nowrap;
}.filter-countries-chip-count {
  opacity: 0.8;
}

@media (max-width: 900px) {
  .filters-shell {
    padding: 0.85rem 0.95rem;
  }
  .filters-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
  }
  .filters-meta {
    width: 100%;
    justify-content: space-between;
  }
  .filter-group--stretch,
  .filter-group--compact,
  .filter-group--date-range {
    flex: 1 1 100%;
  }

  .filters-row--leads > .filter-group--compact {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    width: 100% !important;
  }
}/* Table */
.table-wrapper {
  border-radius: var(--radius-md);
  border: 1px solid rgba(51, 65, 85, 0.7);
  overflow: auto;
  background: linear-gradient(180deg, rgba(30, 64, 175, 0.08) 0%, rgba(15, 23, 42, 0.98) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  flex: 1 1 auto;
  min-height: 200px;
}/* Scrollbar styling for table wrapper */
.table-wrapper::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}.table-wrapper::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.6);
  border-radius: 0 0 var(--radius-sm) 0;
}.table-wrapper::-webkit-scrollbar-thumb {
  background: rgba(71, 85, 105, 0.7);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}.table-wrapper::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 116, 139, 0.85);
  background-clip: padding-box;
}.table-wrapper::-webkit-scrollbar-corner {
  background: rgba(15, 23, 42, 0.8);
}table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.875rem;
  min-width: 840px;
}thead {
  position: sticky;
  top: 0;
  z-index: 1;
  background: linear-gradient(to right, rgba(15, 23, 42, 0.98), rgba(15, 23, 42, 0.99));
  box-shadow: 0 1px 0 rgba(30, 41, 59, 0.9);
  backdrop-filter: blur(8px);
}th,
td {
  padding: 0.7rem 0.65rem;
  text-align: left;
  border-bottom: 1px solid rgba(30, 41, 59, 0.9);
  vertical-align: middle;
}th:first-child,
td:first-child {
  padding-left: 0.95rem;
}th:last-child,
td:last-child {
  padding-right: 0.95rem;
}th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  font-weight: 600;
  position: relative;
  white-space: nowrap;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}tbody tr {
  transition: background var(--transition-fast);
}tbody tr:nth-child(even) {
  background: rgba(15, 23, 42, 0.88);
}tbody tr:nth-child(odd) {
  background: rgba(15, 23, 42, 0.96);
}tbody tr:hover {
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.2) 0%, rgba(15, 23, 42, 0.98) 100%);
}tbody td {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}.cell-title {
  font-weight: 600;
  color: #e5e7eb;
  margin-bottom: 0;
}.cell-title-block {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}.cell-description {
  color: var(--muted);
  font-size: 0.8125rem;
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.cell-meta {
  font-size: 0.8125rem;
  color: var(--muted);
}.cell-rice {
  font-weight: 700;
  color: #a5b4fc;
}.rice-score-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  position: relative;
}.rice-info-btn {
  border: none;
  border-radius: 999px;
  padding: 0.08rem 0.25rem;
  font-size: 0.75rem;
  text-transform: none;
  letter-spacing: 0;
  background: rgba(15, 23, 42, 0.9);
  color: var(--muted);
  cursor: pointer;
  min-height: 0;
  box-shadow: none;
}.rice-info-btn:hover {
  background: rgba(37, 99, 235, 0.35);
  color: #e5e7eb;
}.rice-popup {
  position: absolute;
  top: 125%;
  right: 0;
  min-width: 220px;
  max-width: 260px;
  padding: 0.55rem 0.6rem;
  border-radius: 10px;
  border: 1px solid rgba(55, 65, 81, 0.9);
  background: radial-gradient(circle at top left, rgba(30, 64, 175, 0.75), rgba(15, 23, 42, 0.98));
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.98);
  font-size: 0.8125rem;
  color: var(--muted);
  z-index: 30;
  display: none;
}.rice-popup.visible {
  display: block;
}.rice-popup-row {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.15rem;
}.rice-popup-row:last-child {
  margin-bottom: 0;
}.rice-popup-label {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  color: #c7d2fe;
}.rice-popup-value {
  font-weight: 500;
  color: #e5e7eb;
}.cell-rice-values {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  font-size: 0.8125rem;
}.rice-values-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-start;
}.rice-values-header {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}.cell-type-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border: 1px solid rgba(148, 163, 184, 0.4);
  color: #e5e7eb;
  background: rgba(15, 23, 42, 0.96);
}/* Roadmap type as icon with tooltip */
.cell-type-icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  padding: 0;
  cursor: help;
}.cell-type-icon-wrap svg {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
  color: inherit;
}/* Created date with Modified tooltip (same tooltip style as type/status) */
.cell-date-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}.cell-date-with-tooltip .cell-created-date-text {
  font-size: inherit;
  color: inherit;
}/* Countries badge with tooltip (flag + full name,
same style as type/status) */
.cell-countries-with-tooltip {
  position: relative;
  display: inline-flex;
  cursor: help;
  align-self: flex-start;
}/* T-shirt size with tooltip (same style as type/status) */
.cell-tshirt-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}.cell-tshirt-with-tooltip .cell-tshirt-size-text {
  font-size: inherit;
  color: inherit;
}/* MOSCOW category with tooltip (same style as roadmap type / t-shirt) */
.cell-moscow-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}.cell-moscow-with-tooltip .cell-moscow-text {
  font-size: inherit;
  color: inherit;
}/* Roadmap period with tooltip (same style as roadmap type / MOSCOW) */
.cell-period-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}.cell-period-with-tooltip .cell-period-text {
  font-size: inherit;
  color: inherit;
  white-space: nowrap;
}.table-wrapper .roadmaps-table-col--period .cell-period-text,
.table-wrapper .roadmaps-table-col--period .cell-period-with-tooltip {
  white-space: nowrap;
}.cell-period-with-tooltip .cell-type-tooltip,
.cell-type-tooltip--period {
  min-width: min(18rem, calc(100vw - 1.5rem));
  max-width: min(24rem, calc(100vw - 1.25rem));
  border-radius: 10px !important;
  overflow: hidden;
  background: #fffaf2;
  border: 1px solid rgba(212, 175, 55, 0.45);
  box-shadow: 0 8px 22px rgba(127, 29, 29, 0.15);
}.cell-type-tooltip--period .cell-type-tooltip-title {
  padding: 0.55rem 0.85rem 0.48rem !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  color: var(--id-red-700, #9f1239) !important;
  background: #fff6ea !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.32);
}.cell-type-tooltip--period .cell-period-tooltip-body {
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  overflow: hidden;
  background: transparent;
}.cell-period-tooltip-periods {
  box-sizing: border-box;
  padding: 0.35rem 0.75rem 0.2rem;
  flex: 0 1 auto;
  min-height: 0;
  background: #ffffff;
}.cell-period-tooltip-periods--scroll {
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  pointer-events: auto;
}.cell-period-tooltip-periods p {
  margin: 0;
  padding: 0.42rem 0;
  line-height: 1.38;
  font-size: clamp(0.72rem, 2.4vw, 0.78rem);
  font-weight: 500;
  color: var(--id-text, #6b2132);
  white-space: nowrap;
  border-bottom: 1px solid rgba(212, 175, 55, 0.18);
}.cell-period-tooltip-periods p + p {
  margin-top: 0 !important;
  padding-top: 0.42rem !important;
  border-top: none !important;
}.cell-period-tooltip-periods p:last-child {
  border-bottom: none;
}.cell-period-tooltip-periods--scroll::-webkit-scrollbar {
  width: 5px;
}.cell-period-tooltip-periods--scroll::-webkit-scrollbar-track {
  background: rgba(212, 175, 55, 0.1);
  border-radius: 999px;
}.cell-period-tooltip-periods--scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f59e0b 0%, #b91c1c 100%);
  border-radius: 999px;
}.cell-period-tooltip-deadline {
  flex: 0 0 auto;
  padding: 0.32rem 0.75rem 0.42rem;
  border-top: 1px solid rgba(212, 175, 55, 0.24);
  background: #fff7ed;
}.cell-period-tooltip-deadline-row {
  display: flex;
  align-items: flex-start;
  gap: 0.38rem;
  min-width: 0;
}.cell-period-tooltip-deadline-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  margin-top: 0.08rem;
  color: #b45309;
  opacity: 0.9;
}.cell-period-tooltip-deadline-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  display: block;
}.cell-period-tooltip-deadline-text {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.35rem;
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.35;
}.cell-period-tooltip-deadline-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #a16207;
}.cell-period-tooltip-deadline-value {
  font-size: 0.74rem;
  font-weight: 600;
  color: #7f1d1d;
}.cell-period-tooltip-deadline-hint {
  font-size: 0.68rem;
  font-weight: 500;
  color: #78716c;
}.cell-period-tooltip-deadline-hint::before {
  content: "·";
  margin-right: 0.28rem;
  color: rgba(120, 113, 108, 0.65);
  font-weight: 400;
}.cell-period-tooltip-deadline-hint--upcoming {
  color: #15803d;
}.cell-period-tooltip-deadline-hint--soon {
  color: #c2410c;
}.cell-period-tooltip-deadline-hint--today {
  color: #1d4ed8;
}.cell-period-tooltip-deadline-hint--overdue {
  color: #b91c1c;
  font-weight: 600;
}.cell-period-tooltip-deadline-hint--neutral {
  color: #78716c;
}.cell-period-tooltip-empty {
  margin: 0;
  padding: 0.45rem 0.75rem 0.55rem;
  line-height: 1.45;
  white-space: pre-line;
}.cell-type-tooltip--period.cell-type-tooltip-visible {
  overflow: hidden;
}/* Financial impact (EUR) with tooltip showing original amount and currency */
.cell-financial-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}.cell-financial-with-tooltip .cell-financial-text {
  font-size: inherit;
  color: inherit;
}/* RICE score with tooltip showing R/I/C/E values */
.cell-rice-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}/* Roadmap name with description tooltip (same style as roadmap status/type) */
.cell-desc-with-tooltip {
  position: relative;
  display: inline-block;
  cursor: help;
}/* Wider tooltip for long text (e.g. roadmap description) */
.cell-type-tooltip--wide {
  min-width: 12rem;
  max-width: 22rem;
}.cell-type-tooltip--wide .cell-type-tooltip-body {
  padding: 0.5rem 0.75rem 0.6rem;
  line-height: 1.55;
}.cell-type-tooltip--wide .cell-type-tooltip-body p {
  margin: 0;
  line-height: 1.55;
  white-space: pre-wrap;
}.cell-type-tooltip--wide .cell-type-tooltip-body p + p {
  margin-top: 0.65rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(148, 163, 184, 0.15);
}/* Long country lists: capped height + scroll (desktop table + compact cards) */
.cell-type-tooltip.cell-type-tooltip--scroll {
  min-width: 11rem;
  max-width: min(20rem, calc(100vw - 1.5rem));
}.cell-type-tooltip.cell-type-tooltip--scroll.cell-type-tooltip-visible {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  pointer-events: auto;
}.cell-type-tooltip.cell-type-tooltip--scroll.cell-type-tooltip--below.cell-type-tooltip-visible {
  transform: translate(-50%, 0) !important;
}.cell-type-tooltip.cell-type-tooltip--scroll.cell-type-tooltip-visible:not(.cell-type-tooltip--below) {
  transform: translate(-50%, -100%) !important;
}.cell-type-tooltip.cell-type-tooltip--scroll .cell-type-tooltip-title {
  flex: 0 0 auto;
}.cell-type-tooltip.cell-type-tooltip--scroll .cell-type-tooltip-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  pointer-events: auto;
  cursor: default;
}.cell-type-tooltip.cell-type-tooltip--scroll.cell-type-tooltip--below.cell-type-tooltip-visible {
  margin-top: 0;
  padding-top: 2px;
}.cell-type-tooltip.cell-type-tooltip--scroll .cell-type-tooltip-body p {
  margin: 0;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}.cell-type-tooltip.cell-type-tooltip--scroll .cell-type-tooltip-body p:last-child {
  border-bottom: none;
}.cell-type-tooltip--wide .cell-type-tooltip-title {
  padding: 0.45rem 0.75rem 0.35rem;
}/* Target countries list tooltip — cream panel, burgundy header, scrollable rows */
.cell-type-tooltip--countries {
  min-width: 13rem;
  max-width: min(22rem, calc(100vw - 1.5rem));
  background: #fffaf2 !important;
  background-image: none !important;
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  border-radius: 8px !important;
  box-shadow:
    0 8px 22px rgba(127, 29, 29, 0.14),
    0 0 0 1px rgba(212, 175, 55, 0.1) !important;
  color: #4a1d28 !important;
  overflow: hidden;
}.cell-type-tooltip--countries .cell-type-tooltip-title {
  padding: 0.55rem 0.85rem 0.48rem !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: #9f1239 !important;
  background: #fff6ea !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.38) !important;
}.cell-type-tooltip--countries .cell-type-tooltip-body,
.cell-type-tooltip--countries .countries-tooltip-body {
  padding: 0 !important;
  background: #fffaf2 !important;
  color: #5a1322 !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}.cell-type-tooltip--countries .countries-tooltip-line {
  display: flex;
  align-items: center;
  gap: 0.38rem;
  padding: 0.44rem 0.85rem;
  border-bottom: 1px solid rgba(212, 175, 55, 0.2);
  white-space: nowrap;
}.cell-type-tooltip--countries .countries-tooltip-line:last-child {
  border-bottom: none;
}.cell-type-tooltip--countries .countries-tooltip-line__flag {
  flex: 0 0 auto;
  font-size: 1rem;
  line-height: 1;
}.cell-type-tooltip--countries .countries-tooltip-line__code {
  flex: 0 0 auto;
  font-size: 0.76rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.05em;
  color: #6b2132;
}.cell-type-tooltip--countries .countries-tooltip-line__sep {
  flex: 0 0 auto;
  color: rgba(107, 33, 50, 0.5);
  font-weight: 500;
}.cell-type-tooltip--countries .countries-tooltip-line__name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #4a1d28;
}.cell-type-tooltip--countries.cell-type-tooltip--scroll .cell-type-tooltip-body,
.cell-type-tooltip--countries.cell-type-tooltip--scroll .countries-tooltip-body {
  max-height: min(16.5rem, 52vh);
  scrollbar-width: thin;
  scrollbar-color: #dc2626 rgba(212, 175, 55, 0.16);
}.cell-type-tooltip--countries.cell-type-tooltip--scroll .cell-type-tooltip-body::-webkit-scrollbar,
.cell-type-tooltip--countries.cell-type-tooltip--scroll .countries-tooltip-body::-webkit-scrollbar {
  width: 8px;
}.cell-type-tooltip--countries.cell-type-tooltip--scroll .cell-type-tooltip-body::-webkit-scrollbar-track,
.cell-type-tooltip--countries.cell-type-tooltip--scroll .countries-tooltip-body::-webkit-scrollbar-track {
  background: rgba(212, 175, 55, 0.14);
  border-radius: 999px;
}.cell-type-tooltip--countries.cell-type-tooltip--scroll .cell-type-tooltip-body::-webkit-scrollbar-thumb,
.cell-type-tooltip--countries.cell-type-tooltip--scroll .countries-tooltip-body::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f59e0b 0%, #dc2626 100%);
  border-radius: 999px;
  border: 2px solid rgba(255, 250, 242, 0.88);
}.cell-type-tooltip--countries.cell-type-tooltip--scroll .cell-type-tooltip-body::-webkit-scrollbar-thumb:hover,
.cell-type-tooltip--countries.cell-type-tooltip--scroll .countries-tooltip-body::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #fbbf24 0%, #b91c1c 100%);
}/* Structured tooltip (DOM element) — professional layout with title and body */
/* Position is set via JS (position: fixed) so it is not clipped by table overflow */
.cell-type-tooltip {
  position: fixed;
  left: 0;
  top: 0;
  transform: translate(-50%, -100%);
  min-width: 7rem;
  max-width: 11rem;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.12s ease, visibility 0.12s ease, transform 0.12s ease;
  transition-delay: 0s;
  pointer-events: none;
  z-index: 9999;
  text-align: left;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(148, 163, 184, 0.2);
  border-radius: 6px;
  overflow: hidden;
  background: rgba(26, 27, 35, 0.98);
  border: 1px solid rgba(148, 163, 184, 0.25);
  margin-top: 0;
  font-family: var(--app-font-family);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}/* Shown below icon */
.cell-type-tooltip.cell-type-tooltip--below {
  transform: translate(-50%, 0);
  margin-top: 0;
}/* Tooltips are JS-managed — only .cell-type-tooltip-visible may appear (single active tooltip). */
.cell-type-tooltip:not(.cell-type-tooltip-visible) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}/* When tooltip is moved to body (or fullscreen element) for precise alignment,
show via class */
.cell-type-tooltip.cell-type-tooltip-visible {
  opacity: 1;
  visibility: visible;
  transition-delay: 0.06s;
}/* Hide when table scrolls so tooltip doesn’t stay in wrong place */
body.cell-type-tooltip-hidden .cell-type-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  transition-duration: 0s !important;
}html.app-popup-open .cell-type-tooltip,
html.app-popup-open .cell-type-tooltip.cell-type-tooltip-visible,
html.app-popup-open .roadmap-tasks-progress-segment-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition-duration: 0s !important;
}#roadmapModal:has(select:focus) .roadmap-field-tooltip-wrap .cell-type-tooltip,
#roadmapModal:has(input[type="date"]:focus) .roadmap-field-tooltip-wrap .cell-type-tooltip,
#roadmapModal.modal-backdrop--date-picker-open .roadmap-field-tooltip-wrap .cell-type-tooltip,
#roadmapModal:has(.date-input-shell:focus-within) .roadmap-field-tooltip-wrap .cell-type-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition-duration: 0s !important;
}/* Roadmap modal field tooltips: wider,
aligned to input */
#roadmapModal .roadmap-field-tooltip-wrap .cell-type-tooltip.cell-type-tooltip--field {
  min-width: 10rem;
  max-width: 18rem;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.98);
  border: 1px solid rgba(148, 163, 184, 0.2);
}#roadmapModal .roadmap-field-tooltip-wrap .cell-type-tooltip.cell-type-tooltip--field .cell-type-tooltip-title {
  padding: 0.5rem 0.75rem 0.35rem;
  font-size: 0.74rem;
  background: rgba(30, 64, 175, 0.25);
  border-bottom-color: rgba(148, 163, 184, 0.15);
}#roadmapModal .roadmap-field-tooltip-wrap .cell-type-tooltip.cell-type-tooltip--field .cell-type-tooltip-body {
  padding: 0.5rem 0.75rem 0.6rem;
  font-size: 0.78rem;
  line-height: 1.45;
  color: #cbd5e1;
}.cell-type-tooltip-title {
  padding: 0.4rem 0.6rem 0.28rem;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #e2e8f0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.4);
}.cell-type-tooltip-body {
  padding: 0.4rem 0.6rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 450;
  line-height: 1.5;
  color: #cbd5e1;
  word-spacing: 0.03em;
  white-space: pre-line;
  letter-spacing: 0.01em;
}.cell-type-tooltip-body p {
  margin: 0;
  line-height: 1.5;
  word-spacing: 0.03em;
  white-space: pre-line;
}.cell-type-tooltip-body p:last-child {
  margin-bottom: 0;
}.cell-type-tooltip-body p + p {
  margin-top: 0.4rem;
  padding-top: 0.4rem;
  border-top: 1px solid rgba(148, 163, 184, 0.12);
}/* Standardized tooltip typography — portaled hosts may not inherit body font */
.cell-type-tooltip,
.roadmap-tasks-progress-segment-tooltip,
.map-country-tooltip,
.leaflet-tooltip.map-country-tooltip-host {
  font-family: var(--app-font-family);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.leaflet-tooltip.map-country-tooltip-host,
.leaflet-tooltip.map-country-tooltip-host .map-country-tooltip {
  font-family: var(--app-font-family) !important;
}

.cell-type-tooltip :is(
  .cell-type-tooltip-title,
  .cell-type-tooltip-body,
  .countries-tooltip-line,
  .countries-tooltip-line__code,
  .countries-tooltip-line__name,
  .raci-matrix-tooltip-body,
  .raci-matrix-tooltip-item,
  .raci-matrix-tooltip-item__name,
  .rich-description-content
),
.roadmap-tasks-progress-segment-tooltip :is(
  .roadmap-tasks-progress-segment-tooltip-title,
  .roadmap-tasks-progress-segment-tooltip-body
),
.map-country-tooltip :is(
  .map-country-tooltip__country,
  .map-country-tooltip__code,
  .map-country-tooltip__metric-pill,
  .map-country-tooltip__pin-hint,
  .map-country-tooltip__stat-label,
  .map-country-tooltip__stat-value,
  .map-country-tooltip__profiles-title,
  .map-country-tooltip__profile-name,
  .map-country-tooltip__profile-value,
  .map-country-tooltip__profile-share,
  .map-country-tooltip__profile-rank,
  .map-country-tooltip__more,
  .map-country-tooltip__footnote
) {
  font-family: var(--app-font-family);
}.cell-type-pill[data-type="New Product"] {
  border-color: rgba(52, 211, 153, 0.75);
  background: rgba(16, 185, 129, 0.15);
}.cell-type-pill[data-type="Improvement"] {
  border-color: rgba(129, 140, 248, 0.75);
  background: rgba(79, 70, 229, 0.18);
}.cell-type-pill[data-type="Tech Debt"] {
  border-color: rgba(248, 113, 113, 0.85);
  background: rgba(248, 113, 113, 0.18);
}.cell-type-pill[data-type="Market Expansion"] {
  border-color: rgba(250, 204, 21, 0.85);
  background: rgba(234, 179, 8, 0.18);
}/* Roadmap status icon pill colors */
.cell-type-pill[data-status="Not Started"] {
  border-color: rgba(148, 163, 184, 0.6);
  background: rgba(71, 85, 105, 0.2);
  color: #94a3b8;
}.cell-type-pill[data-status="In Progress"] {
  border-color: rgba(59, 130, 246, 0.75);
  background: rgba(37, 99, 235, 0.18);
  color: #60a5fa;
}.cell-type-pill[data-status="On Hold"] {
  border-color: rgba(251, 191, 36, 0.75);
  background: rgba(245, 158, 11, 0.15);
  color: #fbbf24;
}.cell-type-pill[data-status="Done"] {
  border-color: rgba(52, 211, 153, 0.75);
  background: rgba(16, 185, 129, 0.15);
  color: #34d399;
}.cell-type-pill[data-status="Cancelled"] {
  border-color: rgba(248, 113, 113, 0.75);
  background: rgba(239, 68, 68, 0.15);
  color: #f87171;
}.cell-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}.cell-actions button {
  padding-inline: 0.6rem;
  min-height: 30px;
  font-size: 0.8125rem;
}.sort-button {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.1rem 0.3rem;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: inherit;
  box-shadow: none;
  cursor: pointer;
  font-size: inherit;
}.sort-button:hover {
  background: rgba(15, 23, 42, 0.9);
  color: #e5e7eb;
}.sort-indicator {
  opacity: 0.4;
  font-size: 0.8rem;
}th[data-sort-active="true"] .sort-indicator {
  opacity: 1;
  color: #e5e7eb;
}/* Checkbox */
.checkbox-input {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  border: 1px solid rgba(148, 163, 184, 0.7);
  accent-color: #6366f1;
  cursor: pointer;
}/* Empty state */
.empty-state {
  text-align: center;
  padding: 1.25rem 0.75rem;
  color: var(--muted);
  font-size: 0.875rem;
}/* Modal */
.modal-backdrop {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at top, rgba(15, 23, 42, 0.2), rgba(0, 0, 0, 0.85));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 0.75rem;
  z-index: 1000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease-out;
}/* When modals/toast are moved into a fullscreen view,
keep them on top */
.roadmaps-view .modal-backdrop {
  z-index: 9998;
}.roadmaps-view .toast-container {
  z-index: 9999;
}/* Tooltips appended to fullscreen element must stay on top so they remain visible */
.roadmaps-view:fullscreen > .cell-type-tooltip,
.roadmaps-view.view-pseudo-fullscreen > .cell-type-tooltip,
.roadmaps-view::-webkit-full-screen > .cell-type-tooltip {
  z-index: 10000;
}.modal-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}html.app-scroll-lock,
body.app-scroll-lock {
  overflow: hidden !important;
  overscroll-behavior: none;
}html.blocking-modal-open,
html.blocking-modal-open body {
  overscroll-behavior: none;
}html.blocking-modal-open .compact-tooltip-backdrop--visible,
html.blocking-modal-open.compact-tooltip-open .app-overlay-host .compact-tooltip-backdrop--visible {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}html.blocking-modal-open .app-shell,
html.blocking-modal-open .table-wrapper {
  overflow: hidden !important;
}html.is-compact-layout.blocking-modal-open .app-layout,
html.is-compact-layout.blocking-modal-open .workspace-panel--v2,
html.is-compact-layout.blocking-modal-open .roadmaps-view {
  overflow: hidden !important;
  overscroll-behavior: none;
}.modal-backdrop.active {
  overscroll-behavior: none;
  overflow: hidden;
}html.is-compact-layout .modal-backdrop.active {
  cursor: default;
}.modal-backdrop .modal-panel {
  touch-action: auto;
}.modal-backdrop .roadmap-modal-scroll {
  overscroll-behavior: contain;
}.modal-backdrop {
  --modal-safe-pad-y: 1.5rem;
  --modal-safe-pad-x: 0.75rem;
}.modal-panel {
  max-width: 900px;
  width: 100%;
  background: radial-gradient(circle at top left, rgba(79, 70, 229, 0.3), rgba(15, 23, 42, 0.98));
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.8);
  box-shadow: 0 26px 60px rgba(15, 23, 42, 0.98);
  padding: 1.2rem 1.3rem 1.3rem;
  transform: none;
  opacity: 0;
  transition: opacity 0.18s ease-out;
}#roadmapModal .modal-panel,
#profileViewModal .modal-panel,
#profileEditModal .modal-panel,
#profileDeleteModal .modal-panel,
#roadmapDeleteModal .modal-panel,
#roadmapDeleteModal .modal-panel {
  background: #020617;
}/* Roadmap modal: refined padding and spacing for a polished layout */
#roadmapModal {
  --roadmap-field-pad-block: 0.75rem;
  --roadmap-field-pad-inline: 0.88rem;
  --roadmap-field-min-height: 44px;
  --roadmap-field-gap: 1rem;
  --roadmap-section-pad: 1.2rem;
  --roadmap-label-gap: 0.42rem;
  --roadmap-inner-pad: 0.95rem;
}#roadmapModal .modal-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-width: min(1120px, 96vw);
  max-height: min(92vh, 980px);
  padding: 1.2rem 1.2rem 1.05rem;
  border-radius: 20px;
  border: 1px solid rgba(202, 138, 4, 0.35);
  background: linear-gradient(180deg, #fffdf8 0%, #fffaf0 100%);
  box-shadow: 0 20px 48px rgba(120, 53, 15, 0.22);
}#roadmapModal .modal-header {
  flex-shrink: 0;
  margin-bottom: 0.85rem;
  padding: 0.15rem 0.2rem 0.85rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.25);
}/* Form must participate in the panel flex column so the scroll region gets a bounded height. */
#roadmapModal #roadmapForm {
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
}#roadmapModal .modal-body.roadmap-modal-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.35rem 0.45rem 0.3rem;
  min-height: 0;
  overflow: hidden;
  flex: 1 1 0%;
}#roadmapModal #roadmapFormError {
  flex-shrink: 0;
}/* Phones + tablets: allow the roadmap modal to use the screen height for more context. */
@media (max-width: 1400px) {
  #roadmapModal.modal-backdrop {
    --roadmap-modal-pad-top: max(var(--modal-safe-pad-y), env(safe-area-inset-top));
    --roadmap-modal-pad-right: max(var(--modal-safe-pad-x), env(safe-area-inset-right));
    --roadmap-modal-pad-bottom: max(var(--modal-safe-pad-y), env(safe-area-inset-bottom));
    --roadmap-modal-pad-left: max(var(--modal-safe-pad-x), env(safe-area-inset-left));

    padding: var(--roadmap-modal-pad-top) var(--roadmap-modal-pad-right)
      var(--roadmap-modal-pad-bottom) var(--roadmap-modal-pad-left);
    align-items: stretch;
    overflow: hidden;
  }

  #roadmapModal .modal-panel {
    height: calc(100dvh - var(--roadmap-modal-pad-top) - var(--roadmap-modal-pad-bottom));
    max-height: none;
    max-width: min(1120px, 100%);
    overflow: hidden;
  }

  #roadmapModal .modal-body.roadmap-modal-body {
    flex: 1 1 auto;
    max-height: none;
    overflow: hidden;
  }

  #roadmapModal .roadmap-modal-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
}#roadmapModal .roadmap-modal-main-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.5rem;
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
}#roadmapModal .roadmap-modal-scroll {
  flex: 1 1 0%;
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  padding-right: 0.05rem;
}#roadmapModal .roadmap-modal-sections-stream {
  min-width: 0;
}#roadmapModal .roadmap-modal-rail-column {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 0.15rem;
  min-height: 0;
  align-self: stretch;
  max-height: 100%;
}#roadmapModal .roadmap-modal-section-rail {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.4rem 0.3rem;
  flex-shrink: 0;
  z-index: 4;
  position: relative;
  background: linear-gradient(180deg, rgba(255, 253, 250, 0.98) 0%, rgba(254, 242, 242, 0.92) 100%);
  border: 1px solid rgba(220, 38, 38, 0.22);
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(127, 29, 29, 0.14);
  overflow: visible;
  min-height: 0;
  max-height: 100%;
}#roadmapModal .roadmap-modal-section-rail:not(.roadmap-modal-section-rail--layout-horizontal) {
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(220, 38, 38, 0.35) transparent;
}#roadmapModal .roadmap-modal-section-rail:not(.roadmap-modal-section-rail--layout-horizontal)::-webkit-scrollbar {
  width: 5px;
}#roadmapModal .roadmap-modal-section-rail:not(.roadmap-modal-section-rail--layout-horizontal)::-webkit-scrollbar-thumb {
  background: rgba(220, 38, 38, 0.35);
  border-radius: 999px;
}#roadmapModal .roadmap-modal-section-active-indicator {
  position: absolute;
  left: 0;
  top: 0;
  width: 0.3rem;
  height: 1.5rem;
  border-radius: 0 999px 999px 0;
  background: #fff;
  box-shadow:
    0 0 0 1px rgba(254, 226, 226, 0.95),
    0 1px 5px rgba(127, 29, 29, 0.28);
  pointer-events: none;
  z-index: 10;
  opacity: 0;
  transform: translate(var(--section-indicator-x, 0px), var(--section-indicator-y, 0px));
  transition: transform 0.24s cubic-bezier(0.34, 1.02, 0.38, 1), opacity 0.15s ease;
  will-change: transform;
}#roadmapModal .roadmap-modal-section-active-indicator.is-instant {
  transition: none !important;
}#roadmapModal .roadmap-modal-section-rail--indicator-ready .roadmap-modal-section-active-indicator {
  opacity: 1;
}#roadmapModal .roadmap-modal-section-rail--layout-horizontal .roadmap-modal-section-active-indicator {
  width: 1.28rem;
  height: 0.2rem;
  border-radius: 0 0 999px 999px;
}#roadmapModal .roadmap-modal-section-btn {
  position: relative;
  z-index: 1;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  border: 1px solid rgba(185, 28, 28, 0.45);
  border-radius: 10px;
  background: linear-gradient(165deg, #ef4444 0%, #dc2626 55%, #b91c1c 100%);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.12s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 2px 0 rgba(127, 29, 29, 0.35);
  overflow: hidden;
}#roadmapModal .roadmap-modal-section-status {
  display: none;
  position: absolute;
  bottom: 0.16rem;
  right: 0.16rem;
  width: 0.64rem;
  height: 0.64rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(236, 253, 245, 0.97);
  color: #047857;
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(5, 150, 105, 0.34);
  z-index: 2;
}#roadmapModal .roadmap-modal-section-btn.is-populated .roadmap-modal-section-status {
  display: flex;
}#roadmapModal .roadmap-modal-section-status-icon {
  width: 0.46rem;
  height: 0.46rem;
  flex-shrink: 0;
}

@keyframes roadmapModalSectionStatusPulse {
  0% {
    transform: scale(0.55);
    opacity: 0.45;
  }
  55% {
    transform: scale(1.18);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}#roadmapModal .roadmap-modal-section-btn.is-populated-pulse .roadmap-modal-section-status {
  animation: roadmapModalSectionStatusPulse 0.55s cubic-bezier(0.34, 1.4, 0.64, 1);
}#roadmapModal .roadmap-modal-section-btn:hover,
#roadmapModal .roadmap-modal-section-btn:focus-visible {
  background: linear-gradient(165deg, #f87171 0%, #ef4444 50%, #dc2626 100%);
  border-color: rgba(127, 29, 29, 0.65);
  color: #fff;
  outline: none;
  box-shadow: 0 0 0 2px rgba(254, 202, 202, 0.85), 0 2px 0 rgba(127, 29, 29, 0.35);
}#roadmapModal .roadmap-modal-section-btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 rgba(127, 29, 29, 0.4);
}#roadmapModal .roadmap-modal-section-btn.is-active {
  background: linear-gradient(165deg, #b91c1c 0%, #991b1b 100%);
  border-color: rgba(69, 10, 10, 0.75);
  color: #fff;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 2px rgba(254, 226, 226, 0.95);
}#roadmapModal .roadmap-modal-section-icon {
  width: 1.2rem;
  height: 1.2rem;
  flex-shrink: 0;
  pointer-events: none;
}#roadmapModal .roadmap-modal-section-btn[hidden] {
  display: none !important;
}/* 5 Why + Summary nav — roadmap view mode only (not edit/create or other modals) */
#roadmapModal .roadmap-modal-section-btn--view-only {
  display: none !important;
}#roadmapModal.active.roadmap-modal--view .roadmap-modal-section-btn--view-only {
  display: flex !important;
}#roadmapModal.active.roadmap-modal--view .roadmap-modal-section-btn--view-only.roadmap-modal-section-btn--view-only-lead {
  margin-top: 0.15rem;
  position: relative;
}#roadmapModal.active.roadmap-modal--view .roadmap-modal-section-btn--view-only.roadmap-modal-section-btn--view-only-lead::before {
  content: "";
  position: absolute;
  top: -0.28rem;
  left: 0.42rem;
  right: 0.42rem;
  height: 1px;
  background: rgba(220, 38, 38, 0.22);
  pointer-events: none;
}html:has(#profileViewModal.active) #roadmapModal,
html:has(#profileEditModal.active) #roadmapModal,
html:has(#profileCreateModal.active) #roadmapModal,
html:has(#profileDeleteModal.active) #roadmapModal,
html:has(#profileUnlockModal.active) #roadmapModal {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}#roadmapModal .form-section {
  background: #fff;
  border: 1px solid rgba(202, 138, 4, 0.22);
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(120, 53, 15, 0.08);
  padding: var(--roadmap-section-pad) var(--roadmap-section-pad) calc(var(--roadmap-section-pad) + 0.05rem);
  margin-bottom: 1.05rem;
}#roadmapModal .roadmap-modal-scroll .financial-form-section:last-child {
  margin-bottom: 0.35rem;
}#roadmapModal .roadmap-fivewhy-section {
  margin-bottom: 0.35rem;
}#roadmapModal .roadmap-fivewhy-section.roadmap-optional-section-host > .roadmap-optional-section-details {
  border-radius: 14px;
}#roadmapModal .roadmap-fivewhy-section .roadmap-optional-section-body {
  padding-top: 0.15rem;
}#roadmapModal .roadmap-fivewhy-panel {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}#roadmapModal .roadmap-fivewhy-intro {
  margin: 0;
  color: #78350f;
  font-size: 0.92rem;
  line-height: 1.45;
}#roadmapModal .roadmap-fivewhy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}#roadmapModal .roadmap-fivewhy-generate-btn.is-loading,
#roadmapModal .roadmap-fivewhy-reset-btn:disabled {
  opacity: 0.72;
  pointer-events: none;
}#roadmapModal .roadmap-fivewhy-reset-btn {
  background: transparent;
  border: 1px solid rgba(202, 138, 4, 0.35);
  color: #92400e;
}#roadmapModal .roadmap-fivewhy-status {
  margin: 0;
  font-size: 0.86rem;
  color: #92400e;
}#roadmapModal .roadmap-fivewhy-status--error {
  color: #b91c1c;
}#roadmapModal .roadmap-fivewhy-output {
  margin: 0;
  padding: 0.85rem 0.95rem 0.85rem 1.65rem;
  border-radius: 10px;
  border: 1px solid rgba(202, 138, 4, 0.28);
  background: linear-gradient(180deg, #fffdf8 0%, #fff7ed 100%);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}#roadmapModal .roadmap-fivewhy-output.roadmap-fivewhy-output--loading {
  opacity: 0.6;
}#roadmapModal .roadmap-fivewhy-item {
  padding-left: 0.15rem;
}#roadmapModal .roadmap-fivewhy-item__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.6rem;
  margin-bottom: 0.35rem;
}#roadmapModal .roadmap-fivewhy-item__label {
  display: inline-block;
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9a3412;
  white-space: nowrap;
}#roadmapModal .roadmap-fivewhy-item__lens {
  display: inline;
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #b45309;
  line-height: 1.35;
}#roadmapModal .roadmap-fivewhy-item__question {
  margin: 0;
  padding-left: 0.1rem;
  color: #431407;
  font-size: 0.96rem;
  font-weight: 600;
  line-height: 1.5;
}#roadmapModal.roadmap-modal--view .roadmap-fivewhy-section[data-view-only-section] {
  display: block;
}#roadmapModal:not(.roadmap-modal--view) .roadmap-fivewhy-section[data-view-only-section] {
  display: none !important;
}#roadmapModal .roadmap-summary-section {
  margin-bottom: 0.35rem;
}#roadmapModal .roadmap-summary-section.roadmap-optional-section-host > .roadmap-optional-section-details {
  border-radius: 14px;
}#roadmapModal .roadmap-summary-section .roadmap-optional-section-body {
  padding-top: 0.15rem;
}#roadmapModal .roadmap-summary-panel {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}#roadmapModal .roadmap-summary-intro {
  margin: 0;
  color: #78350f;
  font-size: 0.92rem;
  line-height: 1.45;
}#roadmapModal .roadmap-summary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}#roadmapModal .roadmap-summary-generate-btn {
  align-self: flex-start;
  min-height: 2.75rem;
  padding-inline: 1rem;
}#roadmapModal .roadmap-summary-generate-btn.is-loading {
  opacity: 0.72;
  pointer-events: none;
}#roadmapModal .roadmap-summary-status {
  margin: 0;
  font-size: 0.86rem;
  color: #92400e;
}#roadmapModal .roadmap-summary-status--error {
  color: #b91c1c;
}#roadmapModal .roadmap-summary-output {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 0.95rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(202, 138, 4, 0.28);
  background: linear-gradient(180deg, #fffdf8 0%, #fff7ed 100%);
  box-shadow: 0 1px 3px rgba(120, 53, 15, 0.06);
  transition: opacity 0.2s ease;
}#roadmapModal .roadmap-summary-output.roadmap-summary-output--loading .roadmap-summary-paragraph {
  opacity: 0.55;
}/* Summary style toolbar — refined segmented control */
#roadmapModal .roadmap-summary-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.16);
}#roadmapModal .roadmap-summary-toolbar__header {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}#roadmapModal .roadmap-summary-toolbar__label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #a16207;
}#roadmapModal .roadmap-summary-toolbar__hint {
  margin: 0;
  padding: 0.45rem 0.6rem;
  border-radius: 8px;
  border: 1px solid rgba(251, 191, 36, 0.35);
  background: rgba(255, 251, 235, 0.85);
  font-size: 0.76rem;
  line-height: 1.45;
  color: #92400e;
}#roadmapModal .roadmap-summary-toolbar__hint strong {
  font-weight: 700;
  color: #78350f;
}#roadmapModal .roadmap-summary-segment {
  --roadmap-summary-segment-gap: 0.22rem;
  --roadmap-summary-segment-pad: 0.22rem;
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--roadmap-summary-segment-gap);
  width: 100%;
  max-width: 100%;
  padding: var(--roadmap-summary-segment-pad);
  border-radius: 12px;
  border: 1px solid rgba(202, 138, 4, 0.22);
  background: rgba(254, 243, 199, 0.28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}#roadmapModal .roadmap-summary-segment__indicator {
  position: absolute;
  top: var(--roadmap-summary-segment-pad);
  bottom: var(--roadmap-summary-segment-pad);
  left: var(--roadmap-summary-segment-pad);
  width: calc((100% - (var(--roadmap-summary-segment-pad) * 2) - var(--roadmap-summary-segment-gap)) / 2);
  border-radius: 9px;
  background: #fff;
  border: 1px solid rgba(202, 138, 4, 0.28);
  box-shadow:
    0 1px 2px rgba(120, 53, 15, 0.08),
    0 4px 14px rgba(180, 83, 9, 0.1);
  pointer-events: none;
  z-index: 0;
  transition: transform 0.28s cubic-bezier(0.34, 1.12, 0.38, 1);
}#roadmapModal .roadmap-summary-segment[data-active-tone="simplified"] .roadmap-summary-segment__indicator {
  transform: translateX(calc(100% + var(--roadmap-summary-segment-gap)));
}#roadmapModal .roadmap-summary-segment__option {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  min-width: 0;
  min-height: 3.1rem;
  padding: 0.55rem 0.6rem;
  border: none !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #92400e !important;
  font-size: inherit !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  cursor: pointer;
  box-shadow: none !important;
  text-align: left;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.18s ease, opacity 0.18s ease !important;
}#roadmapModal .roadmap-summary-segment__option:hover:not(.roadmap-summary-segment__option--active) {
  color: #7f1d1d !important;
}#roadmapModal .roadmap-summary-segment__option:active:not(.roadmap-summary-segment__option--active) {
  opacity: 0.88;
}#roadmapModal .roadmap-summary-segment__option--active {
  color: #7f1d1d !important;
}#roadmapModal .roadmap-summary-segment__icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.55);
  color: #b45309;
  transition: background 0.18s ease, color 0.18s ease;
}#roadmapModal .roadmap-summary-segment__icon svg {
  width: 1rem;
  height: 1rem;
}#roadmapModal .roadmap-summary-segment__option--active .roadmap-summary-segment__icon {
  background: rgba(254, 226, 226, 0.55);
  color: #b91c1c;
}#roadmapModal .roadmap-summary-segment__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.08rem;
  min-width: 0;
  flex: 1 1 auto;
}#roadmapModal .roadmap-summary-segment__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.28rem;
  max-width: 100%;
}#roadmapModal .roadmap-summary-segment__title {
  display: block;
  max-width: 100%;
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-summary-segment__option--active .roadmap-summary-segment__title {
  font-weight: 700;
  color: #991b1b;
}#roadmapModal .roadmap-summary-segment__meta {
  display: block;
  max-width: 100%;
  font-size: 0.67rem;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0;
  color: #a16207;
  opacity: 0.92;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-summary-segment__option--active .roadmap-summary-segment__meta {
  color: #b45309;
  opacity: 1;
}#roadmapModal .roadmap-summary-segment__chip {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0.1rem 0.38rem;
  border-radius: 5px;
  background: rgba(180, 83, 9, 0.12);
  border: 1px solid rgba(180, 83, 9, 0.22);
  color: #b45309;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  text-transform: none;
  white-space: nowrap;
}#roadmapModal .roadmap-summary-segment__option--active .roadmap-summary-segment__chip {
  background: rgba(185, 28, 28, 0.1);
  border-color: rgba(185, 28, 28, 0.22);
  color: #b91c1c;
}

@media (max-width: 768px) {
  #roadmapModal .roadmap-summary-panel {
    gap: 0.75rem;
  }

  #roadmapModal .roadmap-summary-intro {
    font-size: 0.88rem;
    line-height: 1.5;
  }

  #roadmapModal .roadmap-summary-actions {
    width: 100%;
  }

  #roadmapModal .roadmap-summary-generate-btn {
    align-self: stretch;
    width: 100%;
    justify-content: center;
  }

  #roadmapModal .roadmap-summary-output {
    padding: 0.85rem 0.8rem;
    gap: 0.75rem;
  }

  #roadmapModal .roadmap-summary-segment__option {
    min-height: 2.9rem;
    padding: 0.5rem 0.45rem;
    gap: 0.4rem;
  }

  #roadmapModal .roadmap-summary-segment__icon {
    width: 1.5rem;
    height: 1.5rem;
  }

  #roadmapModal .roadmap-summary-segment__meta {
    font-size: 0.62rem;
  }
}

@media (max-width: 420px) {
  #roadmapModal .roadmap-summary-segment__meta {
    display: none;
  }

  #roadmapModal .roadmap-summary-segment__option {
    min-height: 2.75rem;
    justify-content: center;
    padding-inline: 0.35rem;
  }

  #roadmapModal .roadmap-summary-segment__copy {
    align-items: center;
  }

  #roadmapModal .roadmap-summary-segment__title-row {
    justify-content: center;
  }

  #roadmapModal .roadmap-summary-segment__title {
    font-size: 0.78rem;
  }

  #roadmapModal .roadmap-summary-toolbar__hint {
    font-size: 0.74rem;
    padding: 0.4rem 0.5rem;
  }
}#roadmapModal .roadmap-summary-paragraph {
  margin: 0;
  color: #431407;
  font-size: 0.94rem;
  line-height: 1.55;
}#roadmapModal .roadmap-summary-output[data-summary-tone="professional"] .roadmap-summary-paragraph {
  font-size: 0.93rem;
  line-height: 1.5;
  letter-spacing: 0.01em;
}#roadmapModal .roadmap-summary-output[data-summary-tone="simplified"] .roadmap-summary-paragraph {
  font-size: 0.98rem;
  line-height: 1.68;
}#roadmapModal .roadmap-summary-link {
  font-weight: 700;
  color: #b45309;
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-word;
}#roadmapModal .roadmap-summary-link:hover {
  color: #c2410c;
}#roadmapModal.roadmap-modal--view .roadmap-summary-section[data-view-only-section] {
  display: block;
}#roadmapModal:not(.roadmap-modal--view) .roadmap-summary-section[data-view-only-section] {
  display: none !important;
}#roadmapModal .form-section-header:not(.roadmap-optional-section-summary) {
  margin-bottom: 0.85rem;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.45rem 0.75rem;
}#roadmapModal .form-grid {
  grid-template-columns: minmax(0, 1fr);
  gap: var(--roadmap-field-gap);
}#roadmapModal .form-grid > div {
  min-width: 0;
}#roadmapModal .form-grid label,
#roadmapModal .form-grid .roadmap-field-label {
  margin-bottom: var(--roadmap-label-gap);
  color: #7f1d1d;
  font-weight: 650;
}#roadmapModal input,
#roadmapModal textarea {
  padding: var(--roadmap-field-pad-block) var(--roadmap-field-pad-inline);
  min-height: var(--roadmap-field-min-height);
  border: 1px solid #e8d2a4;
  background: #fffdf8;
  color: #431407;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}#roadmapModal select {
  padding: var(--roadmap-field-pad-block) var(--roadmap-field-pad-inline);
  min-height: var(--roadmap-field-min-height);
  color: #431407;
  font-weight: 500;
}#roadmapModal textarea {
  min-height: 80px;
  padding-top: var(--roadmap-field-pad-block);
}#roadmapModal input::placeholder,
#roadmapModal textarea::placeholder {
  color: #a16207;
  opacity: 0.72;
}#roadmapModal input:focus,
#roadmapModal textarea:focus {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14);
}#roadmapModal .roadmap-field-tooltip-wrap {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}#roadmapModal .roadmap-field-tooltip-wrap:has(.rich-text-editor-host) .roadmap-dynamic-field-hint {
  margin-bottom: 0.55rem;
  color: #78716c;
  line-height: 1.5;
}#roadmapModal .roadmap-field-tooltip-wrap .cell-type-tooltip {
  z-index: 40;
}#roadmapModal .field-meta-row {
  margin-top: 0.65rem;
  gap: 0.45rem;
  background: #fff7e6;
  border: 1px solid rgba(202, 138, 4, 0.22);
  border-radius: 10px;
  padding: 0.45rem 0.58rem;
}#roadmapModal .roadmap-modal-footer-bar {
  position: relative;
  flex-shrink: 0;
  z-index: 6;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1rem;
  margin-top: 0.85rem;
  padding: 0.62rem 0.25rem 0.3rem;
  border-top: 1px solid rgba(202, 138, 4, 0.24);
  background: linear-gradient(180deg, rgba(255, 251, 242, 0.98), rgba(255, 247, 234, 1));
  box-shadow: 0 -4px 14px rgba(120, 53, 15, 0.06);
}#roadmapModal .roadmap-modal-footer-meta-details {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
}#roadmapModal .roadmap-modal-footer-meta-summary {
  display: none;
}#roadmapModal .roadmap-modal-footer-meta-group {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 0.35rem;
}#roadmapModal .roadmap-modal-footer-meta-group .field-meta-row {
  margin-top: 0;
  width: 100%;
  max-width: none;
  min-width: 0;
  border-radius: 12px;
  background: #fff9ee;
  border-color: rgba(202, 138, 4, 0.26);
  box-shadow: 0 2px 8px rgba(120, 53, 15, 0.06);
  padding: 0.42rem 0.55rem;
  font-size: 0.72rem;
  line-height: 1.3;
}#roadmapModal .roadmap-modal-footer-meta-group .field-meta-row > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.55rem;
  min-width: 0;
}#roadmapModal .roadmap-modal-footer-meta-group .field-meta-row > span strong {
  flex: 0 0 auto;
  color: #92400e;
  font-weight: 800;
  letter-spacing: 0.01em;
}#roadmapModal .roadmap-modal-footer-meta-group .field-meta-row > span strong + span {
  flex: 1 1 auto;
  min-width: 0;
  text-align: right;
  color: #451a03;
  font-weight: 650;
}#roadmapModal #roadmapMetaId {
  display: inline-block;
  max-width: 18ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}#roadmapModal #roadmapMetaCreated,
#roadmapModal #roadmapMetaModified,
#roadmapModal #roadmapMetaFinancialEur,
#roadmapModal #roadmapMetaExchangeRate,
#roadmapModal #roadmapMetaRice {
  white-space: nowrap;
}#roadmapModal .roadmap-modal-footer-meta-group .field-meta-row.field-meta-row--financial-eur {
  margin-top: 0;
}#roadmapModal .roadmap-modal-footer-bar .form-actions-row.roadmap-modal-form-actions {
  position: static;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  margin-top: 0;
  padding: 0;
  border-top: none;
  background: transparent;
  backdrop-filter: none;
  justify-content: flex-end;
  gap: 0.55rem;
}/* Tablets + phones: collapsible meta (collapsed by default),
actions always visible. */
@media (max-width: 1400px) {
  #roadmapModal .roadmap-modal-footer-bar {
    /* Use grid instead of flex to prevent "meta left / buttons right" bugs on narrow screens. */
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.55rem;
    align-items: stretch;
    justify-content: stretch;
    padding-bottom: calc(0.4rem + env(safe-area-inset-bottom, 0px));
  }

  #roadmapModal .roadmap-modal-footer-meta-details {
    width: 100%;
    border: 1px solid rgba(202, 138, 4, 0.26);
    border-radius: 12px;
    background: #fff9ee;
    box-shadow: 0 2px 8px rgba(120, 53, 15, 0.06);
    overflow: hidden;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.12rem;
    padding: 0.52rem 2rem 0.52rem 0.65rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    text-align: left;
    background: transparent;
    transition: background 0.15s ease;
    min-height: 44px;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary:hover {
    background: rgba(202, 138, 4, 0.08);
  }

  #roadmapModal .roadmap-modal-footer-meta-summary:focus-visible {
    outline: 2px solid rgba(180, 83, 9, 0.45);
    outline-offset: -2px;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary::-webkit-details-marker {
    display: none;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary::after {
    content: "▾";
    position: absolute;
    right: 0.7rem;
    top: 50%;
    transform: translateY(-50%);
    color: #b45309;
    font-size: 0.85rem;
    line-height: 1;
    transition: transform 0.2s ease;
  }

  #roadmapModal .roadmap-modal-footer-meta-details[open] .roadmap-modal-footer-meta-summary::after {
    transform: translateY(-50%) rotate(180deg);
  }

  #roadmapModal .roadmap-modal-footer-meta-details[open] .roadmap-modal-footer-meta-summary {
    border-bottom: 1px solid rgba(202, 138, 4, 0.22);
  }

  #roadmapModal .roadmap-modal-footer-meta-details[open] .roadmap-modal-footer-meta-summary-hint {
    display: none;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary-title {
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #92400e;
  }

  #roadmapModal .roadmap-modal-footer-meta-summary-hint {
    font-size: 0.7rem;
    line-height: 1.35;
    color: #78350f;
  }

  #roadmapModal .roadmap-modal-footer-meta-details .roadmap-modal-footer-meta-group {
    display: grid !important;
    padding: 0.45rem 0.45rem 0.5rem;
    gap: 0.4rem;
    border: none;
    background: transparent;
    box-shadow: none;
  }

  #roadmapModal .roadmap-modal-footer-meta-group {
    width: 100%;
  }

  #roadmapModal .roadmap-modal-footer-bar .form-actions-row.roadmap-modal-form-actions {
    width: 100%;
    justify-content: stretch;
    margin-top: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.55rem;
  }

  #roadmapModal .roadmap-modal-footer-bar .form-actions-row.roadmap-modal-form-actions > button {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    min-height: 44px;
    white-space: nowrap;
  }
}/* Desktop: meta cards always visible (details forced open via JS). */
@media (min-width: 1401px) {
  #roadmapModal .roadmap-modal-footer-meta-details {
    display: block;
    border: none;
    background: transparent;
    box-shadow: none;
    overflow: visible;
  }

  #roadmapModal .roadmap-modal-footer-meta-details .roadmap-modal-footer-meta-group {
    display: grid !important;
  }
}/* Very narrow phones: stack meta cards only; action buttons stay in one row. */
@media (max-width: 520px) {
  #roadmapModal .roadmap-modal-footer-meta-group {
    grid-template-columns: minmax(0, 1fr);
  }

  #roadmapModal #roadmapMetaId {
    max-width: 22ch;
  }
}#profileViewModal .form-actions-row {
  margin-top: 1.1rem;
  padding-top: 0.5rem;
  gap: 0.6rem;
  justify-content: flex-end;
}#profileEditModal .form-actions-row {
  margin-top: 1.1rem;
  padding-top: 0.5rem;
  gap: 0.6rem;
  justify-content: flex-end;
}#roadmapModal .countries-section,
#roadmapModal .roadmap-meta-fields-stack {
  gap: 0.5rem;
}#roadmapModal .countries-section label,
#roadmapModal .roadmap-meta-fields-stack label {
  margin-top: 0.5rem;
  margin-bottom: 0.3rem;
}#roadmapModal .countries-section label:first-child,
#roadmapModal .roadmap-meta-fields-stack label:first-child {
  margin-top: 0;
}#roadmapModal #roadmapFormError {
  margin-top: 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: #fff1f2;
  border: 1px solid rgba(220, 38, 38, 0.24);
}#roadmapModal .financial-form-section {
  border-color: rgba(220, 38, 38, 0.2);
}#roadmapModal #financialFrameworkFields {
  margin-top: 0.72rem;
}#roadmapModal [data-framework-fields] {
  width: 100%;
  padding: var(--roadmap-inner-pad);
  border: 1px dashed rgba(185, 28, 28, 0.22);
  border-radius: 12px;
  background: #fffaf5;
}#roadmapModal .financial-clv-breakdown {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.45rem 0.6rem;
  margin-top: 0.2rem;
  padding: 0.6rem;
  border-radius: 10px;
  border: 1px solid rgba(180, 83, 9, 0.28);
  background: #fffbeb;
}#roadmapModal .financial-clv-breakdown-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.75);
}#roadmapModal .financial-clv-breakdown-row span {
  font-size: 0.74rem;
  color: #92400e;
}#roadmapModal .financial-clv-breakdown-row strong {
  font-size: 0.8rem;
  color: #7f1d1d;
}#roadmapModal .financial-ops-helper-text {
  font-size: 0.74rem;
  color: #92400e;
  line-height: 1.4;
  border: 1px solid rgba(202, 138, 4, 0.2);
  border-radius: 8px;
  background: #fff8ee;
  padding: 0.4rem 0.5rem;
}#roadmapModal .financial-clv-breakdown-row.is-missing {
  border: 1px solid rgba(220, 38, 38, 0.35);
  background: #fff1f2;
}#roadmapModal .financial-clv-breakdown-row.is-missing strong {
  color: #b91c1c;
}#roadmapModal .financial-nps-formula-row {
  grid-column: 1 / -1;
  display: block;
}#roadmapModal .financial-nps-formula-text {
  display: block;
  width: 100%;
  font-size: 0.71rem;
  line-height: 1.38;
  color: #78350f;
}#roadmapModal .financial-framework-hint {
  margin-bottom: 0.65rem;
  padding: 0.42rem 0.55rem;
  border-radius: 9px;
  background: #fff7ed;
  border: 1px solid rgba(202, 138, 4, 0.26);
  color: #7c2d12;
}#roadmapModal #financialImpactValue.is-computed {
  background: #fff6e5;
  border-color: rgba(180, 83, 9, 0.48);
  color: #7c2d12;
  font-weight: 700;
}

@media (max-width: 920px) {
  #roadmapModal .modal-panel {
    padding: 1rem 0.85rem 0.85rem;
  }
  #roadmapModal .modal-body.roadmap-modal-body {
    padding: 0.3rem 0.35rem 0.25rem;
  }
  #roadmapModal .form-section {
    padding: 1.05rem 1rem 1.1rem;
  }
}

@media (max-width: 640px) {
  #roadmapModal .modal-header {
    padding: 0.1rem 0.05rem 0.75rem;
  }
  #roadmapModal .roadmap-modal-main-row {
    flex-direction: column-reverse;
    gap: 0.35rem;
  }
  #roadmapModal .roadmap-modal-scroll {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
  }
  #roadmapModal .roadmap-modal-rail-column {
    flex-shrink: 0;
    width: 100%;
    align-items: stretch;
    padding-top: 0;
  }
  #roadmapModal .roadmap-modal-section-rail {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    width: 100%;
    padding: 0.4rem 0.35rem;
    gap: 0.45rem;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  #roadmapModal .roadmap-modal-section-rail::-webkit-scrollbar {
    display: none;
  }

  #roadmapModal .roadmap-modal-section-btn {
    width: 2.15rem;
    height: 2.15rem;
    flex-shrink: 0;
  }

  #roadmapModal .roadmap-modal-section-status {
    bottom: 0.12rem;
    right: 0.12rem;
    width: 0.58rem;
    height: 0.58rem;
  }

  #roadmapModal .roadmap-modal-section-status-icon {
    width: 0.42rem;
    height: 0.42rem;
  }
  #roadmapModal .roadmap-modal-footer-bar {
    flex-direction: column;
    align-items: stretch;
  }
  #roadmapModal .roadmap-modal-footer-meta-group {
    flex-basis: auto;
    min-width: 0;
  }
  #roadmapModal .roadmap-modal-footer-meta-group .field-meta-row {
    max-width: none;
  }
  #roadmapModal .roadmap-modal-footer-bar .form-actions-row.roadmap-modal-form-actions {
    justify-content: stretch;
  }
  #roadmapModal [data-framework-fields] {
    padding: 0.58rem;
  }
}/* Roadmap delete modal: clear spacing for message and actions */
#roadmapDeleteModal .modal-panel {
  padding: 1.4rem 1.6rem 1.6rem;
}#roadmapDeleteModal .modal-body {
  display: block;
  padding: 0.2rem 0 0;
}#roadmapDeleteModal .modal-body .modal-subtitle {
  margin-bottom: 1.25rem;
  line-height: 1.5;
}#roadmapDeleteModal .form-actions {
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: 1rem;
  justify-content: flex-end;
}#profileDeleteCancelTopBtn {
  display: none;
}.modal-backdrop.active .modal-panel {
  transform: none;
  opacity: 1;
}.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.8rem;
  flex-wrap: wrap;
}.modal-title-group {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}.modal-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 650;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #e5e7eb;
}.modal-subtitle {
  margin: 0;
  font-size: 0.76rem;
  color: var(--muted);
}.modal-subtitle-strong {
  font-weight: 500;
  color: #e5e7eb;
}.modal-close-btn {
  padding-inline: 0.7rem;
  min-height: 32px;
  font-size: 0.72rem;
}#roadmapModal .modal-close-btn {
  display: none;
}.modal-body {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.95fr);
  gap: 1.1rem;
}

@media (max-width: 900px) {
  .modal-body {
    grid-template-columns: minmax(0, 1fr);
  }
}.form-section {
  border-radius: var(--radius-md);
  border: 1px solid rgba(51, 65, 85, 0.9);
  padding: 0.85rem 0.9rem 0.9rem;
  background: radial-gradient(circle at top left, rgba(30, 64, 175, 0.32), rgba(15, 23, 42, 0.98));
  margin-bottom: 0.6rem;
}.form-section-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}.form-section-title {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #a5b4fc;
  font-weight: 600;
}.form-section-hint {
  font-size: 0.7rem;
  color: var(--muted);
}.form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.9fr);
  gap: 0.7rem 0.8rem;
  align-items: flex-start;
}.form-grid-full {
  grid-template-columns: minmax(0, 1fr);
}.form-actions-row {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 0.85rem;
}.form-row-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}.field-meta-row {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  margin-top: 0.4rem;
  font-size: 0.7rem;
  color: var(--muted);
}.field-meta-row span {
  display: inline-flex;
  align-items: center;
  gap: 0.18rem;
}.field-error {
  margin-top: 0.35rem;
  font-size: 0.72rem;
  color: #fecaca;
}.tag {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.18rem 0.45rem;
  border-radius: 999px;
  font-size: 0.68rem;
  border: 1px solid rgba(148, 163, 184, 0.45);
  color: var(--muted);
  background: rgba(15, 23, 42, 0.96);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}.tag-strong {
  color: #e5e7eb;
  border-color: rgba(129, 140, 248, 0.9);
  background: rgba(30, 64, 175, 0.55);
}.pill-soft {
  background: rgba(30, 64, 175, 0.3);
  border-color: rgba(129, 140, 248, 0.72);
  color: #e5e7eb;
}.pill-soft strong {
  font-weight: 600;
  margin-right: 0.15rem;
}.hint-muted {
  font-size: 0.7rem;
  color: var(--muted);
}.countries-section,
.roadmap-meta-fields-stack {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}.countries-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}.country-row {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}.country-row select {
  flex: 1 1 auto;
}.country-remove-btn {
  padding: 0.25rem 0.45rem;
  min-width: 28px;
  min-height: 30px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  box-shadow: none;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.6);
  color: #fecaca;
}.country-remove-btn:hover {
  background: rgba(248, 113, 113, 0.2);
  border-color: rgba(248, 113, 113, 0.9);
  color: #fee2e2;
  box-shadow: 0 8px 20px rgba(127, 29, 29, 0.9);
}/* Labels & links — scoped to roadmap modal light theme */
#roadmapModal .field-optional-tag {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #a16207;
  opacity: 0.85;
}#roadmapModal .field-required-tag {
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #b91c1c;
  opacity: 0.9;
}/* Optional roadmap fields & sections — custom disclosure (no native details) */
#roadmapModal.active .roadmap-optional-disclosure,
#roadmapModal.active button.roadmap-optional-disclosure-trigger {
  pointer-events: auto;
}#roadmapModal button.roadmap-optional-disclosure-trigger {
  appearance: none;
  -webkit-appearance: none;
  border: none;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  box-sizing: border-box;
  width: 100%;
  cursor: pointer;
}#roadmapModal button.roadmap-optional-disclosure-trigger,
#roadmapModal button.roadmap-optional-disclosure-trigger:hover,
#roadmapModal button.roadmap-optional-disclosure-trigger:active,
#roadmapModal button.roadmap-optional-disclosure-trigger:focus,
#roadmapModal button.roadmap-optional-disclosure-trigger:focus-visible {
  background: transparent !important;
  color: inherit !important;
  border: none !important;
  box-shadow: none !important;
  filter: none !important;
  text-transform: none !important;
  min-height: 0 !important;
}#roadmapModal .roadmap-optional-disclosure:not(.is-open) > .roadmap-optional-field-body,
#roadmapModal .roadmap-optional-disclosure:not(.is-open) > .roadmap-optional-section-body,
#roadmapModal .roadmap-tasks-disclosure:not(.is-open) > .roadmap-tasks-disclosure-body,
#roadmapModal .roadmap-countries-disclosure:not(.is-open) > .roadmap-countries-disclosure-body {
  display: none;
}#roadmapModal .roadmap-optional-disclosure.is-open > .roadmap-optional-field-body,
#roadmapModal .roadmap-optional-disclosure.is-open > .roadmap-optional-section-body,
#roadmapModal .roadmap-tasks-disclosure.is-open > .roadmap-tasks-disclosure-body,
#roadmapModal .roadmap-countries-disclosure.is-open > .roadmap-countries-disclosure-body {
  display: block;
}#roadmapModal .roadmap-optional-field-wrap {
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}#roadmapModal .roadmap-optional-disclosure {
  width: 100%;
  border: 1px solid rgba(202, 138, 4, 0.16);
  border-radius: 12px;
  background: #fffefb;
  box-shadow: none;
  overflow: hidden;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}#roadmapModal .roadmap-optional-section-details {
  border-radius: 14px;
}#roadmapModal .form-section.roadmap-optional-section-host {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}#roadmapModal .form-section.roadmap-optional-section-host > .roadmap-optional-section-details {
  margin: 0;
}#roadmapModal .roadmap-optional-disclosure:hover {
  border-color: rgba(202, 138, 4, 0.28);
}#roadmapModal .roadmap-optional-disclosure.is-open {
  border-color: rgba(202, 138, 4, 0.32);
  box-shadow: 0 1px 4px rgba(120, 53, 15, 0.06);
}#roadmapModal .roadmap-optional-disclosure.roadmap-optional--has-data:not(.is-open) {
  border-color: rgba(5, 150, 105, 0.28);
  background: #f8fdf9;
}#roadmapModal .roadmap-optional-field-summary,
#roadmapModal .roadmap-optional-section-summary {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  padding: 0.72rem 0.85rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
  text-align: left;
  background: transparent;
  transition: background 0.15s ease;
  min-height: 0;
  margin-bottom: 0;
  overflow: hidden;
}#roadmapModal .roadmap-optional-section-summary {
  padding: 0.85rem 0.95rem;
}#roadmapModal .roadmap-optional-field-summary:hover,
#roadmapModal .roadmap-optional-section-summary:hover {
  background: rgba(254, 243, 199, 0.35);
}#roadmapModal .roadmap-optional-field-summary:focus-visible,
#roadmapModal .roadmap-optional-section-summary:focus-visible {
  outline: 2px solid rgba(180, 83, 9, 0.42);
  outline-offset: -2px;
}#roadmapModal .roadmap-optional-field-summary::-webkit-details-marker,
#roadmapModal .roadmap-optional-section-summary::-webkit-details-marker {
  display: none;
}#roadmapModal .roadmap-optional-summary-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.45rem;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}#roadmapModal .roadmap-optional-summary-lead {
  display: none;
}#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead {
  width: 1.95rem;
  height: 1.95rem;
  background: rgba(254, 243, 199, 0.72);
  border-color: rgba(180, 83, 9, 0.28);
}#roadmapModal .roadmap-optional-summary-lead::before,
#roadmapModal .roadmap-optional-summary-lead::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #b45309;
  border-radius: 1px;
  transform: translate(-50%, -50%);
  transition: transform 0.18s ease, opacity 0.18s ease;
}#roadmapModal .roadmap-optional-field-details .roadmap-optional-summary-lead::before {
  width: 0.62rem;
  height: 1.5px;
}#roadmapModal .roadmap-optional-field-details .roadmap-optional-summary-lead::after {
  width: 1.5px;
  height: 0.62rem;
}#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead::before,
#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead::after {
  width: 0.72rem;
  height: 1.5px;
  opacity: 1;
}#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead::before {
  transform: translate(-50%, calc(-50% - 3px));
}#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead::after {
  transform: translate(-50%, calc(-50% + 3px));
}#roadmapModal .roadmap-optional-field-details.is-open .roadmap-optional-summary-lead,
#roadmapModal .roadmap-optional-section-details.is-open .roadmap-optional-summary-lead {
  background: rgba(254, 226, 226, 0.45);
  border-color: rgba(248, 113, 113, 0.28);
}#roadmapModal .roadmap-optional-field-details.is-open .roadmap-optional-summary-lead::after {
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.4);
}#roadmapModal .roadmap-optional-section-details.is-open .roadmap-optional-summary-lead::before {
  transform: translate(-50%, -50%) rotate(90deg);
}#roadmapModal .roadmap-optional-section-details.is-open .roadmap-optional-summary-lead::after {
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.4);
}#roadmapModal .roadmap-optional-summary-copy {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0;
  flex: 1 1 auto;
}#roadmapModal .roadmap-optional-field-summary-title {
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.25;
  color: #431407;
  letter-spacing: 0.01em;
}#roadmapModal .roadmap-optional-section-title {
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #92400e;
  line-height: 1.2;
}#roadmapModal .roadmap-optional-section-subtitle,
#roadmapModal .roadmap-optional-field-summary-subtitle {
  font-size: 0.72rem;
  line-height: 1.35;
  color: #78716c;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}#roadmapModal .roadmap-optional-disclosure:not(.is-open) .roadmap-optional-section-subtitle,
#roadmapModal .roadmap-optional-disclosure:not(.is-open) .roadmap-optional-field-summary-subtitle {
  display: none;
}#roadmapModal .roadmap-optional-disclosure:not(.is-open) .roadmap-optional-field-summary-title,
#roadmapModal .roadmap-optional-disclosure:not(.is-open) .roadmap-optional-section-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-optional-status-dot {
  flex: 0 0 auto;
  flex-shrink: 0;
  width: 0.46rem;
  height: 0.46rem;
  border-radius: 999px;
  background: #059669;
  box-shadow: 0 0 0 2px rgba(5, 150, 105, 0.18);
  display: none;
}#roadmapModal .roadmap-optional--has-data:not(.is-open) .roadmap-optional-status-dot {
  display: block;
}#roadmapModal .roadmap-optional-badge {
  flex: 0 0 auto;
  flex-shrink: 0;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  line-height: 1;
  padding: 0.14rem 0.42rem;
  border-radius: 6px;
  white-space: nowrap;
}#roadmapModal .roadmap-optional-badge--field {
  color: #92400e;
  background: rgba(251, 191, 36, 0.14);
  border: 1px solid rgba(251, 191, 36, 0.22);
}#roadmapModal .roadmap-optional-badge--section {
  color: #9a3412;
  background: rgba(254, 215, 170, 0.35);
  border: 1px solid rgba(234, 88, 12, 0.22);
}#roadmapModal .roadmap-optional-summary-chevron {
  flex: 0 0 auto;
  flex-shrink: 0;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 999px;
  border: 1px solid rgba(202, 138, 4, 0.18);
  background: rgba(255, 255, 255, 0.72);
  position: relative;
  transition: transform 0.2s ease, background 0.15s ease, border-color 0.15s ease;
}#roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-chevron {
  width: 1.7rem;
  height: 1.7rem;
}#roadmapModal .roadmap-optional-summary-chevron::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 46%;
  width: 0.36rem;
  height: 0.36rem;
  border-right: 1.5px solid #b45309;
  border-bottom: 1.5px solid #b45309;
  transform: translate(-50%, -50%) rotate(45deg);
  transition: transform 0.2s ease;
}#roadmapModal .roadmap-optional-disclosure.is-open .roadmap-optional-summary-chevron::before {
  transform: translate(-50%, -35%) rotate(-135deg);
}#roadmapModal .roadmap-optional-disclosure.is-open .roadmap-optional-field-summary,
#roadmapModal .roadmap-optional-disclosure.is-open .roadmap-optional-section-summary {
  border-bottom: 1px solid rgba(202, 138, 4, 0.14);
  background: rgba(255, 251, 245, 0.72);
}#roadmapModal .roadmap-optional-field-body {
  padding: var(--roadmap-inner-pad) calc(var(--roadmap-inner-pad) + 0.05rem) calc(var(--roadmap-inner-pad) + 0.1rem);
  animation: roadmapOptionalReveal 0.2s ease;
}#roadmapModal .roadmap-optional-section-body {
  padding: 0.65rem var(--roadmap-inner-pad) var(--roadmap-inner-pad);
  animation: roadmapOptionalReveal 0.2s ease;
}

@keyframes roadmapOptionalReveal {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}#roadmapModal .roadmap-optional-field-body .roadmap-dynamic-field-hint {
  margin-top: 0;
}

@media (max-width: 1024px) {
  #roadmapModal .roadmap-optional-field-summary,
  #roadmapModal .roadmap-optional-section-summary,
  #roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-tasks-disclosure-summary,
  #roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-countries-disclosure-summary {
    flex-wrap: nowrap;
    gap: 0.45rem;
    padding: 0.68rem 0.75rem;
  }

  #roadmapModal .roadmap-optional-summary-row,
  #roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-tasks-summary-row,
  #roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-countries-summary-row {
    flex-wrap: nowrap;
    gap: 0.38rem;
  }

  #roadmapModal .roadmap-optional-badge--field,
  #roadmapModal .roadmap-optional-badge--section {
    font-size: 0.58rem;
    padding-inline: 0.38rem;
  }
}

@media (max-width: 420px) {
  #roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-lead,
  #roadmapModal .roadmap-optional-field-details .roadmap-optional-summary-lead {
    width: 1.55rem;
    height: 1.55rem;
  }

  #roadmapModal .roadmap-optional-section-details .roadmap-optional-summary-chevron,
  #roadmapModal .roadmap-optional-summary-chevron {
    width: 1.45rem;
    height: 1.45rem;
  }

  #roadmapModal .roadmap-optional-badge {
    font-size: 0.54rem;
    padding: 0.18rem 0.32rem;
    letter-spacing: 0.03em;
  }
}

@media (prefers-reduced-motion: reduce) {
  #roadmapModal .roadmap-optional-field-body,
  #roadmapModal .roadmap-optional-section-body {
    animation: none;
  }

  #roadmapModal .roadmap-optional-summary-chevron,
  #roadmapModal .roadmap-optional-summary-chevron::before,
  #roadmapModal .roadmap-optional-summary-lead::after {
    transition: none;
  }

  #roadmapModal .roadmap-modal-section-btn.is-populated-pulse .roadmap-modal-section-status {
    animation: none;
  }

  #roadmapModal .roadmap-modal-section-status {
    transition: none;
  }

  #roadmapModal .roadmap-modal-section-active-indicator {
    transition: none;
  }
}#roadmapModal .roadmap-dynamic-field-hint {
  margin: 0 0 0.4rem;
  font-size: 0.72rem;
  line-height: 1.45;
  color: #78716c;
}#roadmapModal .roadmap-status-field-wrap--centralized select:disabled {
  background: #fff7ed;
  border-color: rgba(234, 88, 12, 0.28);
  color: #92400e;
  opacity: 1;
  cursor: default;
}#roadmapModal .roadmap-status-centralized-hint {
  color: #b45309;
}#roadmapModal .roadmap-dynamic-field-panel {
  background: #fffdf8;
  border: 1px solid #e8d2a4;
  border-radius: 9px;
  padding: var(--roadmap-inner-pad) calc(var(--roadmap-inner-pad) + 0.05rem);
  min-height: 2.85rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}#roadmapModal .roadmap-dynamic-add-btn {
  align-self: flex-start;
  min-height: 34px;
  font-size: 0.74rem;
  font-weight: 650;
  padding-inline: 0.72rem;
  margin-top: 0.45rem;
  color: #7f1d1d;
  border-color: #e8d2a4;
  background: #fff7e6;
}#roadmapModal .roadmap-dynamic-add-btn:hover {
  background: #ffedd5;
  border-color: #ca8a04;
  color: #431407;
}#roadmapModal .roadmap-labels-list,
#roadmapModal .roadmap-links-list,
#roadmapModal .roadmap-tasks-list,
#roadmapModal .roadmap-periods-list,
#roadmapModal .roadmap-countries-list {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}#roadmapModal .roadmap-link-row-header,
#roadmapModal .roadmap-task-row-header,
#roadmapModal .roadmap-period-row-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) 52px 34px;
  gap: 0.4rem;
  padding: 0 0.05rem 0.15rem;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #a16207;
}#roadmapModal .roadmap-task-row-header,
#roadmapModal .roadmap-period-row-header {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) 34px;
}#roadmapModal .roadmap-row-reorder-header-spacer {
  display: block;
  min-width: 0;
}#roadmapModal .roadmap-label-row,
#roadmapModal .roadmap-link-row,
#roadmapModal .roadmap-task-row,
#roadmapModal .roadmap-period-row {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}#roadmapModal .roadmap-task-row,
#roadmapModal .roadmap-period-row {
  gap: 0.55rem;
  padding: 0.55rem 0.65rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.08);
}#roadmapModal .roadmap-task-row:last-child,
#roadmapModal .roadmap-period-row:last-child {
  border-bottom: none;
}#roadmapModal .roadmap-link-row__fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: 0.4rem;
  flex: 1 1 auto;
  min-width: 0;
}#roadmapModal .roadmap-task-row__fields,
#roadmapModal .roadmap-period-row__fields {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 0.4rem;
  flex: 1 1 auto;
  min-width: 0;
}#roadmapModal .roadmap-label-row input,
#roadmapModal .roadmap-link-row input,
#roadmapModal .roadmap-task-row input,
#roadmapModal .roadmap-task-row select,
#roadmapModal .roadmap-period-row select {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
}#roadmapModal .roadmap-period-row--duplicate .roadmap-period-select {
  border-color: rgba(220, 38, 38, 0.72);
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.22);
}#roadmapModal .roadmap-label-remove-btn,
#roadmapModal .roadmap-link-remove-btn,
#roadmapModal .roadmap-task-remove-btn,
#roadmapModal .roadmap-period-remove-btn {
  flex-shrink: 0;
  padding: 0;
  min-width: 34px;
  min-height: 42px;
  font-size: 1.05rem;
  line-height: 1;
  font-weight: 700;
  border-radius: 8px;
  box-shadow: none;
  background: #fff7e6;
  border: 1px solid #e8d2a4;
  color: #b91c1c;
}#roadmapModal .roadmap-label-remove-btn:hover,
#roadmapModal .roadmap-link-remove-btn:hover,
#roadmapModal .roadmap-task-remove-btn:hover {
  background: #fee2e2;
  border-color: #dc2626;
  color: #7f1d1d;
  box-shadow: none;
}#roadmapModal .roadmap-row-reorder {
  display: inline-flex;
  flex-direction: column;
  gap: 0.14rem;
  flex-shrink: 0;
  align-self: center;
}#roadmapModal .roadmap-row-reorder-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  min-height: 18px;
  padding: 0;
  font-size: 0.82rem;
  line-height: 1;
  font-weight: 700;
  border-radius: 7px;
  box-shadow: none;
  background: #fffdf8;
  border: 1px solid #e8d2a4;
  color: #8a5b16;
  cursor: pointer;
}#roadmapModal .roadmap-row-reorder-btn:hover:not(:disabled) {
  background: #fff7e6;
  border-color: #d4af37;
  color: #9f1239;
}#roadmapModal .roadmap-row-reorder-btn:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}#roadmapModal .roadmap-tasks-readonly,
#roadmapModal .roadmap-raci-readonly {
  display: flex;
  flex-direction: column;
}#roadmapModal .roadmap-task-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.68rem 0.9rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.1);
  transition: background-color 0.16s ease;
}#roadmapModal .roadmap-task-card:last-child {
  border-bottom: none;
}#roadmapModal .roadmap-task-card:hover {
  background: rgba(255, 251, 245, 0.92);
}#roadmapModal .roadmap-task-card__main {
  display: flex;
  align-items: center;
  gap: 0.58rem;
  min-width: 0;
  flex: 1 1 auto;
}#roadmapModal .roadmap-task-card__status-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
  background: #d6d3d1;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.95);
}#roadmapModal .roadmap-task-card__status-dot[data-status="Not Started"] {
  background: #a8a29e;
}#roadmapModal .roadmap-task-card__status-dot[data-status="In Progress"] {
  background: #3b82f6;
}#roadmapModal .roadmap-task-card__status-dot[data-status="On Hold"] {
  background: #f59e0b;
}#roadmapModal .roadmap-task-card__status-dot[data-status="Done"] {
  background: #10b981;
}#roadmapModal .roadmap-task-card__status-dot[data-status="Cancelled"] {
  background: #ef4444;
}#roadmapModal .roadmap-task-card__name {
  font-size: 0.86rem;
  font-weight: 600;
  color: #292524;
  line-height: 1.4;
  word-break: break-word;
}#roadmapModal .roadmap-task-card__status {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.24rem 0.62rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.015em;
  line-height: 1.25;
  white-space: nowrap;
  background: #fafaf9;
  border: 1px solid rgba(168, 162, 158, 0.35);
  color: #57534e;
}#roadmapModal .roadmap-task-card__status::before {
  content: "";
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.85;
}#roadmapModal .roadmap-task-card__status[data-status="Not Started"] {
  background: #fafaf9;
  border-color: rgba(168, 162, 158, 0.35);
  color: #57534e;
}#roadmapModal .roadmap-task-card__status[data-status="In Progress"] {
  background: #eff6ff;
  border-color: rgba(59, 130, 246, 0.28);
  color: #1d4ed8;
}#roadmapModal .roadmap-task-card__status[data-status="On Hold"] {
  background: #fffbeb;
  border-color: rgba(245, 158, 11, 0.32);
  color: #b45309;
}#roadmapModal .roadmap-task-card__status[data-status="Done"] {
  background: #ecfdf5;
  border-color: rgba(16, 185, 129, 0.3);
  color: #047857;
}#roadmapModal .roadmap-task-card__status[data-status="Cancelled"] {
  background: #fef2f2;
  border-color: rgba(239, 68, 68, 0.28);
  color: #b91c1c;
}#roadmapModal .roadmap-raci-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}#roadmapModal .roadmap-raci-list {
  display: flex;
  flex-direction: column;
}#roadmapModal .roadmap-raci-row-header {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) 52px 34px;
  gap: 0.4rem;
  padding: 0.15rem 0.55rem 0.35rem;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #a16207;
}#roadmapModal .roadmap-raci-row {
  display: flex;
  gap: 0.55rem;
  align-items: stretch;
  padding: 0.55rem 0.65rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.08);
}#roadmapModal .roadmap-raci-row:last-child {
  border-bottom: none;
}#roadmapModal .roadmap-raci-row__fields {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 0.45rem;
  flex: 1 1 auto;
  min-width: 0;
}#roadmapModal .roadmap-raci-row input,
#roadmapModal .roadmap-raci-row select {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.875rem;
  min-height: var(--roadmap-field-min-height);
  padding: var(--roadmap-field-pad-block) var(--roadmap-field-pad-inline);
}#roadmapModal .roadmap-raci-remove-btn {
  flex-shrink: 0;
  padding: 0;
  width: 34px;
  min-height: 38px;
  border-radius: 8px;
  border: 1px solid rgba(202, 138, 4, 0.22);
  background: #fffdf8;
  color: #a16207;
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}#roadmapModal .roadmap-raci-remove-btn:hover {
  background: #fee2e2;
  border-color: #dc2626;
  color: #dc2626;
}#roadmapModal .roadmap-raci-card {
  display: flex;
  align-items: center;
  gap: 0.68rem;
  padding: 0.62rem 0.9rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  transition: background-color 0.16s ease;
}#roadmapModal .roadmap-raci-card:last-child {
  border-bottom: none;
}#roadmapModal .roadmap-raci-card:hover {
  background: rgba(248, 250, 252, 0.95);
}#roadmapModal .roadmap-raci-card__avatar {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  background: linear-gradient(145deg, #fff7ed 0%, #ffedd5 100%);
  color: #9a3412;
  border: 1px solid rgba(234, 88, 12, 0.18);
  box-shadow: 0 1px 2px rgba(120, 53, 15, 0.08);
}#roadmapModal .roadmap-raci-card__body {
  flex: 1 1 auto;
  min-width: 0;
}#roadmapModal .roadmap-raci-card__name {
  display: block;
  font-size: 0.86rem;
  font-weight: 600;
  color: #1c1917;
  line-height: 1.4;
  word-break: break-word;
}#roadmapModal .roadmap-raci-card__domain {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.58rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.25;
  background: #eff6ff;
  border: 1px solid rgba(59, 130, 246, 0.24);
  color: #1d4ed8;
}#roadmapModal .roadmap-raci-card__domain[data-domain="Tech"] {
  background: #f5f3ff;
  border-color: rgba(139, 92, 246, 0.24);
  color: #6d28d9;
}#roadmapModal.roadmap-modal--view .roadmap-meta-dynamic-field > label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.42rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #57534e;
}#roadmapModal.roadmap-modal--view .roadmap-raci-group[data-raci-role] > .roadmap-field-tooltip-wrap > label::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 6px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}#roadmapModal.roadmap-modal--view .roadmap-raci-group[data-raci-role="responsible"] > .roadmap-field-tooltip-wrap > label::before {
  content: "R";
  background: #ecfdf5;
  color: #047857;
  border: 1px solid rgba(16, 185, 129, 0.28);
}#roadmapModal.roadmap-modal--view .roadmap-raci-group[data-raci-role="accountable"] > .roadmap-field-tooltip-wrap > label::before {
  content: "A";
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid rgba(239, 68, 68, 0.24);
}#roadmapModal.roadmap-modal--view .roadmap-raci-group[data-raci-role="consulted"] > .roadmap-field-tooltip-wrap > label::before {
  content: "C";
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid rgba(59, 130, 246, 0.24);
}#roadmapModal.roadmap-modal--view .roadmap-raci-group[data-raci-role="informed"] > .roadmap-field-tooltip-wrap > label::before {
  content: "I";
  background: #f5f5f4;
  color: #57534e;
  border: 1px solid rgba(168, 162, 158, 0.35);
}#roadmapModal.roadmap-modal--view .roadmap-dynamic-field-panel {
  background: #fff;
  border: 1px solid rgba(202, 138, 4, 0.14);
  border-radius: 12px;
  padding: 0;
  min-height: 0;
  box-shadow: 0 1px 3px rgba(120, 53, 15, 0.06);
  overflow: hidden;
}#roadmapModal.roadmap-modal--view .roadmap-raci-group {
  padding-bottom: 0.15rem;
}#roadmapModal .roadmap-tasks-collapsible-wrap {
  margin-top: 0.55rem;
}#roadmapModal .roadmap-tasks-disclosure {
  border: 1px solid rgba(202, 138, 4, 0.16);
  border-radius: 12px;
  background: #fffefb;
  box-shadow: none;
  overflow: visible;
}#roadmapModal .roadmap-tasks-disclosure-summary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0.72rem 0.85rem 0.78rem;
  cursor: pointer;
  list-style: none;
}#roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-tasks-disclosure-summary {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding: 0.58rem 0.62rem;
  overflow: hidden;
}#roadmapModal .roadmap-tasks-disclosure-summary::-webkit-details-marker {
  display: none;
}#roadmapModal .roadmap-tasks-disclosure-summary:hover {
  background: rgba(255, 251, 245, 0.92);
}#roadmapModal .roadmap-tasks-disclosure-summary:focus-visible {
  outline: 2px solid rgba(220, 38, 38, 0.45);
  outline-offset: 2px;
}#roadmapModal .roadmap-tasks-summary-row {
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}#roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-tasks-summary-row {
  flex: 1 1 auto;
  width: auto;
}#roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-optional-field-summary-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-tasks-summary-lead {
  display: none;
}#roadmapModal .roadmap-tasks-summary-lead::before {
  content: "☑";
  font-size: 0.72rem;
  line-height: 1;
  color: #b45309;
}#roadmapModal .roadmap-tasks-disclosure:not(.is-open) .roadmap-tasks-summary-subtitle {
  display: none;
}#roadmapModal .roadmap-tasks-summary-count {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.52rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #92400e;
  background: #fff7ed;
  border: 1px solid rgba(234, 88, 12, 0.22);
}#roadmapModal .roadmap-tasks-progress {
  margin-top: 0.62rem;
  display: flex;
  flex-direction: column;
  gap: 0.48rem;
}#roadmapModal .roadmap-tasks-progress-bar {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  height: 0.5rem;
  min-height: 0.5rem;
  border-radius: 999px;
  overflow: visible;
  background: #f5f5f4;
  border: 1px solid rgba(168, 162, 158, 0.28);
  box-shadow: inset 0 1px 2px rgba(28, 25, 23, 0.05);
  margin-bottom: 0.15rem;
}#roadmapModal .roadmap-tasks-progress-segment:first-child {
  border-radius: 999px 0 0 999px;
}#roadmapModal .roadmap-tasks-progress-segment:last-child {
  border-radius: 0 999px 999px 0;
}#roadmapModal .roadmap-tasks-progress-segment:only-child {
  border-radius: 999px;
}#roadmapModal .roadmap-tasks-progress-segment {
  display: block;
  flex: 0 0 auto;
  flex-shrink: 0;
  min-width: 2px;
  height: 100%;
  align-self: stretch;
  position: relative;
  cursor: help;
  transition: flex-basis 0.22s ease, width 0.22s ease, filter 0.15s ease;
}#roadmapModal .roadmap-tasks-progress-segment:hover,
#roadmapModal .roadmap-tasks-progress-segment:focus-visible {
  filter: brightness(1.08);
  z-index: 2;
}#roadmapModal .roadmap-tasks-progress-segment:focus-visible {
  outline: 2px solid rgba(67, 20, 7, 0.45);
  outline-offset: 1px;
}#roadmapModal .roadmap-tasks-progress-segment-tooltip {
  position: absolute;
  left: 50%;
  top: calc(100% + 0.45rem);
  transform: translateX(-50%) translateY(-0.15rem);
  min-width: max-content;
  max-width: 11rem;
  padding: 0.38rem 0.52rem;
  border-radius: 8px;
  background: rgba(28, 25, 23, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.28);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.14s ease, transform 0.14s ease, visibility 0.14s ease;
  z-index: 8;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  text-align: center;
  font-family: var(--app-font-family);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}#roadmapModal .roadmap-tasks-progress-segment-tooltip::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-bottom-color: rgba(28, 25, 23, 0.96);
}#roadmapModal .roadmap-tasks-progress-bar:has(.roadmap-tasks-progress-segment:hover) .roadmap-tasks-progress-segment:not(:hover) .roadmap-tasks-progress-segment-tooltip,
#roadmapModal .roadmap-tasks-progress-bar:has(.roadmap-tasks-progress-segment:focus-within) .roadmap-tasks-progress-segment:not(:focus-within) .roadmap-tasks-progress-segment-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}#roadmapModal .roadmap-tasks-progress-segment:hover .roadmap-tasks-progress-segment-tooltip,
#roadmapModal .roadmap-tasks-progress-segment:focus-visible .roadmap-tasks-progress-segment-tooltip,
#roadmapModal .roadmap-tasks-progress-segment:focus-within .roadmap-tasks-progress-segment-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}body:has(.cell-type-tooltip.cell-type-tooltip-visible) #roadmapModal .roadmap-tasks-progress-segment-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}#roadmapModal .roadmap-tasks-progress-segment-tooltip-title {
  display: block;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #fde68a;
  line-height: 1.2;
}#roadmapModal .roadmap-tasks-progress-segment-tooltip-body {
  display: block;
  font-size: 0.72rem;
  font-weight: 650;
  color: #fafaf9;
  line-height: 1.3;
  white-space: nowrap;
}#roadmapModal .roadmap-tasks-progress-segment[data-status="Not Started"] {
  background: linear-gradient(180deg, #d6d3d1 0%, #a8a29e 100%);
}#roadmapModal .roadmap-tasks-progress-segment[data-status="In Progress"] {
  background: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);
}#roadmapModal .roadmap-tasks-progress-segment[data-status="On Hold"] {
  background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);
}#roadmapModal .roadmap-tasks-progress-segment[data-status="Done"] {
  background: linear-gradient(180deg, #34d399 0%, #10b981 100%);
}#roadmapModal .roadmap-tasks-progress-segment[data-status="Cancelled"] {
  background: linear-gradient(180deg, #f87171 0%, #ef4444 100%);
}#roadmapModal .roadmap-tasks-progress-legend {
  display: grid;
  width: 100%;
  gap: 0.2rem 0.35rem;
  align-items: center;
}#roadmapModal .roadmap-tasks-progress-legend-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.28rem;
  min-width: 0;
  font-size: clamp(0.58rem, 1.45vw, 0.68rem);
  line-height: 1.2;
  color: #57534e;
  white-space: nowrap;
}#roadmapModal .roadmap-tasks-progress-legend-copy {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}#roadmapModal .roadmap-tasks-progress-legend-item strong {
  font-weight: 800;
  color: #292524;
}#roadmapModal .roadmap-tasks-progress-legend-dot {
  width: 0.46rem;
  height: 0.46rem;
  border-radius: 50%;
  flex-shrink: 0;
  background: #d6d3d1;
}#roadmapModal .roadmap-tasks-progress-legend-item[data-status="Not Started"] .roadmap-tasks-progress-legend-dot {
  background: #a8a29e;
}#roadmapModal .roadmap-tasks-progress-legend-item[data-status="In Progress"] .roadmap-tasks-progress-legend-dot {
  background: #3b82f6;
}#roadmapModal .roadmap-tasks-progress-legend-item[data-status="On Hold"] .roadmap-tasks-progress-legend-dot {
  background: #f59e0b;
}#roadmapModal .roadmap-tasks-progress-legend-item[data-status="Done"] .roadmap-tasks-progress-legend-dot {
  background: #10b981;
}#roadmapModal .roadmap-tasks-progress-legend-item[data-status="Cancelled"] .roadmap-tasks-progress-legend-dot {
  background: #ef4444;
}#roadmapModal .roadmap-tasks-disclosure-body {
  padding: 0 var(--roadmap-inner-pad) var(--roadmap-inner-pad);
  border-top: 1px solid rgba(202, 138, 4, 0.1);
}#roadmapModal .roadmap-tasks-disclosure-body .roadmap-dynamic-field-panel {
  background: #fff;
  border-color: rgba(202, 138, 4, 0.14);
  margin-top: 0.55rem;
}#roadmapModal .roadmap-countries-collapsible-wrap {
  margin-top: 0.55rem;
}#roadmapModal .roadmap-countries-disclosure {
  border: 1px solid rgba(202, 138, 4, 0.16);
  border-radius: 12px;
  background: #fffefb;
  box-shadow: none;
  overflow: visible;
}#roadmapModal .roadmap-countries-disclosure-summary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0.72rem 0.85rem 0.78rem;
  cursor: pointer;
  list-style: none;
}#roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-countries-disclosure-summary {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding: 0.58rem 0.62rem;
  overflow: hidden;
}#roadmapModal .roadmap-countries-disclosure-summary:hover {
  background: rgba(255, 251, 245, 0.92);
}#roadmapModal .roadmap-countries-disclosure-summary:focus-visible {
  outline: 2px solid rgba(220, 38, 38, 0.45);
  outline-offset: 2px;
}#roadmapModal .roadmap-countries-summary-row {
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}#roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-countries-summary-row {
  flex: 1 1 auto;
  width: auto;
}#roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-optional-field-summary-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-countries-summary-lead {
  display: none;
}#roadmapModal .roadmap-countries-summary-lead::before {
  content: "🌍";
  font-size: 0.72rem;
  line-height: 1;
}#roadmapModal .roadmap-countries-disclosure:not(.is-open) .roadmap-countries-summary-subtitle {
  display: none;
}#roadmapModal .roadmap-dynamic-summary-count,
#roadmapModal .roadmap-countries-summary-count {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.18rem 0.52rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #92400e;
  background: #fff7ed;
  border: 1px solid rgba(234, 88, 12, 0.22);
}#roadmapModal .roadmap-countries-disclosure-body {
  padding: 0 var(--roadmap-inner-pad) var(--roadmap-inner-pad);
  border-top: 1px solid rgba(202, 138, 4, 0.1);
}#roadmapModal .roadmap-countries-disclosure-body .roadmap-dynamic-field-hint {
  margin-top: 0.55rem;
}#roadmapModal .roadmap-countries-disclosure-body .roadmap-dynamic-field-panel {
  background: #fff;
  border-color: rgba(202, 138, 4, 0.14);
  margin-top: 0.55rem;
}#roadmapModal .roadmap-countries-disclosure-body .country-row {
  gap: 0.55rem;
  padding: 0.55rem 0.65rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.08);
}#roadmapModal .roadmap-countries-disclosure-body .country-row:last-child {
  border-bottom: none;
}#roadmapModal.roadmap-modal--view .roadmap-tasks-disclosure.is-open .roadmap-tasks-progress {
  display: none !important;
}#roadmapModal .roadmap-tasks-disclosure--progress-visible:not(.is-open) .roadmap-tasks-summary-subtitle,
#roadmapModal .roadmap-tasks-disclosure--progress-visible.is-open .roadmap-tasks-summary-subtitle {
  display: none;
}/* KANO model — axis controls,
heatmap matrix,
legend */
#roadmapModal .roadmap-kano-axis-selects {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 0.85rem;
  margin-bottom: 0.65rem;
}#roadmapModal .roadmap-kano-axis-card {
  padding: var(--roadmap-inner-pad) calc(var(--roadmap-inner-pad) + 0.05rem) calc(var(--roadmap-inner-pad) + 0.08rem);
  border-radius: 14px;
  border: 1px solid rgba(202, 138, 4, 0.18);
  background: linear-gradient(180deg, #ffffff 0%, #fffbf5 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95) inset;
}#roadmapModal .roadmap-kano-axis-card label {
  font-size: 0.78rem;
  font-weight: 650;
  color: #78350f;
}#roadmapModal .roadmap-kano-axis-select {
  width: 100%;
  min-height: 42px;
  font-weight: 600;
}#roadmapModal .roadmap-kano-axis-meter {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.32rem;
  margin-top: 0.55rem;
}#roadmapModal .roadmap-kano-axis-meter__dot {
  position: relative;
  height: 0.34rem;
  border-radius: 999px;
  background: rgba(202, 138, 4, 0.12);
  transition: background 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
}#roadmapModal .roadmap-kano-axis-meter__dot.is-active {
  background: linear-gradient(90deg, #c2410c, #b91c1c);
  transform: scaleY(1.45);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.65);
}#roadmapModal .roadmap-kano-axis-meter__dot.is-dimmed {
  opacity: 0.38;
}#roadmapModal .roadmap-kano-field-wrap {
  margin-top: 0.1rem;
  padding: 0;
  border: none;
  background: transparent;
}#roadmapModal .roadmap-kano-panel {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
  overflow: visible;
  padding: 1rem 1rem 1.05rem;
  border-radius: 18px;
  border: 1px solid rgba(202, 138, 4, 0.16);
  background: linear-gradient(180deg, #ffffff 0%, #fffdf8 42%, #fff8ed 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 10px 28px rgba(120, 53, 15, 0.05);
}#roadmapModal .roadmap-kano-panel__header {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}#roadmapModal .roadmap-kano-panel__title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9a3412;
}#roadmapModal .roadmap-kano-panel__hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.5;
  color: #78716c;
}#roadmapModal .roadmap-kano-matrix-host {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.85rem 0.82rem 0.9rem;
  border-radius: 16px;
  border: 1px solid rgba(202, 138, 4, 0.12);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
  container-type: inline-size;
  container-name: kano-matrix;
}#roadmapModal .roadmap-kano-matrix-band {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.55rem;
  justify-content: space-between;
}#roadmapModal .roadmap-kano-matrix-band__item {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.24rem 0.62rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  color: #78716c;
  background: #fafaf9;
  border: 1px solid rgba(168, 162, 158, 0.28);
}#roadmapModal .roadmap-kano-matrix-band__item--y::before {
  content: "↑";
  color: #059669;
  font-weight: 800;
}#roadmapModal .roadmap-kano-matrix-band__item--x::after {
  content: "→";
  color: #2563eb;
  font-weight: 800;
}#roadmapModal .roadmap-kano-matrix-wrap {
  --kano-gap: 0.32rem;
  --kano-row-min: 4.35rem;
  display: grid;
  grid-template-columns: minmax(4.4rem, auto) repeat(5, minmax(0, 1fr));
  grid-template-rows: auto repeat(5, minmax(var(--kano-row-min), 1fr)) auto auto;
  gap: var(--kano-gap);
  column-gap: 0.55rem;
  align-items: stretch;
  min-width: 0;
  position: relative;
  padding: 0.65rem 0.55rem 0.75rem;
  border-radius: 14px;
  border: 1px solid rgba(202, 138, 4, 0.12);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}#roadmapModal .roadmap-kano-matrix-wrap::after {
  content: "";
  grid-column: 2 / -1;
  grid-row: 2 / 7;
  margin: calc(var(--kano-gap) * -0.5);
  border-radius: 14px;
  background: linear-gradient(180deg, #fafaf9 0%, #f5f5f4 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  pointer-events: none;
  z-index: 0;
}#roadmapModal .roadmap-kano-matrix-wrap:has(.roadmap-kano-matrix-grid:focus-visible) {
  outline: 2px solid rgba(180, 83, 9, 0.32);
  outline-offset: 3px;
  border-radius: 14px;
}#roadmapModal .roadmap-kano-matrix-corner {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-width: 0;
  padding: 0 0.08rem 0.08rem;
}#roadmapModal .roadmap-kano-axis-label--y[data-level="5"] {
  grid-column: 1;
  grid-row: 2;
}#roadmapModal .roadmap-kano-axis-label--y[data-level="4"] {
  grid-column: 1;
  grid-row: 3;
}#roadmapModal .roadmap-kano-axis-label--y[data-level="3"] {
  grid-column: 1;
  grid-row: 4;
}#roadmapModal .roadmap-kano-axis-label--y[data-level="2"] {
  grid-column: 1;
  grid-row: 5;
}#roadmapModal .roadmap-kano-axis-label--y[data-level="1"] {
  grid-column: 1;
  grid-row: 6;
}#roadmapModal .roadmap-kano-axis-label--x[data-level="1"] {
  grid-column: 2;
  grid-row: 7;
}#roadmapModal .roadmap-kano-axis-label--x[data-level="2"] {
  grid-column: 3;
  grid-row: 7;
}#roadmapModal .roadmap-kano-axis-label--x[data-level="3"] {
  grid-column: 4;
  grid-row: 7;
}#roadmapModal .roadmap-kano-axis-label--x[data-level="4"] {
  grid-column: 5;
  grid-row: 7;
}#roadmapModal .roadmap-kano-axis-label--x[data-level="5"] {
  grid-column: 6;
  grid-row: 7;
}#roadmapModal .roadmap-kano-axis-title {
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #57534e;
}#roadmapModal .roadmap-kano-axis-title--y {
  display: block;
  margin: 0;
  padding: 0 0 0.1rem;
  border-bottom: 1px solid rgba(202, 138, 4, 0.14);
  text-align: center;
  line-height: 1.25;
  width: 100%;
}#roadmapModal .roadmap-kano-axis-title__micro,
#roadmapModal .roadmap-kano-axis-label__micro {
  display: none;
}#roadmapModal .roadmap-kano-axis-title__full,
#roadmapModal .roadmap-kano-axis-label__full {
  display: block;
}#roadmapModal .roadmap-kano-axis-title--x {
  grid-column: 2 / -1;
  grid-row: 8;
  display: block;
  text-align: center;
  margin: 0;
  padding: 0.12rem 0 0;
  border-top: 1px solid rgba(202, 138, 4, 0.14);
  line-height: 1.25;
}#roadmapModal .roadmap-kano-axis-label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  z-index: 1;
  padding: 0.1rem 0.22rem 0.1rem 0;
  border-radius: 10px;
  font-size: 0.72rem;
  line-height: 1.2;
  font-weight: 600;
  color: #57534e;
  transition:
    color 0.14s ease,
    background 0.14s ease,
    box-shadow 0.14s ease;
}#roadmapModal .roadmap-kano-axis-label--y {
  justify-content: center;
  align-items: center;
  padding: 0.12rem 0.18rem;
  text-align: center;
}#roadmapModal .roadmap-kano-axis-label--y .roadmap-kano-axis-label__full {
  display: block;
  width: 100%;
  text-align: center;
}#roadmapModal .roadmap-kano-axis-label--x {
  justify-content: center;
  align-self: center;
  padding: 0.18rem 0.12rem 0;
  text-align: center;
}#roadmapModal .roadmap-kano-axis-label.is-active {
  color: #9a3412;
  font-weight: 750;
}#roadmapModal .roadmap-kano-axis-label--y.is-active {
  background: transparent;
  box-shadow: none;
}#roadmapModal .roadmap-kano-axis-label--y.is-active .roadmap-kano-axis-label__full {
  display: inline-block;
  padding: 0.2rem 0.48rem;
  border-radius: 8px;
  background: rgba(254, 243, 199, 0.72);
  box-shadow: inset 0 0 0 1px rgba(202, 138, 4, 0.18);
}#roadmapModal .roadmap-kano-axis-label--x.is-active {
  background: rgba(254, 243, 199, 0.72);
  box-shadow: inset 0 0 0 1px rgba(202, 138, 4, 0.18);
}#roadmapModal .roadmap-kano-matrix-grid {
  display: contents;
}#roadmapModal .roadmap-kano-matrix-grid:focus-visible {
  outline: none;
}#roadmapModal .roadmap-kano-matrix-x-axis {
  display: contents;
}#roadmapModal .roadmap-kano-matrix-cell {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  padding: 0.28rem 0.22rem;
  border-radius: 12px;
  border: 1px solid rgba(168, 162, 158, 0.28);
  cursor: pointer;
  overflow: hidden;
  background: #fafaf9;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease,
    filter 0.16s ease;
}#roadmapModal .roadmap-kano-matrix-cell--zone-attractive {
  background: linear-gradient(160deg, rgba(209, 250, 229, 0.95) 0%, rgba(236, 253, 245, 0.88) 100%);
  border-color: rgba(16, 185, 129, 0.28);
}#roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional {
  background: linear-gradient(160deg, rgba(219, 234, 254, 0.95) 0%, rgba(239, 246, 255, 0.88) 100%);
  border-color: rgba(59, 130, 246, 0.28);
}#roadmapModal .roadmap-kano-matrix-cell--zone-must-be {
  background: linear-gradient(160deg, rgba(254, 243, 199, 0.95) 0%, rgba(255, 251, 235, 0.88) 100%);
  border-color: rgba(245, 158, 11, 0.3);
}#roadmapModal .roadmap-kano-matrix-cell--zone-reverse {
  background: linear-gradient(160deg, rgba(255, 228, 230, 0.95) 0%, rgba(255, 241, 242, 0.88) 100%);
  border-color: rgba(244, 63, 94, 0.28);
}#roadmapModal .roadmap-kano-matrix-cell--zone-indifferent {
  background: linear-gradient(160deg, rgba(245, 245, 244, 0.98) 0%, rgba(250, 250, 249, 0.92) 100%);
  border-color: rgba(168, 162, 158, 0.32);
}#roadmapModal .roadmap-kano-matrix-cell__zone-tag {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  max-width: calc(100% - 0.35rem);
  padding: 0.12rem 0.2rem;
  text-align: center;
  pointer-events: none;
}#roadmapModal .roadmap-kano-matrix-cell.is-selected .roadmap-kano-matrix-cell__zone-tag {
  display: flex;
}#roadmapModal .roadmap-kano-matrix-cell__zone-label {
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.01em;
  color: #c2410c;
}#roadmapModal .roadmap-kano-matrix-cell__zone-hint {
  font-size: 0.76rem;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0.01em;
  color: #9a3412;
}#roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected .roadmap-kano-matrix-cell__zone-label {
  color: #047857;
}#roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected .roadmap-kano-matrix-cell__zone-hint {
  color: #059669;
}#roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected .roadmap-kano-matrix-cell__zone-label {
  color: #1d4ed8;
}#roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected .roadmap-kano-matrix-cell__zone-hint {
  color: #2563eb;
}#roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected .roadmap-kano-matrix-cell__zone-label {
  color: #b45309;
}#roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected .roadmap-kano-matrix-cell__zone-hint {
  color: #d97706;
}#roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected .roadmap-kano-matrix-cell__zone-label {
  color: #be123c;
}#roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected .roadmap-kano-matrix-cell__zone-hint {
  color: #e11d48;
}#roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected .roadmap-kano-matrix-cell__zone-label {
  color: #57534e;
}#roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected .roadmap-kano-matrix-cell__zone-hint {
  color: #78716c;
}#roadmapModal .roadmap-kano-matrix-cell__coords {
  display: none;
}#roadmapModal .roadmap-kano-matrix-cell__glyph {
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  pointer-events: none;
}#roadmapModal .roadmap-kano-matrix-cell__code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.1rem;
  padding: 0.2rem 0.34rem;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 2px 6px rgba(28, 25, 23, 0.08);
  line-height: 1;
  white-space: nowrap;
}#roadmapModal .roadmap-kano-matrix-cell__code-cat {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #44403c;
}#roadmapModal .roadmap-kano-matrix-cell__code-sep {
  font-size: 0.58rem;
  font-weight: 600;
  color: rgba(120, 113, 108, 0.68);
  margin: 0 0.02rem;
}#roadmapModal .roadmap-kano-matrix-cell__code-hint {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #78716c;
}#roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected .roadmap-kano-matrix-cell__code-cat {
  color: #047857;
}#roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected .roadmap-kano-matrix-cell__code-hint {
  color: #059669;
}#roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected .roadmap-kano-matrix-cell__code-cat {
  color: #1d4ed8;
}#roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected .roadmap-kano-matrix-cell__code-hint {
  color: #2563eb;
}#roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected .roadmap-kano-matrix-cell__code-cat {
  color: #b45309;
}#roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected .roadmap-kano-matrix-cell__code-hint {
  color: #d97706;
}#roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected .roadmap-kano-matrix-cell__code-cat {
  color: #be123c;
}#roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected .roadmap-kano-matrix-cell__code-hint {
  color: #e11d48;
}#roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected .roadmap-kano-matrix-cell__code-cat {
  color: #57534e;
}#roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected .roadmap-kano-matrix-cell__code-hint {
  color: #78716c;
}#roadmapModal .roadmap-kano-matrix-cell__marker {
  position: absolute;
  top: 0.28rem;
  right: 0.28rem;
  width: 0.72rem;
  height: 0.72rem;
  border-radius: 999px;
  background: transparent;
  border: 2px solid transparent;
  transform: scale(0.4);
  opacity: 0;
  transition: opacity 0.16s ease, transform 0.16s ease;
}#roadmapModal .roadmap-kano-matrix-cell__tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 0.4rem);
  transform: translateX(-50%) translateY(4px);
  padding: 0.24rem 0.55rem;
  border-radius: 999px;
  background: rgba(28, 25, 23, 0.94);
  color: #fafaf9;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.14s ease, transform 0.14s ease;
  z-index: 5;
  box-shadow: 0 8px 18px rgba(28, 25, 23, 0.18);
}#roadmapModal .roadmap-kano-matrix-cell.is-preview .roadmap-kano-matrix-cell__tip,
#roadmapModal .roadmap-kano-matrix-cell:focus-visible .roadmap-kano-matrix-cell__tip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}#roadmapModal .roadmap-kano-matrix-cell.is-crosshair-row,
#roadmapModal .roadmap-kano-matrix-cell.is-crosshair-col {
  box-shadow: inset 0 0 0 1px rgba(180, 83, 9, 0.16);
}#roadmapModal .roadmap-kano-matrix-cell.is-crosshair-hover {
  filter: saturate(1.04);
  z-index: 1;
}#roadmapModal .roadmap-kano-matrix-cell:hover:not(.is-readonly):not(.is-selected) {
  border-color: rgba(180, 83, 9, 0.42);
  box-shadow: 0 6px 16px rgba(120, 53, 15, 0.08);
  transform: translateY(-1px);
}#roadmapModal .roadmap-kano-matrix-cell:focus-visible {
  outline: 2px solid rgba(180, 83, 9, 0.45);
  outline-offset: 1px;
  z-index: 2;
}#roadmapModal .roadmap-kano-matrix-cell.is-selected {
  border-color: rgba(180, 83, 9, 0.72);
  box-shadow:
    0 0 0 2px rgba(251, 191, 36, 0.34),
    0 10px 22px rgba(120, 53, 15, 0.12);
  transform: translateY(-1px);
  z-index: 3;
  gap: 0;
  justify-content: center;
}#roadmapModal .roadmap-kano-matrix-cell.is-selected .roadmap-kano-matrix-cell__marker {
  display: none;
}#roadmapModal .roadmap-kano-matrix-host--readonly .roadmap-kano-matrix-cell,
#roadmapModal .roadmap-kano-matrix-cell.is-readonly {
  cursor: default;
  pointer-events: none;
}/* Compact matrix only when the panel is genuinely narrow */
@container kano-matrix (max-width: 580px) {
  #roadmapModal .roadmap-kano-panel__hint {
    font-size: 0.76rem;
    line-height: 1.45;
  }

  #roadmapModal .roadmap-kano-matrix-host {
    padding: 0.62rem 0.5rem 0.68rem;
    overflow: visible;
    gap: 0.42rem;
  }

  #roadmapModal .roadmap-kano-matrix-band {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.28rem;
  }

  #roadmapModal .roadmap-kano-matrix-band__item {
    justify-content: center;
    padding: 0.28rem 0.42rem;
    font-size: 0.62rem;
    text-align: center;
  }

  #roadmapModal .roadmap-kano-matrix-wrap {
    --kano-gap: 0.18rem;
    --kano-row-min: 0;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(1.65rem, auto) repeat(5, minmax(0, 1fr));
    column-gap: 0.28rem;
  }

  #roadmapModal .roadmap-kano-matrix-wrap::after {
    border-radius: 12px;
    margin: calc(var(--kano-gap) * -0.35);
  }

  #roadmapModal .roadmap-kano-matrix-corner {
    align-items: center;
    justify-content: center;
    padding: 0;
  }

  #roadmapModal .roadmap-kano-axis-title--y {
    border-bottom: none;
    text-align: center;
    padding: 0;
  }

  #roadmapModal .roadmap-kano-axis-title--x {
    border-top: none;
    padding: 0.08rem 0 0;
    font-size: 0.58rem;
  }

  #roadmapModal .roadmap-kano-axis-title__full,
  #roadmapModal .roadmap-kano-axis-label__full {
    display: none;
  }

  #roadmapModal .roadmap-kano-axis-title__micro,
  #roadmapModal .roadmap-kano-axis-label__micro {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #roadmapModal .roadmap-kano-axis-title__micro {
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #78716c;
  }

  #roadmapModal .roadmap-kano-axis-label__micro {
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 750;
    color: #57534e;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 0 0 1px rgba(202, 138, 4, 0.12);
  }

  #roadmapModal .roadmap-kano-axis-label--y {
    justify-content: center;
    padding: 0;
  }

  #roadmapModal .roadmap-kano-axis-label--x {
    padding: 0.12rem 0 0;
  }

  #roadmapModal .roadmap-kano-axis-label.is-active .roadmap-kano-axis-label__micro {
    color: #9a3412;
    background: rgba(254, 243, 199, 0.92);
    box-shadow:
      inset 0 0 0 1px rgba(202, 138, 4, 0.24),
      0 2px 6px rgba(180, 83, 9, 0.1);
  }

  #roadmapModal .roadmap-kano-matrix-cell {
    aspect-ratio: 1;
    min-height: 0;
    padding: 0.1rem;
    border-radius: 11px;
    border-width: 1.5px;
    overflow: visible;
    gap: 0;
    justify-content: center;
    transition:
      border-color 0.18s ease,
      box-shadow 0.18s ease,
      transform 0.18s ease,
      filter 0.18s ease;
  }

  #roadmapModal .roadmap-kano-matrix-cell__zone-tag,
  #roadmapModal .roadmap-kano-matrix-cell__coords,
  #roadmapModal .roadmap-kano-matrix-cell__tip,
  #roadmapModal .roadmap-kano-matrix-cell__marker {
    display: none !important;
  }

  #roadmapModal .roadmap-kano-matrix-cell__glyph {
    display: none;
    width: 100%;
    height: 100%;
    padding: 0.08rem;
  }

  #roadmapModal .roadmap-kano-matrix-cell__code {
    width: 100%;
    min-height: 100%;
    padding: 0.2rem 0.14rem;
    border-radius: 8px;
    gap: 0.12rem;
    flex-direction: row;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.82);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.98),
      0 1px 4px rgba(28, 25, 23, 0.06);
  }

  #roadmapModal .roadmap-kano-matrix-cell__code-cat,
  #roadmapModal .roadmap-kano-matrix-cell__code-hint {
    font-size: clamp(0.58rem, 2.8vw, 0.7rem);
    letter-spacing: 0.05em;
  }

  #roadmapModal .roadmap-kano-matrix-cell__code-sep {
    font-size: clamp(0.46rem, 2vw, 0.54rem);
    font-weight: 500;
    color: rgba(120, 113, 108, 0.45);
    margin: 0;
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-selected {
    transform: none;
    z-index: 4;
    border-width: 2px;
    filter: none;
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected {
    border-color: rgba(16, 185, 129, 0.62);
    box-shadow:
      0 0 0 3px rgba(16, 185, 129, 0.12),
      0 6px 14px rgba(16, 185, 129, 0.12);
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected {
    border-color: rgba(59, 130, 246, 0.62);
    box-shadow:
      0 0 0 3px rgba(59, 130, 246, 0.12),
      0 6px 14px rgba(59, 130, 246, 0.12);
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected {
    border-color: rgba(245, 158, 11, 0.68);
    box-shadow:
      0 0 0 3px rgba(245, 158, 11, 0.14),
      0 6px 14px rgba(245, 158, 11, 0.12);
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected {
    border-color: rgba(244, 63, 94, 0.62);
    box-shadow:
      0 0 0 3px rgba(244, 63, 94, 0.12),
      0 6px 14px rgba(244, 63, 94, 0.12);
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected {
    border-color: rgba(120, 113, 108, 0.58);
    box-shadow:
      0 0 0 3px rgba(168, 162, 158, 0.16),
      0 6px 14px rgba(28, 25, 23, 0.08);
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-selected .roadmap-kano-matrix-cell__glyph {
    display: flex;
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-selected .roadmap-kano-matrix-cell__code {
    background: rgba(255, 255, 255, 0.98);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 1),
      0 2px 6px rgba(28, 25, 23, 0.08);
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-attractive.is-selected .roadmap-kano-matrix-cell__code {
    border-color: rgba(16, 185, 129, 0.18);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(236, 253, 245, 0.94));
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-one-dimensional.is-selected .roadmap-kano-matrix-cell__code {
    border-color: rgba(59, 130, 246, 0.18);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(239, 246, 255, 0.94));
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-must-be.is-selected .roadmap-kano-matrix-cell__code {
    border-color: rgba(245, 158, 11, 0.2);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(255, 251, 235, 0.94));
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-reverse.is-selected .roadmap-kano-matrix-cell__code {
    border-color: rgba(244, 63, 94, 0.18);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(255, 241, 242, 0.94));
  }

  #roadmapModal .roadmap-kano-matrix-cell--zone-indifferent.is-selected .roadmap-kano-matrix-cell__code {
    border-color: rgba(168, 162, 158, 0.22);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(250, 250, 249, 0.96));
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-crosshair-row:not(.is-selected),
  #roadmapModal .roadmap-kano-matrix-cell.is-crosshair-col:not(.is-selected) {
    box-shadow: inset 0 0 0 1px rgba(180, 83, 9, 0.12);
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-crosshair-hover:not(.is-selected) {
    transform: none;
    filter: saturate(1.06);
  }

  #roadmapModal .roadmap-kano-matrix-cell:hover:not(.is-readonly):not(.is-selected) {
    transform: none;
    filter: saturate(1.04);
    box-shadow: 0 3px 10px rgba(28, 25, 23, 0.06);
  }
}/* Fallback for browsers without container queries */
@media (max-width: 768px) {
  #roadmapModal .roadmap-kano-axis-title__full,
  #roadmapModal .roadmap-kano-axis-label__full {
    display: none;
  }

  #roadmapModal .roadmap-kano-axis-title__micro,
  #roadmapModal .roadmap-kano-axis-label__micro {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #roadmapModal .roadmap-kano-matrix-cell__zone-tag,
  #roadmapModal .roadmap-kano-matrix-cell__coords,
  #roadmapModal .roadmap-kano-matrix-cell__tip,
  #roadmapModal .roadmap-kano-matrix-cell__marker {
    display: none !important;
  }

  #roadmapModal .roadmap-kano-matrix-cell {
    aspect-ratio: 1;
    overflow: visible;
    padding: 0.1rem;
    justify-content: center;
    border-radius: 11px;
    border-width: 1.5px;
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-selected .roadmap-kano-matrix-cell__glyph {
    display: flex;
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-selected {
    transform: none;
    border-width: 2px;
  }

  #roadmapModal .roadmap-kano-matrix-cell__code-cat,
  #roadmapModal .roadmap-kano-matrix-cell__code-hint {
    font-size: clamp(0.58rem, 2.8vw, 0.7rem);
  }

  #roadmapModal .roadmap-kano-matrix-cell.is-crosshair-hover:not(.is-selected),
  #roadmapModal .roadmap-kano-matrix-cell:hover:not(.is-readonly):not(.is-selected) {
    transform: none;
  }

  #roadmapModal .roadmap-kano-matrix-wrap {
    --kano-gap: 0.18rem;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(1.65rem, auto) repeat(5, minmax(0, 1fr));
  }
}#roadmapModal .roadmap-kano-legend-shell {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-width: 0;
  padding: 0.38rem;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(255, 248, 237, 0.94) 100%);
  border: 1px solid rgba(202, 138, 4, 0.14);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 2px 8px rgba(120, 53, 15, 0.04);
}#roadmapModal .roadmap-kano-legend {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.34rem;
  min-width: 0;
  overflow: visible;
  padding: 0;
}#roadmapModal .roadmap-kano-legend__item {
  cursor: pointer;
  user-select: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 0.4rem;
  flex: 1 1 0;
  min-width: 0;
  padding: 0.46rem 0.5rem 0.46rem 0.44rem;
  border-radius: 999px;
  border: 1px solid rgba(202, 138, 4, 0.18);
  background: #ffffff;
  color: #44403c;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 1px 3px rgba(120, 53, 15, 0.05);
  transition:
    border-color 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}#roadmapModal .roadmap-kano-legend__item:hover {
  background: #fffdf8;
  border-color: rgba(180, 83, 9, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 4px 12px rgba(120, 53, 15, 0.07);
  transform: translateY(-1px);
  color: #292524;
}#roadmapModal .roadmap-kano-legend__item:active {
  transform: translateY(0);
  box-shadow: inset 0 1px 2px rgba(120, 53, 15, 0.06);
}#roadmapModal .roadmap-kano-legend__item:focus-visible {
  outline: 2px solid rgba(180, 83, 9, 0.4);
  outline-offset: 2px;
}#roadmapModal .roadmap-kano-legend__item--attractive,
#roadmapModal .roadmap-kano-legend__item--one-dimensional,
#roadmapModal .roadmap-kano-legend__item--must-be,
#roadmapModal .roadmap-kano-legend__item--reverse,
#roadmapModal .roadmap-kano-legend__item--indifferent {
  border-left: none;
}#roadmapModal .roadmap-kano-legend__swatch-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: inset 0 0 0 1px rgba(168, 162, 158, 0.14);
}#roadmapModal .roadmap-kano-legend__item--attractive .roadmap-kano-legend__swatch-wrap {
  background: rgba(236, 253, 245, 0.95);
  box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.22);
}#roadmapModal .roadmap-kano-legend__item--one-dimensional .roadmap-kano-legend__swatch-wrap {
  background: rgba(239, 246, 255, 0.95);
  box-shadow: inset 0 0 0 1px rgba(59, 130, 246, 0.22);
}#roadmapModal .roadmap-kano-legend__item--must-be .roadmap-kano-legend__swatch-wrap {
  background: rgba(255, 251, 235, 0.95);
  box-shadow: inset 0 0 0 1px rgba(245, 158, 11, 0.24);
}#roadmapModal .roadmap-kano-legend__item--reverse .roadmap-kano-legend__swatch-wrap {
  background: rgba(255, 241, 242, 0.95);
  box-shadow: inset 0 0 0 1px rgba(244, 63, 94, 0.22);
}#roadmapModal .roadmap-kano-legend__item--indifferent .roadmap-kano-legend__swatch-wrap {
  background: rgba(250, 250, 249, 0.98);
  box-shadow: inset 0 0 0 1px rgba(168, 162, 158, 0.22);
}#roadmapModal .roadmap-kano-legend__chevron {
  display: block;
  flex-shrink: 0;
  width: 0.55rem;
  height: 0.55rem;
  margin-left: auto;
  opacity: 0.55;
  background-color: #78716c;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='black' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform 0.18s ease, opacity 0.18s ease;
}#roadmapModal .roadmap-kano-legend-detail {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  margin-top: 0;
  min-width: 0;
  transition:
    grid-template-rows 0.32s ease,
    opacity 0.24s ease,
    margin-top 0.24s ease;
}#roadmapModal .roadmap-kano-legend-detail.is-visible {
  grid-template-rows: 1fr;
  opacity: 1;
  margin-top: 0.2rem;
}#roadmapModal .roadmap-kano-legend-detail__inner {
  min-height: 0;
  overflow: hidden;
  padding: 0.68rem 0.75rem 0.75rem;
  border-radius: 12px;
  border: 1px solid rgba(202, 138, 4, 0.14);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 251, 245, 0.94) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}#roadmapModal .roadmap-kano-legend-detail.is-visible .roadmap-kano-legend-detail__inner {
  overflow: visible;
}#roadmapModal .roadmap-kano-legend-detail__header {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.42rem;
}#roadmapModal .roadmap-kano-legend-detail__swatch {
  width: 0.68rem;
  height: 0.68rem;
  margin-top: 0.12rem;
  border-radius: 999px;
  flex-shrink: 0;
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.1);
}#roadmapModal .roadmap-kano-legend-detail--attractive .roadmap-kano-legend-detail__swatch {
  background: #10b981;
}#roadmapModal .roadmap-kano-legend-detail--one-dimensional .roadmap-kano-legend-detail__swatch {
  background: #3b82f6;
}#roadmapModal .roadmap-kano-legend-detail--must-be .roadmap-kano-legend-detail__swatch {
  background: #f59e0b;
}#roadmapModal .roadmap-kano-legend-detail--reverse .roadmap-kano-legend-detail__swatch {
  background: #f43f5e;
}#roadmapModal .roadmap-kano-legend-detail--indifferent .roadmap-kano-legend-detail__swatch {
  background: #a8a29e;
}#roadmapModal .roadmap-kano-legend-detail__heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.22rem 0.35rem;
  min-width: 0;
}#roadmapModal .roadmap-kano-legend-detail__title {
  font-size: 0.82rem;
  font-weight: 750;
  color: #292524;
  line-height: 1.3;
}#roadmapModal .roadmap-kano-legend-detail__hint {
  font-size: 0.72rem;
  font-weight: 650;
  color: #78716c;
  line-height: 1.3;
}#roadmapModal .roadmap-kano-legend-detail__hint::before {
  content: "·";
  margin-right: 0.28rem;
  color: #d6d3d1;
}#roadmapModal .roadmap-kano-legend-detail__text {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.62;
  color: #57534e;
  overflow-wrap: anywhere;
  word-break: break-word;
}#roadmapModal .roadmap-kano-legend-detail--attractive .roadmap-kano-legend-detail__inner {
  border-color: rgba(16, 185, 129, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(236, 253, 245, 0.72) 100%);
}#roadmapModal .roadmap-kano-legend-detail--one-dimensional .roadmap-kano-legend-detail__inner {
  border-color: rgba(59, 130, 246, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(239, 246, 255, 0.72) 100%);
}#roadmapModal .roadmap-kano-legend-detail--must-be .roadmap-kano-legend-detail__inner {
  border-color: rgba(245, 158, 11, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 251, 235, 0.72) 100%);
}#roadmapModal .roadmap-kano-legend-detail--reverse .roadmap-kano-legend-detail__inner {
  border-color: rgba(244, 63, 94, 0.22);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 241, 242, 0.72) 100%);
}#roadmapModal .roadmap-kano-legend-detail--indifferent .roadmap-kano-legend-detail__inner {
  border-color: rgba(168, 162, 158, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(250, 250, 249, 0.82) 100%);
}#roadmapModal .roadmap-kano-legend__item.is-active,
#roadmapModal .roadmap-kano-legend__item.is-expanded {
  background: #ffffff;
  color: #292524;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 0 0 1px rgba(180, 83, 9, 0.14),
    0 6px 16px rgba(120, 53, 15, 0.09);
}#roadmapModal .roadmap-kano-legend__item.is-active {
  border-color: rgba(180, 83, 9, 0.32);
}#roadmapModal .roadmap-kano-legend__item.is-expanded {
  border-color: rgba(180, 83, 9, 0.38);
}#roadmapModal .roadmap-kano-legend__item.is-expanded .roadmap-kano-legend__chevron {
  transform: rotate(180deg);
  opacity: 0.9;
}#roadmapModal .roadmap-kano-legend__item.is-active.is-expanded {
  transform: translateY(0);
}#roadmapModal .roadmap-kano-legend__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.04rem;
  min-width: 0;
  flex: 1 1 auto;
}#roadmapModal .roadmap-kano-legend__label {
  display: block;
  font-size: clamp(0.62rem, 1.8vw, 0.72rem);
  font-weight: 700;
  color: #44403c;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}#roadmapModal .roadmap-kano-legend__hint {
  display: block;
  font-size: clamp(0.56rem, 1.6vw, 0.64rem);
  font-weight: 600;
  color: #78716c;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}#roadmapModal .roadmap-kano-legend__compact {
  display: none;
}#roadmapModal .roadmap-kano-legend__item.is-active .roadmap-kano-legend__label {
  color: #292524;
}#roadmapModal .roadmap-kano-legend__item.is-active .roadmap-kano-legend__hint {
  color: #57534e;
}#roadmapModal .roadmap-kano-legend__swatch {
  width: 0.52rem;
  height: 0.52rem;
  border-radius: 999px;
  flex-shrink: 0;
}

@media (min-width: 860px) {
  #roadmapModal .roadmap-kano-legend-shell {
    padding: 0.38rem;
  }

  #roadmapModal .roadmap-kano-legend {
    gap: 0.38rem;
  }

  #roadmapModal button.roadmap-kano-legend__item {
    padding: 0.48rem 0.58rem 0.48rem 0.46rem;
  }

  #roadmapModal .roadmap-kano-legend__item {
    padding: 0.48rem 0.58rem 0.48rem 0.46rem;
  }
}#roadmapModal .roadmap-kano-legend__item--attractive .roadmap-kano-legend__swatch {
  background: #10b981;
}#roadmapModal .roadmap-kano-legend__item--one-dimensional .roadmap-kano-legend__swatch {
  background: #3b82f6;
}#roadmapModal .roadmap-kano-legend__item--must-be .roadmap-kano-legend__swatch {
  background: #f59e0b;
}#roadmapModal .roadmap-kano-legend__item--reverse .roadmap-kano-legend__swatch {
  background: #f43f5e;
}#roadmapModal .roadmap-kano-legend__item--indifferent .roadmap-kano-legend__swatch {
  background: #a8a29e;
}#roadmapModal .roadmap-kano-result {
  padding: 0.62rem 0.68rem;
  border-radius: 14px;
  border: 1px solid rgba(202, 138, 4, 0.16);
  background: rgba(255, 255, 255, 0.82);
  container-type: inline-size;
  container-name: kano-result;
}#roadmapModal .roadmap-kano-result--empty {
  border-style: dashed;
  background: rgba(255, 251, 245, 0.78);
}#roadmapModal .roadmap-kano-result--partial {
  border-style: dashed;
  border-color: rgba(217, 119, 6, 0.34);
  background: rgba(255, 251, 235, 0.92);
}#roadmapModal .roadmap-kano-result--filled {
  border-color: rgba(202, 138, 4, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 248, 235, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 4px 14px rgba(120, 53, 15, 0.05);
}#roadmapModal .roadmap-kano-result__bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-rows: 1fr;
  align-items: center;
  column-gap: 0.45rem;
  min-width: 0;
  width: 100%;
}#roadmapModal .roadmap-kano-result__metrics,
#roadmapModal .roadmap-kano-selection-summary {
  margin: 0;
  grid-column: 1;
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.28rem;
  min-width: 0;
  flex-shrink: 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: #78716c;
}#roadmapModal .roadmap-kano-result--filled .roadmap-kano-result__metrics,
#roadmapModal .roadmap-kano-result--filled .roadmap-kano-selection-summary {
  color: #57534e;
}#roadmapModal .roadmap-kano-result__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.26rem 0.48rem;
  border-radius: 999px;
  border: 1px solid rgba(202, 138, 4, 0.14);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 251, 245, 0.94) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  flex: 0 0 auto;
  min-width: 0;
}#roadmapModal .roadmap-kano-result__chip-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(254, 243, 199, 0.95), rgba(253, 230, 138, 0.55));
  color: #b45309;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}#roadmapModal .roadmap-kano-result__chip-body {
  display: inline-flex;
  align-items: center;
  gap: 0.12rem;
  min-width: 0;
}#roadmapModal .roadmap-kano-result__chip-value {
  display: inline-flex;
  align-items: baseline;
  gap: 0.14rem;
  min-width: 0;
  font-size: 0.74rem;
  font-weight: 600;
  color: #44403c;
  white-space: nowrap;
}#roadmapModal .roadmap-kano-result__chip-caption,
#roadmapModal .roadmap-kano-result__chip-level {
  display: none;
}#roadmapModal .roadmap-kano-result__chip-num {
  color: #92400e;
  font-weight: 800;
  font-size: 0.82rem;
}#roadmapModal .roadmap-kano-result__chip-sep {
  color: #d6d3d1;
  font-weight: 500;
}#roadmapModal .roadmap-kano-result__chip-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}#roadmapModal .roadmap-kano-result__category {
  grid-column: 2;
  justify-self: stretch;
  min-width: 0;
  max-width: 100%;
}#roadmapModal .roadmap-kano-result__clear {
  grid-column: 3;
  justify-self: end;
  flex-shrink: 0;
}

@container kano-result (max-width: 520px) {
  #roadmapModal .roadmap-kano-result {
    padding: 0.48rem 0.52rem;
  }

  #roadmapModal .roadmap-kano-result__bar {
    column-gap: 0.32rem;
  }

  #roadmapModal .roadmap-kano-result__chip {
    padding: 0.22rem 0.36rem;
    gap: 0.22rem;
  }

  #roadmapModal .roadmap-kano-result__chip-kicker {
    width: 0.92rem;
    height: 0.92rem;
    font-size: 0.52rem;
  }

  #roadmapModal .roadmap-kano-result__chip-label,
  #roadmapModal .roadmap-kano-result__chip-sep {
    display: none;
  }

  #roadmapModal .roadmap-kano-result__chip-num {
    font-size: 0.76rem;
  }
}

@container kano-result (max-width: 380px) {
  #roadmapModal .roadmap-kano-result__bar {
    column-gap: 0.24rem;
  }

  #roadmapModal .roadmap-kano-result__chip {
    padding: 0.2rem 0.3rem;
  }
}#roadmapModal .roadmap-kano-category-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  padding: 0.24rem 0.58rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  border: 1px solid rgba(168, 162, 158, 0.32);
  background: #fafaf9;
  color: #57534e;
  text-transform: none;
  box-shadow: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}#roadmapModal .roadmap-kano-category-badge__compact {
  display: none;
}

@container kano-result (max-width: 560px) {
  #roadmapModal .roadmap-kano-category-badge__full {
    display: none;
  }

  #roadmapModal .roadmap-kano-category-badge__compact {
    display: inline;
  }
}#roadmapModal .roadmap-kano-category-badge--attractive {
  background: #ecfdf5;
  border-color: rgba(16, 185, 129, 0.28);
  color: #047857;
}#roadmapModal .roadmap-kano-category-badge--one-dimensional {
  background: #eff6ff;
  border-color: rgba(59, 130, 246, 0.28);
  color: #1d4ed8;
}#roadmapModal .roadmap-kano-category-badge--must-be {
  background: #fffbeb;
  border-color: rgba(245, 158, 11, 0.32);
  color: #b45309;
}#roadmapModal .roadmap-kano-category-badge--reverse {
  background: #fff1f2;
  border-color: rgba(244, 63, 94, 0.28);
  color: #be123c;
}#roadmapModal .roadmap-kano-category-badge--indifferent {
  background: #f5f5f4;
  border-color: rgba(168, 162, 158, 0.32);
  color: #57534e;
}#roadmapModal .roadmap-kano-clear-btn {
  padding: 0.28rem 0.58rem;
  min-height: 2rem;
  min-width: 2rem;
  font-size: 0.66rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

@media (max-width: 1024px) {
  #roadmapModal .roadmap-kano-result {
    padding: 0.52rem 0.58rem;
  }
}

@media (max-width: 640px) {
  #roadmapModal .roadmap-kano-axis-selects {
    grid-template-columns: 1fr;
  }

  #roadmapModal .roadmap-kano-panel {
    padding: 0.72rem 0.72rem 0.82rem;
    gap: 0.72rem;
  }

  #roadmapModal .roadmap-kano-panel__title {
    font-size: 0.78rem;
  }

  #roadmapModal .roadmap-kano-matrix-band {
    grid-template-columns: 1fr;
  }

  #roadmapModal .roadmap-kano-matrix-wrap {
    --kano-gap: 0.14rem;
    column-gap: 0.22rem;
    grid-template-columns: minmax(1.5rem, auto) repeat(5, minmax(0, 1fr));
  }

  #roadmapModal .roadmap-kano-axis-label__micro {
    width: 1.22rem;
    height: 1.22rem;
    font-size: 0.62rem;
  }

  #roadmapModal .roadmap-kano-matrix-cell {
    border-radius: 8px;
  }

  #roadmapModal .roadmap-kano-legend-shell {
    padding: 0.28rem;
  }

  #roadmapModal .roadmap-kano-legend {
    gap: 0.22rem;
  }

  #roadmapModal .roadmap-kano-legend__item {
    padding: 0.34rem 0.32rem 0.34rem 0.3rem;
    gap: 0.28rem;
  }

  #roadmapModal .roadmap-kano-legend__swatch-wrap {
    width: 1.15rem;
    height: 1.15rem;
  }

  #roadmapModal .roadmap-kano-legend__hint {
    display: none;
  }

  #roadmapModal .roadmap-kano-legend__chevron {
    width: 0.34rem;
    height: 0.34rem;
  }

  #roadmapModal .roadmap-kano-legend-detail__inner {
    padding: 0.72rem 0.78rem 0.82rem;
  }

  #roadmapModal .roadmap-kano-legend-detail__text {
    font-size: 0.81rem;
    line-height: 1.68;
  }

  #roadmapModal .roadmap-kano-result {
    padding: 0.48rem 0.52rem;
  }

  #roadmapModal .roadmap-kano-result__chip {
    padding: 0.2rem 0.3rem;
  }

  #roadmapModal .roadmap-kano-result__chip-label,
  #roadmapModal .roadmap-kano-result__chip-sep {
    display: none;
  }

  #roadmapModal .roadmap-kano-clear-btn__label {
    font-size: 0;
    line-height: 0;
  }

  #roadmapModal .roadmap-kano-clear-btn__label::after {
    content: "×";
    font-size: 0.95rem;
    line-height: 1;
    font-weight: 700;
  }

  #roadmapModal .roadmap-kano-clear-btn {
    width: 1.65rem;
    height: 1.65rem;
    padding: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  #roadmapModal .roadmap-kano-legend__label {
    display: none;
  }

  #roadmapModal .roadmap-kano-legend__compact {
    display: block;
    font-size: clamp(0.58rem, 2.6vw, 0.66rem);
    font-weight: 700;
    color: #44403c;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  #roadmapModal .roadmap-kano-matrix-cell,
  #roadmapModal .roadmap-kano-matrix-cell__marker,
  #roadmapModal .roadmap-kano-matrix-cell__tip,
  #roadmapModal .roadmap-kano-axis-label,
  #roadmapModal .roadmap-kano-axis-meter__dot,
  #roadmapModal .roadmap-kano-legend__item {
    transition: none;
  }

  #roadmapModal .roadmap-kano-legend-detail {
    transition: none;
  }

  #roadmapModal .roadmap-kano-legend-detail.is-visible .roadmap-kano-legend-detail__inner {
    overflow: visible;
  }
}

@media (max-width: 520px) {
  #roadmapModal .roadmap-task-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.72rem 0.85rem;
  }

  #roadmapModal .roadmap-task-card__status {
    align-self: flex-start;
  }

  #roadmapModal .roadmap-raci-card {
    flex-wrap: wrap;
    gap: 0.5rem 0.65rem;
    padding: 0.72rem 0.85rem;
  }

  #roadmapModal .roadmap-raci-card__domain {
    margin-left: calc(2rem + 0.68rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  #roadmapModal .roadmap-task-card,
  #roadmapModal .roadmap-raci-card,
  #roadmapModal .roadmap-raci-remove-btn {
    transition: none;
  }
}#roadmapModal .roadmap-labels-readonly {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}#roadmapModal .roadmap-label-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.28rem 0.62rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.25;
  background: #ffedd5;
  border: 1px solid #fdba74;
  color: #7c2d12;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}#roadmapModal .roadmap-label-chip::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ea580c;
  flex-shrink: 0;
}#roadmapModal .roadmap-links-readonly {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}#roadmapModal .roadmap-link-card {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  padding: 0.55rem 0.62rem;
  border-radius: 8px;
  background: #fffdfb;
  border: 1px solid #e8d2a4;
}#roadmapModal .roadmap-link-card__icon {
  flex-shrink: 0;
  width: 1.65rem;
  height: 1.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  font-size: 0.85rem;
  background: #ffedd5;
  border: 1px solid #fdba74;
}#roadmapModal .roadmap-link-card__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}#roadmapModal .roadmap-link-card__title {
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.35;
  color: #b45309;
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-word;
}#roadmapModal .roadmap-link-card__title:hover {
  color: #c2410c;
}#roadmapModal .roadmap-link-card__url {
  font-size: 0.7rem;
  line-height: 1.35;
  color: #78716c;
  word-break: break-all;
}#roadmapModal .roadmap-field-empty-hint {
  margin: 0;
  padding: 0.35rem 0.15rem;
  font-size: 0.74rem;
  font-style: italic;
  color: #a8a29e;
}.countries-hint {
  font-size: 0.7rem;
  color: var(--muted);
}.countries-badge {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.28rem;
  margin-top: 0;
  max-width: 100%;
}.countries-badge__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  border-radius: 999px;
  padding: 0.14rem 0.48rem;
  border: 1px solid rgba(220, 38, 38, 0.22);
  background: linear-gradient(180deg, #fff5f5 0%, #fffbeb 100%);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #9f1239;
  line-height: 1.2;
  white-space: nowrap;
}.countries-badge__chip--others {
  font-weight: 650;
  color: #78716c;
  background: #fafaf9;
  border-color: #e7e5e4;
}.countries-badge--eu .countries-badge__chip {
  color: #1e3a8a;
  border-color: rgba(59, 130, 246, 0.45);
  background: rgba(239, 246, 255, 0.95);
}.countries-badge__flag {
  font-size: 0.95em;
  line-height: 1;
}.countries-badge__code {
  letter-spacing: 0.04em;
}/* --- Toast: deletion confirmation (bottom-right) --- */
.toast-container {
  position: fixed;
  bottom: clamp(1rem, 3vw, 1.5rem);
  right: clamp(1rem, 3vw, 1.5rem);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: min(360px, calc(100vw - 2rem));
  pointer-events: none;
}.toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, rgba(30, 41, 59, 0.98) 0%, rgba(15, 23, 42, 0.98) 100%);
  border: 1px solid rgba(52, 211, 153, 0.4);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(52, 211, 153, 0.15);
  font-size: 0.875rem;
  color: var(--text);
  line-height: 1.4;
  animation: toast-in 0.35s ease-out;
  transform-origin: bottom right;
}.toast-icon {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background: rgba(52, 211, 153, 0.25);
  color: #34d399;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
}.toast-message {
  flex: 1;
  min-width: 0;
}.toast.toast-exit {
  animation: toast-out 0.25s ease-in forwards;
}

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translateX(100%) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes toast-out {
  from {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateX(100%) scale(0.95);
  }
}

@media (prefers-reduced-motion: reduce) {
  .toast {
    animation: none;
  }
  .toast.toast-exit {
    animation: none;
  }
}/* =========================================================
   Indonesian Theme (Red / White / Gold) - Strong Override
   ========================================================= */
:root {
  --text: #4a0f1a;
  --text-secondary: #6b2132;
  --muted: #9a6f2a;
  --border: rgba(212, 175, 55, 0.5);
  --surface: #fffdf8;
  --surface-hover: #fff7eb;
}body {
  background: #ffffff;
}.app-shell {
  /* Remove the legacy “outer frame” so panels/cards own the visual structure. */
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}.app-badge {
  color: #7f1d1d;
  border-color: rgba(185, 28, 28, 0.38);
  background: linear-gradient(135deg, rgba(255, 235, 238, 1), rgba(255, 248, 225, 1));
}.card,
.card-plain {
  background: linear-gradient(180deg, #ffffff 0%, #fffaf4 100%);
  border: 1px solid rgba(212, 175, 55, 0.45);
  box-shadow: 0 10px 24px rgba(185, 28, 28, 0.08);
}.card-title,
.roadmaps-header-title,
.filters-title,
.modal-title {
  color: #ffd166;
}input,
select,
textarea {
  background: #ffffff;
  border-color: rgba(212, 175, 55, 0.55);
  color: #4a0f1a;
}input:focus,
select:focus,
textarea:focus {
  border-color: rgba(212, 175, 55, 0.85);
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.25);
}button {
  background: linear-gradient(135deg, #b91c1c, #ef4444);
  color: #fffdf9;
  border: 1px solid rgba(127, 29, 29, 0.2);
}/* KANO legend pills — not primary action buttons (avoid global button !important chrome) */
#roadmapModal .roadmap-kano-legend__item,
#roadmapModal .roadmap-kano-legend__item:hover,
#roadmapModal .roadmap-kano-legend__item:active,
#roadmapModal .roadmap-kano-legend__item:focus,
#roadmapModal .roadmap-kano-legend__item:focus-visible {
  background: #ffffff !important;
  color: #44403c !important;
  border-style: solid !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  font-weight: 600 !important;
  min-height: 0 !important;
  filter: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 1px 3px rgba(120, 53, 15, 0.05) !important;
}#roadmapModal .roadmap-kano-legend__item:hover {
  background: #fffdf8 !important;
  color: #292524 !important;
}#roadmapModal button.roadmap-kano-legend__item,
#roadmapModal button.roadmap-kano-legend__item:hover,
#roadmapModal button.roadmap-kano-legend__item:active,
#roadmapModal button.roadmap-kano-legend__item:focus {
  text-transform: none;
  letter-spacing: 0.01em;
  color: #44403c;
  background: #ffffff;
  border-style: solid;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 1px 2px rgba(120, 53, 15, 0.04);
}#roadmapModal button.roadmap-kano-legend__item:hover {
  color: #292524;
  background: #fffdf8;
}.btn-secondary,
.btn-ghost,
.filters-reset-btn,
.filters-toggle-btn,
.view-fullscreen-btn,
.roadmaps-map-fullscreen-btn {
  background: #fff8ea;
  border: 1px solid rgba(212, 175, 55, 0.5);
  color: #8a5b16;
}.btn-secondary:hover,
.btn-ghost:hover,
.filters-reset-btn:hover,
.filters-toggle-btn:hover,
.view-fullscreen-btn:hover,
.roadmaps-map-fullscreen-btn:hover {
  background: #fff0cf;
  border-color: rgba(212, 175, 55, 0.8);
  color: #7f1d1d;
}.view-toggle-group {
  border: 1px solid rgba(212, 175, 55, 0.5);
  background: #fff8ec;
}.view-toggle-btn {
  color: #8a5b16;
}.view-toggle-btn:hover {
  color: #7f1d1d;
  background: rgba(212, 175, 55, 0.22);
}.view-toggle-btn--active,
.view-toggle-btn--active:hover {
  background: linear-gradient(135deg, rgba(185, 28, 28, 0.8), rgba(153, 27, 27, 0.9));
  color: #fffaf2;
  box-shadow: 0 2px 10px rgba(185, 28, 28, 0.4);
}.filters-shell {
  background: linear-gradient(135deg, rgba(255, 232, 236, 0.88) 0%, rgba(255, 246, 225, 0.95) 100%);
  border-color: rgba(212, 175, 55, 0.42);
}.table-wrapper {
  border-color: rgba(212, 175, 55, 0.4);
  background: linear-gradient(180deg, rgba(255, 245, 247, 0.96) 0%, rgba(255, 250, 240, 0.96) 100%);
}thead {
  background: linear-gradient(to right, rgba(127, 29, 29, 0.97), rgba(185, 28, 28, 0.97));
}th {
  color: #ffe8a3;
}tbody tr:nth-child(even) {
  background: rgba(255, 252, 246, 0.96);
}tbody tr:nth-child(odd) {
  background: rgba(255, 247, 236, 0.98);
}tbody tr:hover {
  background: linear-gradient(90deg, rgba(254, 226, 226, 0.95) 0%, rgba(254, 243, 199, 0.95) 100%);
}.data-pill-group {
  border: 1px solid rgba(212, 175, 55, 0.52);
  background: #fff8eb;
}.data-pill-label {
  color: #8a5b16;
}.data-pill-btn:hover {
  background: rgba(239, 68, 68, 0.2);
}/* Full component-level Indonesian alignment */
.app-header {
  border-bottom-color: rgba(212, 175, 55, 0.4);
}.app-title,
.roadmaps-header-subtitle,
.card-caption,
.filters-quick-label,
.roadmaps-map-legend,
.hint-muted,
.modal-subtitle {
  color: #7a2233;
}.profile-icon-btn {
  background: #fff8ec;
  border-color: rgba(212, 175, 55, 0.45);
}.roadmaps-header-row {
  border-bottom-color: rgba(212, 175, 55, 0.35);
}.filters-active-pill {
  border-color: rgba(185, 28, 28, 0.45);
  color: #9f1239;
  background: rgba(254, 226, 226, 0.95);
}.filter-countries-toggle {
  background: #ffffff;
  border-color: rgba(212, 175, 55, 0.5);
  color: #7a2233;
}.filter-countries-toggle:hover {
  border-color: rgba(185, 28, 28, 0.45);
  background: rgba(254, 243, 199, 0.35);
  color: #5a1322;
}.filter-countries-popup {
  border-color: rgba(212, 175, 55, 0.55);
  background: linear-gradient(180deg, rgba(255, 250, 240, 0.98), rgba(255, 245, 247, 0.98));
  box-shadow: 0 16px 34px rgba(127, 29, 29, 0.16);
}.filter-countries-list {
  border-color: rgba(212, 175, 55, 0.5);
  background: #ffffff;
}.filter-country-option:hover {
  background: rgba(254, 226, 226, 0.7);
  color: #5a1322;
}.scrum-board-column,
.moscow-board-column.moscow-grid-cell {
  border-color: rgba(212, 175, 55, 0.45);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 250, 240, 0.98) 100%);
}.scrum-board-column-header,
.moscow-quadrant-header {
  border-bottom-color: rgba(212, 175, 55, 0.4);
}.scrum-board-column-title,
.moscow-grid-title {
  color: #7f1d1d;
}.scrum-board-card,
.moscow-board-card {
  border-color: rgba(212, 175, 55, 0.45);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.99) 0%, rgba(255, 249, 235, 0.98) 100%);
  box-shadow: 0 3px 10px rgba(127, 29, 29, 0.1);
}.scrum-board-card-title,
.moscow-board-card-title {
  color: #5a1322;
}.scrum-board-card-rice,
.moscow-board-card-rice,
.cell-rice {
  color: #b45309;
}.scrum-board-card-btn--view,
.moscow-board-card-btn--view {
  background: rgba(254, 243, 199, 0.85);
  color: #92400e;
}.scrum-board-card-btn--edit,
.moscow-board-card-btn--edit {
  background: rgba(254, 226, 226, 0.9);
  color: #9f1239;
}.scrum-board-card-btn--delete,
.moscow-board-card-btn--delete {
  background: rgba(254, 202, 202, 0.85);
  color: #991b1b;
}.scrum-board-card-btn--order,
.moscow-board-card-btn--order {
  background: rgba(253, 230, 138, 0.45);
  color: #8a5b16;
}.moscow-grid {
  border-color: rgba(212, 175, 55, 0.5);
  background: #fffdf7;
}.moscow-board-column[data-moscow="Must have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
}.moscow-board-column[data-moscow="Should have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
}.moscow-board-column[data-moscow="Could have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #f59e0b 0%, #d4af37 100%);
  color: #4a2e05;
}.moscow-board-column[data-moscow="Won't have"] .moscow-quadrant-label {
  background: linear-gradient(135deg, #9f1239 0%, #7f1d1d 100%);
}.cell-type-pill,
.tag,
.pill,
.pill-muted {
  border-color: rgba(212, 175, 55, 0.5);
  color: #7a2233;
  background: #fff8ea;
}.pill-accent,
.tag-strong {
  border-color: rgba(185, 28, 28, 0.55);
  color: #7f1d1d;
  background: linear-gradient(135deg, rgba(254, 226, 226, 0.85), rgba(253, 230, 138, 0.75));
}.modal-backdrop.overlay-close-immediate,
.modal-backdrop.overlay-close-immediate .modal-panel,
.profiles-panel-sheet.overlay-close-immediate,
.profiles-sheet-backdrop.overlay-close-immediate {
  transition: none !important;
}.modal-panel {
  background: linear-gradient(180deg, #ffffff 0%, #fff9f0 100%);
  border-color: rgba(212, 175, 55, 0.55);
  box-shadow: 0 24px 52px rgba(127, 29, 29, 0.2);
}#roadmapModal .modal-panel,
#profileViewModal .modal-panel,
#profileEditModal .modal-panel,
#profileDeleteModal .modal-panel,
#roadmapDeleteModal .modal-panel,
#exportFormatModal .modal-panel,
#importFormatModal .modal-panel {
  background: linear-gradient(180deg, #ffffff 0%, #fff9f0 100%);
}.form-section {
  background: linear-gradient(180deg, rgba(255, 250, 240, 0.95), rgba(255, 245, 247, 0.95));
  border-color: rgba(212, 175, 55, 0.45);
}.form-section-title,
.cell-type-tooltip-title {
  color: #8a5b16;
}.cell-type-tooltip {
  background: #fffaf2;
  border-color: rgba(212, 175, 55, 0.45);
  box-shadow: 0 8px 22px rgba(127, 29, 29, 0.15);
}.cell-type-tooltip-body {
  color: #6b2132;
}.toast {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 248, 230, 0.98) 100%);
  border-color: rgba(212, 175, 55, 0.55);
  color: #5a1322;
  box-shadow: 0 10px 28px rgba(127, 29, 29, 0.2);
}.toast-icon {
  background: rgba(212, 175, 55, 0.24);
  color: #a16207;
}/* =========================================================
   Indonesian Pro UI Refresh (Layout + Responsiveness)
   ========================================================= */
:root {
  --ui-radius-xl: 20px;
  --ui-radius-lg: 14px;
  --ui-radius-md: 10px;
  --ui-gap-xl: clamp(1rem, 2vw, 1.5rem);
  --ui-gap-lg: clamp(0.8rem, 1.4vw, 1.1rem);
  --ui-gap-md: clamp(0.6rem, 1.1vw, 0.85rem);
  --ui-shadow-soft: 0 10px 30px rgba(127, 29, 29, 0.12);
  --ui-shadow-hover: 0 14px 34px rgba(127, 29, 29, 0.18);
}body {
  /* Minimal outer inset: edge-to-edge feel; spacing is handled by inner panels. */
  padding: 0 !important;
}.app-shell {
  border-radius: 0 !important;
  /* Desktop: no unnecessary outer padding (cards/panels own layout). */
  padding: 0 !important;
}.app-header {
  margin-bottom: 0.65rem !important;
  padding-bottom: 0.55rem !important;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--ui-gap-lg);
  align-items: start;
}.app-layout {
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  /* Reduce spacing between sidebar and workspace. */
  gap: 0.65rem !important;
}.card,
.card-plain {
  border-radius: 4px;
}.card {
  padding: 0.65rem 0.8rem !important;
}.card-plain {
  padding: 0.65rem 0.8rem !important;
}.roadmaps-header-row {
  margin-bottom: 0.85rem;
  gap: 0.75rem 1rem;
}.roadmaps-header-actions {
  gap: 0.45rem;
}.filters-shell {
  border-radius: var(--ui-radius-lg);
  padding: 0.9rem 1rem 0.95rem;
}.filters-row {
  gap: 0.55rem;
}.table-wrapper {
  border-radius: var(--ui-radius-lg);
}th,
td {
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}.profile-item-row {
  transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}.scrum-board-card,
.moscow-board-card {
  transition: none;
}.scrum-board-card:hover,
.moscow-board-card:hover {
  transform: none;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
}.scrum-board {
  gap: 0.85rem;
}.scrum-board-column {
  border-radius: var(--ui-radius-lg);
}.moscow-grid {
  border-radius: var(--ui-radius-lg);
}.moscow-board-column.moscow-grid-cell {
  min-height: 280px;
}.modal-panel {
  border-radius: 16px;
}button {
  min-height: 38px;
  border-radius: var(--ui-radius-md);
}.data-pill-btn,
.filters-reset-btn,
.filters-toggle-btn,
.view-toggle-btn,
.view-fullscreen-btn,
.roadmaps-map-fullscreen-btn {
  min-height: 34px;
}

@media (max-width: 1400px) {
  .app-header {
    grid-template-columns: 1fr;
  }

  .app-header-actions {
    align-items: flex-start;
  }

  .app-layout {
    grid-template-columns: 1fr;
  }

  .profiles-panel {
    order: 0;
  }
}

@media (max-width: 900px) {
  .app-shell {
    padding: 0.85rem;
  }

  .card,
  .card-plain {
    border-radius: 14px;
    padding: 0.85rem;
  }

  .roadmaps-header-row {
    flex-direction: column;
    align-items: stretch;
  }

  .roadmaps-header-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .view-toggle-group {
    width: 100%;
    justify-content: center;
  }

  .scrum-board-column {
    flex: 0 0 290px;
    min-width: 290px;
    max-width: 290px;
  }
}

@media (max-width: 640px) {
  body {
    padding: 0.45rem;
  }

  .app-shell {
    border-radius: 14px;
    padding: 0.7rem;
  }

  .app-title {
    font-size: 1.15rem;
  }

  .roadmaps-header-title {
    font-size: 0.82rem;
  }

  .filters-shell {
    padding: 0.75rem;
  }

  .filters-row {
    gap: 0.45rem;
  }

  .table-wrapper {
    min-height: 170px;
  }

  .scrum-board-column {
    flex: 0 0 260px;
    min-width: 260px;
    max-width: 260px;
  }

  .modal-panel {
    padding: 1rem;
  }
}/* =========================================================
   Executive Polish Pass (cleaner,
calmer,
premium)
   ========================================================= */
:root {
  --ui-shadow-soft: 0 8px 24px rgba(127, 29, 29, 0.1);
  --ui-shadow-hover: 0 12px 28px rgba(127, 29, 29, 0.14);
}.app-title {
  font-weight: 700;
  letter-spacing: -0.015em;
}.app-subtitle,
.roadmaps-header-subtitle,
.card-caption,
.filters-quick-label {
  line-height: 1.55;
}.card,
.card-plain,
.filters-shell,
.table-wrapper,
.modal-panel,
.scrum-board-column,
.moscow-grid {
  box-shadow: var(--ui-shadow-soft);
}.card:hover,
.card-plain:hover,
.scrum-board-column:hover,
.moscow-board-column.moscow-grid-cell:hover {
  box-shadow: var(--ui-shadow-hover);
}button {
  font-weight: 600;
  letter-spacing: 0.05em;
}button:hover:not(.scrum-board-card-btn):not(.moscow-board-card-btn) {
  transform: translateY(-0.5px);
}.btn-danger {
  background: linear-gradient(135deg, #b91c1c, #dc2626);
  box-shadow: 0 10px 24px rgba(185, 28, 28, 0.22);
}.roadmaps-header-actions button,
.roadmaps-header-actions .view-toggle-group,
.app-header-actions .data-pill-group {
  align-self: center;
}.filters-header {
  margin-bottom: 0.6rem;
}.filter-inline-label,
label {
  font-weight: 600;
  letter-spacing: 0.055em;
}input,
select,
textarea {
  min-height: 42px;
}.view-toggle-group {
  padding: 0.18rem;
  gap: 0.12rem;
}.view-toggle-btn {
  min-height: 34px;
  padding: 0.36rem 0.7rem;
}th {
  font-size: 0.74rem;
}tbody td {
  font-size: 0.84rem;
}.cell-title {
  font-weight: 650;
}.scrum-board-card,
.moscow-board-card {
  border-width: 1px;
}.scrum-board-card-actions,
.moscow-board-card-actions {
  margin-top: 0.45rem;
  padding-top: 0.45rem;
}.modal-title {
  letter-spacing: 0.1em;
}.modal-subtitle {
  font-size: 0.78rem;
}.toast {
  border-radius: 12px;
}/* =========================================================
   Brand-grade Indonesian finish
   ========================================================= */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(135deg, rgba(185, 28, 28, 0.03) 25%, transparent 25%),
    linear-gradient(225deg, rgba(212, 175, 55, 0.035) 25%, transparent 25%),
    linear-gradient(315deg, rgba(185, 28, 28, 0.03) 25%, transparent 25%),
    linear-gradient(45deg, rgba(212, 175, 55, 0.035) 25%, transparent 25%);
  background-size: 28px 28px;
  background-position: 0 0, 14px 0, 14px -14px, 0 14px;
}/* Premium scrollbars */
*::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}*::-webkit-scrollbar-track {
  background: rgba(212, 175, 55, 0.14);
  border-radius: 999px;
}*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(185, 28, 28, 0.6), rgba(212, 175, 55, 0.7));
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.7);
}*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(185, 28, 28, 0.75), rgba(212, 175, 55, 0.85));
}/* Stronger,
elegant focus visibility */
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
.view-toggle-btn:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px #ffffff,
    0 0 0 4px rgba(185, 28, 28, 0.4),
    0 0 0 6px rgba(212, 175, 55, 0.25);
}/* Branded status pill treatment */
.cell-type-pill[data-status="Not Started"] {
  border-color: rgba(212, 175, 55, 0.55);
  background: rgba(253, 230, 138, 0.2);
  color: #8a5b16;
}.cell-type-pill[data-status="In Progress"] {
  border-color: rgba(185, 28, 28, 0.55);
  background: rgba(254, 226, 226, 0.8);
  color: #9f1239;
}.cell-type-pill[data-status="On Hold"] {
  border-color: rgba(180, 83, 9, 0.5);
  background: rgba(254, 243, 199, 0.85);
  color: #92400e;
}.cell-type-pill[data-status="Done"] {
  border-color: rgba(180, 83, 9, 0.55);
  background: linear-gradient(135deg, rgba(253, 230, 138, 0.65), rgba(212, 175, 55, 0.35));
  color: #7c4a10;
}.cell-type-pill[data-status="Cancelled"] {
  border-color: rgba(153, 27, 27, 0.55);
  background: rgba(254, 202, 202, 0.85);
  color: #991b1b;
}/* Hero polish */
.roadmaps-header-title {
  letter-spacing: 0.11em;
  text-transform: uppercase;
}.roadmaps-header-badges .pill,
.roadmaps-header-badges .tag {
  background: linear-gradient(135deg, rgba(255, 250, 240, 0.95), rgba(255, 240, 220, 0.95));
}/* Gentle animation for high-value controls */
.profile-add-btn,
#addRoadmapBtn,
#bulkDeleteBtn,
#refreshExchangeRatesBtn {
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), filter var(--transition-fast);
}.profile-add-btn:hover,
#addRoadmapBtn:hover,
#bulkDeleteBtn:hover,
#refreshExchangeRatesBtn:hover {
  transform: translateY(-1px);
  filter: saturate(1.05);
}

@media (max-width: 640px) {
  body::before {
    background-size: 22px 22px;
    background-position: 0 0, 11px 0, 11px -11px, 0 11px;
  }
}/* =========================================================
   Final palette enforcement: White surfaces + Red/Gold accents
   ========================================================= */
html,
body {
  background: #ffffff !important;
}body::before {
  opacity: 0.6;
}.app-shell,
.card,
.card-plain,
.profiles-panel,
.roadmaps-view,
.filters-shell,
.table-wrapper,
.scrum-board-column,
.moscow-grid,
.moscow-board-column.moscow-grid-cell,
.modal-panel,
.form-section,
.toast,
.data-pill-group,
.view-toggle-group,
.filter-countries-popup,
.filter-countries-list,
.cell-type-tooltip:not(.cell-type-tooltip--countries) {
  background: #ffffff !important;
  background-image: none !important;
}.app-shell,
.card,
.card-plain,
.filters-shell,
.table-wrapper,
.scrum-board-column,
.moscow-grid,
.moscow-board-column.moscow-grid-cell,
.modal-panel,
.form-section {
  border-color: rgba(212, 175, 55, 0.55) !important;
}.app-title,
.card-title,
.roadmaps-header-title,
.modal-title,
.filters-title {
  color: #9f1239 !important;
}.app-subtitle,
.roadmaps-header-subtitle,
.card-caption,
.modal-subtitle,
.filters-quick-label,
.hint-muted,
.profile-item-meta,
.cell-meta {
  color: #8a5b16 !important;
}input,
select,
textarea,
.filter-countries-toggle {
  background: #ffffff !important;
  color: #5a1322 !important;
  border-color: rgba(212, 175, 55, 0.6) !important;
}thead {
  background: linear-gradient(to right, #b91c1c, #dc2626) !important;
}th {
  color: #fff1c2 !important;
}tbody tr:nth-child(odd),
tbody tr:nth-child(even) {
  background: #ffffff !important;
}tbody tr:hover {
  background: linear-gradient(90deg, rgba(254, 226, 226, 0.9), rgba(254, 243, 199, 0.9)) !important;
}.scrum-board-card,
.moscow-board-card,
.pill,
.pill-muted,
.tag,
.cell-type-pill {
  background: #ffffff !important;
  border-color: rgba(212, 175, 55, 0.6) !important;
  color: #7f1d1d !important;
}.view-toggle-btn {
  color: #8a5b16 !important;
}.view-toggle-btn:hover {
  background: rgba(212, 175, 55, 0.2) !important;
  color: #7f1d1d !important;
}.view-toggle-btn--active,
.view-toggle-btn--active:hover {
  background: linear-gradient(135deg, #b91c1c, #dc2626) !important;
  color: #fffaf0 !important;
}button {
  background: linear-gradient(135deg, #b91c1c, #ef4444);
  color: #fffaf2;
}.btn-secondary,
.btn-ghost,
.filters-reset-btn,
.filters-toggle-btn,
.view-fullscreen-btn,
.roadmaps-map-fullscreen-btn,
.data-pill-btn,
.app-header-menu-toggle,
.app-header-action-btn {
  background: #fff8eb !important;
  color: #8a5b16 !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
}.btn-secondary:hover,
.btn-ghost:hover,
.filters-reset-btn:hover,
.filters-toggle-btn:hover,
.view-fullscreen-btn:hover,
.roadmaps-map-fullscreen-btn:hover,
.data-pill-btn:hover,
.app-header-menu-toggle:hover,
.app-header-action-btn:hover {
  background: rgba(212, 175, 55, 0.2) !important;
  color: #7f1d1d !important;
}/* Final icon/button cleanup to remove remaining dark variants */
.profile-icon-btn,
.profile-icon-btn--view,
.profile-icon-btn--edit,
.profile-icon-btn--danger,
.rice-info-btn,
.sort-button,
.country-remove-btn,
.modal-close-btn,
.scrum-board-card-btn,
.moscow-board-card-btn {
  background: #fff8eb !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
  color: #8a5b16 !important;
  box-shadow: none !important;
}.profile-icon-btn:hover,
.profile-icon-btn--view:hover,
.profile-icon-btn--edit:hover,
.profile-icon-btn--danger:hover,
.rice-info-btn:hover,
.sort-button:hover,
.country-remove-btn:hover,
.modal-close-btn:hover,
.scrum-board-card-btn:hover,
.moscow-board-card-btn:hover {
  background: rgba(212, 175, 55, 0.22) !important;
  border-color: rgba(185, 28, 28, 0.45) !important;
  color: #7f1d1d !important;
  transform: none !important;
  box-shadow: none !important;
}.scrum-board-card-btn--delete,
.moscow-board-card-btn--delete {
  background: rgba(254, 226, 226, 0.95) !important;
  border-color: rgba(185, 28, 28, 0.45) !important;
  color: #9f1239 !important;
}.scrum-board-card-btn--order,
.moscow-board-card-btn--order {
  background: rgba(254, 243, 199, 0.9) !important;
  border-color: rgba(212, 175, 55, 0.7) !important;
  color: #8a5b16 !important;
}/* Hard override for remaining dark controls from screenshots */
.profile-add-btn,
.profile-add-btn:visited {
  background: linear-gradient(135deg, #fff8eb 0%, #fff2d6 100%) !important;
  border: 1px solid rgba(212, 175, 55, 0.85) !important;
  color: #8a5b16 !important;
  box-shadow: 0 4px 14px rgba(212, 175, 55, 0.2) !important;
}.profile-add-btn:hover,
.profile-add-btn:focus-visible {
  background: linear-gradient(135deg, #ffe9ec 0%, #fff1cf 100%) !important;
  border-color: rgba(185, 28, 28, 0.55) !important;
  color: #9f1239 !important;
  box-shadow: 0 6px 18px rgba(185, 28, 28, 0.16) !important;
}.profile-add-btn .profile-add-btn-icon,
.profile-add-btn .profile-add-btn-text {
  color: inherit !important;
}.scrum-board-column-count,
.moscow-board-column.moscow-grid-cell .moscow-board-column-count {
  background: linear-gradient(135deg, #fff8eb 0%, #fde68a 100%) !important;
  border: 1px solid rgba(212, 175, 55, 0.8) !important;
  color: #8a5b16 !important;
  font-weight: 700 !important;
}/* =========================================================
   Indonesian Palette v2 (Accessibility + Usability First)
   ========================================================= */
:root {
  --id-red-700: #b91c1c;
  --id-red-600: #dc2626;
  --id-red-50: #fef2f2;
  --id-gold-700: #a16207;
  --id-gold-600: #b45309;
  --id-gold-500: #ca8a04;
  --id-gold-100: #fef3c7;
  --id-surface: #ffffff;
  --id-surface-soft: #fffdf8;
  --id-border: #e7c978;
  --id-text: #3f0f19;
  --id-text-soft: #7a4b12;
}html,
body,
.app-shell,
.card,
.card-plain,
.profiles-panel,
.roadmaps-view,
.filters-shell,
.table-wrapper,
.scrum-board-column,
.moscow-grid,
.moscow-board-column.moscow-grid-cell,
.modal-panel,
.form-section,
.toast,
.data-pill-group,
.view-toggle-group,
.filter-countries-popup,
.filter-countries-list,
.cell-type-tooltip {
  background: var(--id-surface) !important;
}body {
  color: var(--id-text) !important;
}.app-shell,
.card,
.card-plain,
.filters-shell,
.table-wrapper,
.scrum-board-column,
.moscow-grid,
.moscow-board-column.moscow-grid-cell,
.modal-panel,
.form-section {
  border: 1px solid var(--id-border) !important;
  box-shadow: 0 6px 18px rgba(185, 28, 28, 0.08) !important;
}.app-title,
.card-title,
.roadmaps-header-title,
.modal-title,
.filters-title,
.scrum-board-column-title,
.moscow-grid-title {
  color: var(--id-red-700) !important;
}.app-subtitle,
.roadmaps-header-subtitle,
.card-caption,
.modal-subtitle,
.filters-quick-label,
.hint-muted,
.profile-item-meta,
.cell-meta,
.exchange-rates-date-label,
.roadmaps-map-legend {
  color: var(--id-text-soft) !important;
}label,
.filter-inline-label,
.data-pill-label {
  color: var(--id-gold-700) !important;
}input,
select,
textarea,
.filter-countries-toggle {
  background: #fff !important;
  color: var(--id-text) !important;
  border: 1px solid var(--id-border) !important;
}input::placeholder,
textarea::placeholder {
  color: #a17a37 !important;
}input:focus,
select:focus,
textarea:focus,
.filter-countries-toggle:focus {
  border-color: var(--id-red-600) !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18) !important;
}/* =========================================================
   Modern native select controls (forms + filters)
   ========================================================= */
:root {
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 7.75L10 12.25L14.5 7.75' stroke='%23b45309' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --select-chevron-muted: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 7.75L10 12.25L14.5 7.75' stroke='%23a8a29e' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  padding-right: 2.35rem !important;
  background-image: var(--select-chevron) !important;
  background-repeat: no-repeat !important;
  background-position: right 0.72rem center !important;
  background-size: 1.05rem 1.05rem !important;
  cursor: pointer !important;
  border-radius: 12px !important;
  border: 1px solid rgba(180, 134, 49, 0.32) !important;
  background-color: #fff !important;
  color: var(--id-text) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  box-shadow:
    0 1px 2px rgba(63, 15, 25, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background-color 0.18s ease,
    transform 0.12s ease !important;
}select:hover:not(:disabled) {
  border-color: rgba(185, 28, 28, 0.38) !important;
  background-color: #fffdfb !important;
  box-shadow:
    0 2px 10px rgba(127, 29, 29, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}select:active:not(:disabled) {
  transform: translateY(0.5px);
}select:focus,
select:focus-visible {
  outline: none !important;
  border-color: var(--id-red-600) !important;
  box-shadow:
    0 0 0 3px rgba(220, 38, 38, 0.14),
    0 4px 14px rgba(127, 29, 29, 0.08) !important;
}select:disabled {
  opacity: 0.68 !important;
  cursor: not-allowed !important;
  background-color: #faf8f4 !important;
  background-image: var(--select-chevron-muted) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
}select option {
  color: #431407;
  background: #fff;
}.filters-row select,
.filter-group select,
.roadmaps-table-group-select,
#roadmapModal .roadmap-task-row select,
#roadmapModal .roadmap-raci-row select,
.country-row select {
  min-height: 42px !important;
}#roadmapModal .roadmap-task-row select,
#roadmapModal .roadmap-raci-row select,
.country-row select {
  min-height: var(--roadmap-field-min-height, 44px) !important;
  padding: var(--roadmap-field-pad-block, 0.75rem) var(--roadmap-field-pad-inline, 0.88rem) !important;
  font-size: 0.875rem !important;
  border-radius: 10px !important;
}

@media (max-width: 640px) {
  select {
    min-height: 44px !important;
    font-size: 16px !important;
  }

  .filters-row select,
  .filter-group select {
    border-radius: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  select {
    transition: none !important;
  }

  select:active:not(:disabled) {
    transform: none;
  }
}/* =========================================================
   Modern multi-select popovers (Countries / Roadmap period)
   ========================================================= */
.filter-countries-toggle {
  min-height: 42px !important;
  padding: 0.55rem 0.75rem !important;
  border-radius: 14px !important;
  font-size: 0.85rem !important;
  line-height: 1.1 !important;
  color: var(--id-text) !important;
  background: #ffffff !important;
  box-shadow:
    0 1px 0 rgba(127, 29, 29, 0.05),
    inset 0 0 0 1px rgba(255, 255, 255, 0.9) !important;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease, transform 160ms ease !important;
}.filter-countries-toggle:hover {
  background: linear-gradient(180deg, rgba(255, 252, 245, 0.9), #ffffff) !important;
  border-color: rgba(185, 28, 28, 0.45) !important;
  box-shadow: 0 8px 22px rgba(127, 29, 29, 0.08) !important;
}.filter-countries-toggle:active {
  transform: translateY(1px) !important;
}.filter-countries-toggle:focus-visible {
  outline: none !important;
  border-color: var(--id-red-600) !important;
  box-shadow:
    0 0 0 3px rgba(220, 38, 38, 0.18),
    0 10px 26px rgba(127, 29, 29, 0.12) !important;
}.filter-countries-summary {
  min-height: 1.25rem !important;
  font-size: 0.82rem !important;
  color: var(--id-text-soft) !important;
}.filter-countries-toggle-icon {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--id-surface-soft) !important;
  border: 1px solid var(--id-border) !important;
  color: var(--id-gold-700) !important;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease !important;
}.filter-countries.open .filter-countries-toggle-icon {
  transform: rotate(180deg);
  background: var(--id-gold-100) !important;
  border-color: #d7a928 !important;
  color: var(--id-red-700) !important;
}.filter-countries-popup {
  border-radius: 16px !important;
  padding: 0.6rem !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
  background: linear-gradient(180deg, #ffffff, #fffaf0) !important;
  box-shadow:
    0 26px 70px rgba(127, 29, 29, 0.18),
    0 8px 24px rgba(15, 23, 42, 0.08) !important;
}.filter-countries-popup input[type="text"],
.filter-countries-popup input[type="search"] {
  width: 100% !important;
  min-height: 38px !important;
  border-radius: 12px !important;
  padding: 0.5rem 0.65rem !important;
  margin-bottom: 0.5rem !important;
  background: #fffdf6 !important;
  border: 1px solid var(--id-border) !important;
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  -webkit-font-smoothing: antialiased;
}.filter-countries-popup input[type="text"]:focus,
.filter-countries-popup input[type="search"]:focus {
  border-color: var(--id-red-600) !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.16) !important;
}.filter-countries-list {
  max-height: min(260px, 44vh) !important;
  border-radius: 14px !important;
  padding: 0.35rem !important;
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  background: #ffffff !important;
}.filter-country-option {
  padding: 0.4rem 0.45rem !important;
  border-radius: 12px !important;
  font-size: 0.85rem !important;
  color: var(--id-text) !important;
  gap: 0.5rem !important;
}.filter-country-option:hover {
  background: linear-gradient(90deg, rgba(254, 226, 226, 0.6), rgba(254, 243, 199, 0.55)) !important;
  color: var(--id-red-700) !important;
}.filter-country-option input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--id-red-600);
}.filter-country-option input[type="checkbox"]:checked + label,
.filter-country-option input[type="checkbox"]:checked + span {
  font-weight: 600;
  color: var(--id-red-700);
}.filter-countries-chip {
  padding: 0.18rem 0.55rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  background: #fffdf6 !important;
  color: var(--id-red-700) !important;
}

@media (max-width: 520px) {
  .filter-countries-toggle {
    min-height: 44px !important;
    padding: 0.6rem 0.7rem !important;
  }
  .filter-countries-toggle-icon {
    width: 1.9rem;
    height: 1.9rem;
  }
  .filter-countries-popup {
    padding: 0.55rem !important;
  }
}button,
#addRoadmapBtn,
.profile-add-btn {
  background: linear-gradient(135deg, var(--id-red-700), var(--id-red-600)) !important;
  color: #fffaf5 !important;
  border: 1px solid rgba(127, 29, 29, 0.2) !important;
}.raci-matrix-domain-btn {
  background: transparent !important;
  color: inherit !important;
  border: none !important;
  box-shadow: none !important;
  filter: none !important;
}.raci-matrix-card__role-toggle {
  background: rgba(245, 245, 244, 0.95) !important;
  color: #57534e !important;
  border: 1px solid rgba(168, 162, 158, 0.42) !important;
  box-shadow: none !important;
  filter: none !important;
  width: auto !important;
}.raci-matrix-card__role-toggle:hover {
  filter: none !important;
}.raci-matrix-card .raci-matrix-name-chip--more.raci-matrix-card__role-toggle {
  background: rgba(245, 245, 244, 0.95) !important;
  color: #57534e !important;
  border: 1px solid rgba(168, 162, 158, 0.42) !important;
  box-shadow: none !important;
}.raci-matrix-card .raci-matrix-name-chip--more.raci-matrix-card__role-toggle:hover {
  color: #44403c !important;
  border-color: rgba(120, 113, 108, 0.5) !important;
  background: #fafaf9 !important;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06) !important;
  filter: none !important;
}.raci-matrix-card__role--expanded .raci-matrix-name-chip--more.raci-matrix-card__role-toggle,
.raci-matrix-card__domain-row--expanded .raci-matrix-name-chip--more.raci-matrix-card__role-toggle {
  border-color: rgba(202, 138, 4, 0.35) !important;
  background: linear-gradient(180deg, #fffefb 0%, #fff7ed 100%) !important;
  color: #92400e !important;
}button:hover,
#addRoadmapBtn:hover,
.profile-add-btn:hover {
  filter: brightness(1.03);
  box-shadow: 0 6px 16px rgba(185, 28, 28, 0.22) !important;
}.raci-matrix-domain-btn:hover {
  filter: none !important;
}.raci-matrix-card .raci-matrix-roadmap-link {
  background: linear-gradient(180deg, #fffefb 0%, #fff7ed 100%) !important;
  color: #9a3412 !important;
  border: 1px solid rgba(202, 138, 4, 0.24) !important;
  box-shadow: 0 1px 3px rgba(120, 53, 15, 0.06) !important;
  filter: none !important;
}#roadmapModal .roadmap-kano-legend__item,
#roadmapModal .roadmap-kano-legend__item:hover,
#roadmapModal .roadmap-kano-legend__item:active,
#roadmapModal .roadmap-kano-legend__item:focus-visible {
  background: #ffffff !important;
  color: #44403c !important;
  border: 1px solid rgba(202, 138, 4, 0.18) !important;
  filter: none !important;
  min-height: 0 !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 1px 3px rgba(120, 53, 15, 0.05) !important;
}#roadmapModal .roadmap-kano-legend__item:hover {
  background: #fffdf8 !important;
  color: #292524 !important;
  border-color: rgba(180, 83, 9, 0.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 4px 12px rgba(120, 53, 15, 0.07) !important;
}#roadmapModal .roadmap-kano-legend__item.is-active,
#roadmapModal .roadmap-kano-legend__item.is-expanded {
  background: #ffffff !important;
  color: #292524 !important;
}.raci-matrix-card .raci-matrix-roadmap-link:hover {
  color: #7c2d12 !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
  background: linear-gradient(180deg, #fff 0%, #fff7ed 100%) !important;
  box-shadow: 0 4px 14px rgba(127, 29, 29, 0.1) !important;
  filter: none !important;
}.raci-matrix-grid__roadmap-link {
  background: linear-gradient(180deg, #fffefb 0%, #fff7ed 100%) !important;
  color: #9a3412 !important;
  border: 1px solid rgba(202, 138, 4, 0.28) !important;
  box-shadow: 0 1px 4px rgba(120, 53, 15, 0.08) !important;
  filter: none !important;
}.raci-matrix-grid__roadmap-link:hover {
  color: #7c2d12 !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
  background: linear-gradient(180deg, #fff 0%, #fff7ed 100%) !important;
  box-shadow: 0 4px 14px rgba(127, 29, 29, 0.1) !important;
  filter: none !important;
}.map-metric-picker__trigger,
.map-metric-picker__option {
  background: #fff !important;
  color: var(--id-text, #3f0f19) !important;
  border-color: rgba(231, 201, 120, 0.65) !important;
  box-shadow: none !important;
  filter: none !important;
}.map-metric-picker__option {
  background: transparent !important;
}.map-metric-picker__trigger:hover,
.map-metric-picker__option:hover,
.map-metric-picker__option--highlight,
.map-metric-picker__option--active {
  filter: none !important;
  box-shadow: none !important;
}.profiles-sheet-tab,
.profiles-panel-sheet-close,
.profiles-panel-sheet .profiles-select__trigger,
.profiles-panel-sheet .profiles-select__option,
.profiles-panel-sheet .profiles-select__actions .profile-action-chip,
.profiles-panel-sheet .profiles-select__actions .profile-icon-btn,
.profiles-panel-sheet .profiles-sheet-tab,
.portfolio-filters-sheet .portfolio-filters-sheet-close,
.portfolio-filters-sheet .filters-reset-btn,
.portfolio-filters-sheet .filters-toggle-btn {
  background: transparent !important;
  color: var(--id-text, #3f0f19) !important;
  border-color: rgba(231, 201, 120, 0.65) !important;
  box-shadow: none !important;
  filter: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transform: none !important;
}.profiles-sheet-tab--active {
  background: #fff !important;
}.profiles-panel--v2 .profiles-create-submit,
.profile-add-btn.profiles-create-submit {
  background: linear-gradient(135deg, var(--id-red-700), var(--id-red-600)) !important;
  color: #fffaf5 !important;
}.btn-secondary,
.btn-ghost,
.filters-reset-btn,
.filters-toggle-btn,
.view-fullscreen-btn,
.roadmaps-map-fullscreen-btn,
.data-pill-btn,
.app-header-menu-toggle,
.app-header-action-btn,
.rice-info-btn,
.sort-button,
.country-remove-btn,
.modal-close-btn,
.profile-password-toggle,
.export-modal-btn,
.scrum-board-card-btn,
.moscow-board-card-btn,
.profile-icon-btn {
  background: var(--id-surface-soft) !important;
  color: var(--id-gold-700) !important;
  border: 1px solid var(--id-border) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}.btn-secondary:hover,
.btn-ghost:hover,
.filters-reset-btn:hover,
.filters-toggle-btn:hover,
.view-fullscreen-btn:hover,
.roadmaps-map-fullscreen-btn:hover,
.data-pill-btn:hover,
.app-header-menu-toggle:hover,
.app-header-action-btn:hover,
.rice-info-btn:hover,
.sort-button:hover,
.country-remove-btn:hover,
.modal-close-btn:hover,
.profile-password-toggle:hover,
.export-modal-btn:hover,
.scrum-board-card-btn:hover,
.moscow-board-card-btn:hover,
.profile-icon-btn:hover {
  background: var(--id-gold-100) !important;
  color: var(--id-red-700) !important;
  border-color: #d7a928 !important;
  transform: none !important;
  box-shadow: none !important;
}thead {
  background: linear-gradient(to right, var(--id-red-700), var(--id-red-600)) !important;
}th {
  color: #fff5d6 !important;
}tbody tr:nth-child(odd) {
  background: #ffffff !important;
}tbody tr:nth-child(even) {
  background: #fffcf5 !important;
}tbody tr:hover {
  background: linear-gradient(90deg, #fff0f0, #fff7df) !important;
}.scrum-board-card,
.moscow-board-card,
.pill,
.pill-muted,
.tag,
.cell-type-pill {
  background: #fff !important;
  border: 1px solid var(--id-border) !important;
  color: var(--id-text) !important;
}.filters-active-pill {
  background: linear-gradient(135deg, #fff4f4, #fff6e6) !important;
  border-color: #dca62a !important;
  color: var(--id-red-700) !important;
}.scrum-board-column-count,
.moscow-board-column.moscow-grid-cell .moscow-board-column-count {
  background: #fff7df !important;
  border: 1px solid #d9ab2e !important;
  color: var(--id-gold-700) !important;
}.cell-rice,
.scrum-board-card-rice,
.moscow-board-card-rice {
  color: var(--id-gold-600) !important;
}.cell-type-tooltip {
  border: 1px solid var(--id-border) !important;
  color: var(--id-text) !important;
}.cell-type-tooltip-title {
  color: var(--id-red-700) !important;
  background: #fff6ea !important;
}.cell-type-tooltip--countries .cell-type-tooltip-title {
  color: #9f1239 !important;
  background: #fff6ea !important;
}.cell-type-tooltip--countries .cell-type-tooltip-body,
.cell-type-tooltip--countries .countries-tooltip-body {
  color: #5a1322 !important;
  background: #fffaf2 !important;
}.cell-type-tooltip--period .cell-period-tooltip-periods {
  background: #ffffff !important;
  color: var(--id-text) !important;
}.cell-type-tooltip--period .cell-period-tooltip-periods p {
  color: var(--id-text) !important;
}.cell-type-tooltip--period .cell-type-tooltip-title {
  background: #fff6ea !important;
}.cell-type-tooltip--period .cell-period-tooltip-deadline {
  background: #fff7ed !important;
}.cell-type-tooltip-body {
  color: var(--id-text) !important;
}/* =========================================================
   Modern Controls Refresh (toggles + primary actions)
   ========================================================= */
.roadmaps-header-actions {
  gap: 0.7rem !important;
  align-items: center;
}.view-toggle-group {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem !important;
  padding: 0.25rem !important;
  border-radius: 14px !important;
  border: 1px solid rgba(212, 175, 55, 0.75) !important;
  background: linear-gradient(180deg, #fffdf8 0%, #fff7e8 100%) !important;
  box-shadow: 0 4px 14px rgba(180, 83, 9, 0.12);
}.view-toggle-btn {
  min-height: 40px !important;
  padding: 0.52rem 0.9rem !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #8a5b16 !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase;
  transition: all 0.18s ease !important;
}.view-toggle-btn:hover {
  background: #fff1cf !important;
  color: #9f1239 !important;
  border-color: rgba(212, 175, 55, 0.65) !important;
  transform: translateY(-1px);
}.view-toggle-btn--active,
.view-toggle-btn--active:hover {
  background: linear-gradient(135deg, #b91c1c, #dc2626) !important;
  border-color: rgba(127, 29, 29, 0.28) !important;
  color: #fff9f4 !important;
  box-shadow: 0 6px 16px rgba(185, 28, 28, 0.24);
  transform: translateY(0);
}#addRoadmapBtn,
#bulkDeleteBtn,
#bulkDuplicateBtn,
#bulkMoveBtn {
  min-height: 42px !important;
  padding: 0.58rem 1rem !important;
  border-radius: 11px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
  transition: all 0.18s ease !important;
}#addRoadmapBtn {
  background: linear-gradient(135deg, #b91c1c, #ef4444) !important;
  color: #fffaf5 !important;
  border: 1px solid rgba(127, 29, 29, 0.2) !important;
  box-shadow: 0 8px 18px rgba(185, 28, 28, 0.2);
}#addRoadmapBtn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(185, 28, 28, 0.28);
  filter: saturate(1.05);
}#bulkDeleteBtn {
  background: linear-gradient(135deg, #fff2f2, #ffe4e4) !important;
  color: #9f1239 !important;
  border: 1px solid rgba(220, 38, 38, 0.35) !important;
  box-shadow: none;
}#bulkDeleteBtn:hover {
  background: linear-gradient(135deg, #fee2e2, #fecaca) !important;
  border-color: rgba(185, 28, 28, 0.55) !important;
  transform: translateY(-1px);
}#bulkDeleteBtn:disabled,
#addRoadmapBtn:disabled,
.view-toggle-btn:disabled {
  opacity: 0.55 !important;
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

@media (max-width: 640px) {
  .roadmaps-header-actions {
    gap: 0.5rem !important;
  }

  .view-toggle-group {
    width: 100%;
    justify-content: space-between;
  }

  .view-toggle-btn {
    flex: 1 1 auto;
    min-width: 0;
    padding-inline: 0.45rem !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.05em !important;
  }

  #addRoadmapBtn,
  #bulkDeleteBtn {
    flex: 1 1 calc(50% - 0.25rem);
    justify-content: center;
  }
}/* =========================================================
   Modern Table Header Refresh (clean + enterprise)
   ========================================================= */
.table-wrapper {
  border-radius: 14px !important;
  border: 1px solid rgba(212, 175, 55, 0.75) !important;
  overflow: auto;
}table {
  border-collapse: separate;
  border-spacing: 0;
}thead {
  background: #fffdf8 !important;
  box-shadow: inset 0 -1px 0 rgba(212, 175, 55, 0.4);
}thead tr {
  position: relative;
}thead tr::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, #b91c1c 0%, #dc2626 45%, #d4af37 100%);
}th {
  background: transparent !important;
  color: #7f1d1d !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.075em !important;
  text-transform: uppercase;
  padding: 0.86rem 0.72rem 0.72rem !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.45) !important;
  vertical-align: middle;
}th:first-child {
  border-top-left-radius: 10px;
}th:last-child {
  border-top-right-radius: 10px;
}.sort-button {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.22rem 0.38rem !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #7f1d1d !important;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}.sort-button:hover {
  background: rgba(254, 243, 199, 0.75) !important;
  border-color: rgba(212, 175, 55, 0.65) !important;
  color: #9f1239 !important;
}.sort-indicator {
  opacity: 0.5 !important;
  color: #b45309 !important;
  font-size: 0.78rem !important;
}th[data-sort-active="true"] .sort-button {
  background: rgba(254, 226, 226, 0.65) !important;
  border-color: rgba(220, 38, 38, 0.35) !important;
  color: #9f1239 !important;
}th[data-sort-active="true"] .sort-indicator {
  opacity: 1 !important;
  color: #b91c1c !important;
}

@media (max-width: 900px) {
  th {
    font-size: 0.68rem !important;
    letter-spacing: 0.06em !important;
    padding: 0.78rem 0.62rem 0.66rem !important;
  }

  .sort-button {
    padding: 0.18rem 0.28rem !important;
    gap: 0.22rem;
  }
}/* =========================================================
   Table body: consistent Indonesian palette + readability
   ========================================================= */
table {
  min-width: 1340px !important;
  table-layout: fixed;
}th,
td {
  overflow: hidden;
}th:first-child,
td:first-child {
  text-align: center;
}tbody td {
  color: var(--id-text) !important;
  border-bottom: 1px solid rgba(212, 175, 55, 0.28) !important;
  font-size: 0.875rem;
  line-height: 1.45;
}tbody tr:nth-child(odd) {
  background: #ffffff !important;
}tbody tr:nth-child(even) {
  background: #fffdfb !important;
}tbody tr:hover {
  background: linear-gradient(90deg, #fff5f5 0%, #fffbeb 100%) !important;
}.cell-title {
  color: var(--id-text) !important;
  font-weight: 650;
  font-size: 0.94rem;
  letter-spacing: -0.01em;
  white-space: normal;
  overflow-wrap: anywhere;
}.cell-description {
  color: var(--id-text-soft) !important;
}.cell-meta {
  color: var(--id-text-soft) !important;
}.cell-rice {
  color: var(--id-red-700) !important;
  font-variant-numeric: tabular-nums;
}.cell-rice-values {
  color: var(--id-text-soft) !important;
  font-size: 0.8125rem;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}.rice-values-header {
  color: var(--id-gold-700) !important;
  font-weight: 600;
}.countries-badge {
  margin-top: 0.35rem;
}.countries-badge__chip {
  display: inline-flex !important;
  align-items: center;
  gap: 0.25rem;
  padding: 0.22rem 0.55rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--id-red-700) !important;
  background: linear-gradient(180deg, #fff5f5 0%, #fffbeb 100%) !important;
  border: 1px solid rgba(220, 38, 38, 0.22) !important;
}.countries-badge__chip--others {
  color: #78716c !important;
  background: #fafaf9 !important;
  border-color: #e7e5e4 !important;
}.countries-badge--eu .countries-badge__chip {
  color: #1e3a8a !important;
  background: rgba(239, 246, 255, 0.95) !important;
  border-color: rgba(59, 130, 246, 0.45) !important;
}.cell-type-pill:not(.cell-type-icon-wrap) {
  padding: 0.22rem 0.55rem !important;
  background: #fffaf0 !important;
  border: 1px solid var(--id-border) !important;
  color: var(--id-text) !important;
}.cell-type-icon-wrap.cell-type-pill {
  width: 2.25rem;
  height: 2.25rem;
  min-width: 2.25rem;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
  color: var(--id-red-700) !important;
  box-shadow: 0 1px 3px rgba(185, 28, 28, 0.08);
}.cell-type-icon-wrap.cell-type-pill svg {
  color: var(--id-red-700) !important;
  stroke: currentColor;
}.cell-type-icon-wrap.cell-type-pill:hover {
  background: #fff1f2 !important;
  border-color: rgba(185, 28, 28, 0.45) !important;
}.rice-info-btn {
  background: #fff7ed !important;
  border: 1px solid rgba(212, 175, 55, 0.55) !important;
  color: var(--id-gold-700) !important;
  min-width: 1.35rem;
  min-height: 1.35rem;
  font-weight: 700;
}.rice-info-btn:hover {
  background: #fef3c7 !important;
  color: var(--id-red-700) !important;
  border-color: rgba(185, 28, 28, 0.4) !important;
}.rice-popup {
  background: #ffffff !important;
  border: 1px solid var(--id-border) !important;
  color: var(--id-text) !important;
  box-shadow: 0 12px 28px rgba(127, 29, 29, 0.14);
}.rice-popup-label {
  color: var(--id-gold-700) !important;
}.rice-popup-value {
  color: var(--id-text) !important;
}.cell-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0.35rem;
  min-width: 0;
}.cell-actions .btn-secondary {
  width: auto;
  justify-content: center;
  min-height: 34px !important;
  padding: 0.32rem 0.58rem !important;
  font-size: 0.68rem !important;
  font-weight: 650 !important;
  letter-spacing: 0.055em !important;
  border-radius: 8px !important;
  text-transform: uppercase;
  white-space: nowrap;
}.cell-actions:not(.roadmap-row-actions) button[data-action="viewRoadmap"]:not(.roadmap-action-btn) {
  background: linear-gradient(180deg, #ffffff 0%, #fff7f7 100%) !important;
  border: 1px solid rgba(185, 28, 28, 0.35) !important;
  color: var(--id-red-700) !important;
}.cell-actions:not(.roadmap-row-actions) button[data-action="viewRoadmap"]:not(.roadmap-action-btn):hover {
  background: #fff1f2 !important;
  border-color: rgba(185, 28, 28, 0.55) !important;
}.cell-actions:not(.roadmap-row-actions) button[data-action="editRoadmap"]:not(.roadmap-action-btn) {
  background: #fffbeb !important;
  border: 1px solid rgba(212, 175, 55, 0.7) !important;
  color: var(--id-gold-700) !important;
}.cell-actions:not(.roadmap-row-actions) button[data-action="editRoadmap"]:not(.roadmap-action-btn):hover {
  background: #fef3c7 !important;
  color: var(--id-red-700) !important;
}.cell-actions:not(.roadmap-row-actions) button[data-action="deleteRoadmap"]:not(.roadmap-action-btn) {
  background: linear-gradient(180deg, #fef2f2 0%, #fee2e2 100%) !important;
  border: 1px solid rgba(220, 38, 38, 0.45) !important;
  color: #991b1b !important;
}.cell-actions:not(.roadmap-row-actions) button[data-action="deleteRoadmap"]:not(.roadmap-action-btn):hover {
  background: #fecaca !important;
  border-color: rgba(185, 28, 28, 0.65) !important;
  color: #7f1d1d !important;
}html.is-demo-readonly .cell-actions:not(.roadmap-row-actions) button[data-action="editRoadmap"]:not(.roadmap-action-btn):disabled {
  background: #fffbeb !important;
  border: 1px solid rgba(212, 175, 55, 0.5) !important;
  color: #a16207 !important;
  opacity: 0.88 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
}html.is-demo-readonly .cell-actions:not(.roadmap-row-actions) button[data-action="deleteRoadmap"]:not(.roadmap-action-btn):disabled {
  background: linear-gradient(180deg, #fef2f2 0%, #fee2e2 100%) !important;
  border: 1px solid rgba(220, 38, 38, 0.4) !important;
  color: #b91c1c !important;
  opacity: 0.88 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
}html.is-demo-readonly .scrum-board-card-btn--edit:disabled,
html.is-demo-readonly .scrum-board-card-btn--delete:disabled,
html.is-demo-readonly .moscow-board-card-btn--edit:disabled,
html.is-demo-readonly .moscow-board-card-btn--delete:disabled {
  opacity: 0.75 !important;
  cursor: not-allowed !important;
}html.is-demo-readonly tbody .checkbox-input:disabled,
html.is-demo-readonly #selectAllRoadmaps:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}tbody .checkbox-input {
  border-color: rgba(212, 175, 55, 0.75) !important;
  accent-color: var(--id-red-600);
}

@media (max-width: 900px) {
  .cell-actions:not(.roadmap-row-actions) {
    flex-direction: column;
    align-items: stretch;
  }

  .cell-actions:not(.roadmap-row-actions) .btn-secondary {
    width: 100%;
  }
}/* =========================================================
   Hard table synchronization fix (header/body lockstep)
   ========================================================= */
.table-wrapper table {
  width: 100% !important;
  min-width: 1340px !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}.table-wrapper thead tr::before {
  content: none !important;
}.table-wrapper thead th,
.table-wrapper tbody td {
  box-sizing: border-box !important;
}/* Lock each column to same width in header and body */
.table-wrapper thead th:nth-child(1),
.table-wrapper tbody td:nth-child(1) { width: 40px !important; }.table-wrapper thead th:nth-child(2),
.table-wrapper tbody td:nth-child(2) { width: 220px !important; }.table-wrapper thead th:nth-child(3),
.table-wrapper tbody td:nth-child(3) { width: 92px !important; }.table-wrapper thead th:nth-child(4),
.table-wrapper tbody td:nth-child(4) { width: 86px !important; }.table-wrapper thead th:nth-child(5),
.table-wrapper tbody td:nth-child(5) { width: 106px !important; }.table-wrapper thead th:nth-child(6),
.table-wrapper tbody td:nth-child(6) { width: 80px !important; }.table-wrapper thead th:nth-child(7),
.table-wrapper tbody td:nth-child(7) { width: 110px !important; }.table-wrapper thead th:nth-child(8),
.table-wrapper tbody td:nth-child(8) { width: 92px !important; }.table-wrapper thead th:nth-child(9),
.table-wrapper tbody td:nth-child(9) { width: 92px !important; }.table-wrapper thead th:nth-child(10),
.table-wrapper tbody td:nth-child(10) { width: 170px !important; }.table-wrapper thead th:nth-child(11),
.table-wrapper tbody td:nth-child(11) { width: 180px !important; }.table-wrapper thead th:nth-child(12),
.table-wrapper tbody td:nth-child(12) { width: 124px !important; }.table-wrapper thead th {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  vertical-align: middle !important;
  line-height: 1.25 !important;
}.table-wrapper .sort-button {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  border-radius: 6px !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 0.28rem !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}.table-wrapper .sort-button span:first-child {
  display: block;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.2;
}.table-wrapper .sort-indicator {
  display: inline-flex;
  flex: 0 0 auto;
  margin-top: 0 !important;
  margin-left: 0.02rem;
  line-height: 1;
  opacity: 0.42 !important;
  color: #b08a3c !important;
}.table-wrapper .sort-button:hover {
  background: transparent !important;
  border: none !important;
  color: #9f1239 !important;
}.table-wrapper thead th[data-sort-active="true"] .sort-button {
  background: transparent !important;
  border: none !important;
  color: #9f1239 !important;
}.table-wrapper thead th[data-sort-active="true"] .sort-indicator {
  opacity: 1 !important;
  color: #b91c1c !important;
}.table-wrapper .cell-actions:not(.roadmap-row-actions) {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.35rem !important;
  align-items: stretch !important;
}.table-wrapper .cell-actions:not(.roadmap-row-actions) .btn-secondary {
  width: 100% !important;
  min-height: 30px !important;
  padding: 0.28rem 0.45rem !important;
  font-size: 0.66rem !important;
}/* =========================================================
   Profiles panel redesign (modern + user-friendly)
   ========================================================= */
.profiles-panel {
  padding: 1.1rem !important;
  border-radius: 16px !important;
  gap: 0.9rem !important;
}.profiles-panel .card-header {
  margin-bottom: 0.15rem;
}.profiles-panel .card-title {
  font-size: 1.02rem !important;
  letter-spacing: 0.08em !important;
}.profiles-panel .card-caption {
  font-size: 0.95rem !important;
  line-height: 1.45 !important;
  max-width: 28ch;
}.profile-form-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 0.65rem !important;
  align-items: end !important;
  margin-top: 0.1rem;
}.profile-form-field label {
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 0.35rem !important;
}.profile-form-row input {
  min-height: 44px !important;
  border-radius: 10px !important;
  padding: 0.62rem 0.72rem !important;
}.profile-add-btn {
  min-height: 44px !important;
  min-width: 108px !important;
  border-radius: 11px !important;
  padding: 0.58rem 1rem !important;
  font-size: 0.84rem !important;
  letter-spacing: 0.06em !important;
}.profiles-list {
  max-height: 430px !important;
  padding-right: 0.1rem;
  gap: 0.65rem !important;
}.profile-item-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.5rem !important;
  align-items: center !important;
  padding: 0 !important;
}.profile-item-name {
  font-size: 0.97rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  line-height: 1.25;
}.profile-item-meta {
  margin-top: 0.2rem;
  font-size: 0.84rem !important;
}.profile-item-actions {
  display: grid !important;
  grid-auto-flow: column;
  gap: 0.4rem !important;
}.profile-icon-btn {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  border-radius: 10px !important;
}.profile-icon-btn svg {
  width: 16px;
  height: 16px;
}.profile-empty {
  font-size: 0.9rem !important;
  padding: 0.35rem 0.1rem 0.1rem;
}

@media (max-width: 1400px) {
  .profiles-panel {
    padding: 1rem !important;
  }

  .profile-form-row {
    grid-template-columns: 1fr;
    gap: 0.55rem !important;
  }

  .profile-add-btn {
    width: 100%;
  }

  .profiles-list {
    max-height: none !important;
  }
}

@media (max-width: 640px) {
  .profiles-panel .card-title {
    font-size: 0.96rem !important;
  }

  .profiles-panel .card-caption {
    font-size: 0.88rem !important;
    max-width: none;
  }

  .profile-item-row {
    grid-template-columns: 1fr;
    gap: 0.45rem !important;
  }

  .profile-item-actions {
    grid-auto-flow: column;
    justify-content: end;
  }

  .profile-icon-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}/* =========================================================
   Profiles panel v3 (complete UX revamp for side-column)
   ========================================================= */
.profiles-panel.profiles-panel--v2,
.profiles-panel:not(.profiles-panel--v2) {
  padding: 1.2rem !important;
  border-radius: 18px !important;
  border: 1px solid rgba(212, 175, 55, 0.65) !important;
  background: linear-gradient(180deg, #ffffff 0%, #fffdf8 100%) !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}.profiles-panel:not(.profiles-panel--v2) {
  height: 100% !important;
}.profiles-panel.profiles-panel--v2 {
  height: auto !important;
  padding-bottom: 0.55rem !important;
}.profiles-panel .card-header {
  margin-bottom: 0.45rem !important;
}.profiles-panel .card-title {
  font-size: 1.1rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  color: #9f1239 !important;
}.profiles-panel .card-caption {
  font-size: 1rem !important;
  line-height: 1.45 !important;
  color: #7a4b12 !important;
  max-width: none !important;
}/* New approach: reliable vertical form flow in narrow sidebar */
.profile-form-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.55rem !important;
  align-items: stretch !important;
  margin-top: 0.45rem !important;
}.profile-form-field {
  width: 100%;
}.profile-form-field label {
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  margin-bottom: 0.35rem !important;
  color: #8a5b16 !important;
}.profile-form-row input {
  width: 100% !important;
  min-height: 46px !important;
  padding: 0.62rem 0.78rem !important;
  font-size: 1rem !important;
  border-radius: 12px !important;
  border: 1px solid rgba(212, 175, 55, 0.7) !important;
  background: #fff !important;
}.profile-form-row .profile-icon-wrap {
  width: 100%;
}.profile-add-btn {
  width: 100% !important;
  min-height: 48px !important;
  border-radius: 12px !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  justify-content: center !important;
}.profiles-panel--v2 .profiles-list {
  margin-top: 0 !important;
  max-height: min(42vh, 520px) !important;
  flex: 0 0 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  gap: 0.7rem !important;
  padding-right: 0.2rem !important;
}.profile-item-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 0.55rem !important;
  align-items: center !important;
  padding: 0 !important;
}.profile-item-main {
  width: 100%;
  gap: 0.25rem !important;
}.profile-item-name {
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #4a1b26 !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
}.profile-item-meta {
  font-size: 0.88rem !important;
  color: #8a5b16 !important;
  letter-spacing: 0.01em !important;
  text-transform: uppercase;
}.profile-item-actions {
  display: grid !important;
  grid-auto-flow: row !important;
  gap: 0.38rem !important;
  align-content: center;
}.profile-icon-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 11px !important;
  border-width: 1px !important;
  background: #fffaf0 !important;
}.profile-icon-btn--view {
  color: #a16207 !important;
  border-color: rgba(212, 175, 55, 0.75) !important;
  background: #fff9ec !important;
}.profile-icon-btn--edit {
  color: #9f1239 !important;
  border-color: rgba(185, 28, 28, 0.4) !important;
  background: #fff3f3 !important;
}.profile-icon-btn--danger {
  color: #b91c1c !important;
  border-color: rgba(220, 38, 38, 0.45) !important;
  background: #fef2f2 !important;
}.profile-empty {
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
  color: #8a5b16 !important;
}

@media (max-width: 1400px) {
  .profiles-panel {
    padding: 1rem !important;
  }

  .profile-item-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .profile-item-actions {
    grid-auto-flow: column !important;
    justify-content: end;
  }
}/* =========================================================
   Profiles panel v4 polish (integrated action row)
   ========================================================= */
.profile-item-row {
  grid-template-columns: 1fr !important;
  gap: 0.45rem !important;
}.profile-item-actions {
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: 100%;
}.profile-icon-btn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  border-radius: 10px !important;
}.profile-icon-btn svg {
  width: 14px !important;
  height: 14px !important;
}.profiles-list {
  gap: 0.8rem !important;
  padding-right: 0.1rem !important;
}

@media (max-width: 640px) {
  .profile-item-btn {
    min-height: 80px !important;
  }

  .profile-item-actions {
    justify-content: flex-start !important;
    flex-wrap: wrap;
  }

  .profiles-panel {
    height: auto !important;
  }

  .profiles-list {
    flex: 0 0 auto !important;
    overflow: visible !important;
  }
}/* Icon pills in table: replace legacy green/blue with Indonesian tints */
.cell-type-icon-wrap.cell-type-pill[data-type="New Product"] {
  border-color: rgba(185, 28, 28, 0.4) !important;
  background: linear-gradient(180deg, #fff5f5 0%, #fffbeb 100%) !important;
  color: var(--id-red-700) !important;
}.cell-type-icon-wrap.cell-type-pill[data-type="Improvement"] {
  border-color: rgba(212, 175, 55, 0.75) !important;
  background: linear-gradient(180deg, #fffbeb 0%, #fffdf5 100%) !important;
  color: var(--id-gold-700) !important;
}.cell-type-icon-wrap.cell-type-pill[data-type="Tech Debt"] {
  border-color: rgba(185, 28, 28, 0.35) !important;
  background: linear-gradient(180deg, #fef2f2 0%, #fff7ed 100%) !important;
  color: #9f1239 !important;
}.cell-type-icon-wrap.cell-type-pill[data-type="Market Expansion"] {
  border-color: rgba(212, 175, 55, 0.85) !important;
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%) !important;
  color: #a16207 !important;
}.cell-type-icon-wrap.cell-type-pill[data-status="Not Started"] {
  border-color: rgba(212, 175, 55, 0.55) !important;
  background: #fffdf8 !important;
  color: var(--id-text-soft) !important;
}.cell-type-icon-wrap.cell-type-pill[data-status="In Progress"] {
  border-color: rgba(185, 28, 28, 0.45) !important;
  background: #fff1f2 !important;
  color: var(--id-red-700) !important;
}.cell-type-icon-wrap.cell-type-pill[data-status="On Hold"] {
  border-color: rgba(212, 175, 55, 0.75) !important;
  background: #fffbeb !important;
  color: var(--id-gold-700) !important;
}.cell-type-icon-wrap.cell-type-pill[data-status="Done"] {
  border-color: rgba(212, 175, 55, 0.85) !important;
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%) !important;
  color: var(--id-gold-700) !important;
}.cell-type-icon-wrap.cell-type-pill[data-status="Cancelled"] {
  border-color: rgba(185, 28, 28, 0.5) !important;
  background: #fef2f2 !important;
  color: #991b1b !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="custom"] {
  border-color: rgba(148, 163, 184, 0.5) !important;
  background: #f8fafc !important;
  color: #334155 !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="clv"] {
  border-color: rgba(56, 189, 248, 0.5) !important;
  background: #ecfeff !important;
  color: #0e7490 !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="nps"] {
  border-color: rgba(250, 204, 21, 0.55) !important;
  background: #fffbeb !important;
  color: #a16207 !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="risk"] {
  border-color: rgba(251, 113, 133, 0.5) !important;
  background: #fff1f2 !important;
  color: #be123c !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="headcount"] {
  border-color: rgba(167, 139, 250, 0.5) !important;
  background: #f5f3ff !important;
  color: #6d28d9 !important;
}.cell-type-icon-wrap.cell-type-pill[data-framework="operational"] {
  border-color: rgba(52, 211, 153, 0.5) !important;
  background: #ecfdf5 !important;
  color: #047857 !important;
}/* RACI desktop grid — isolate from global portfolio table styles */
.raci-matrix-table-panel .raci-matrix-grid {
  min-width: 0 !important;
  table-layout: auto !important;
}.raci-matrix-grid__row {
  display: grid !important;
  grid-auto-flow: row !important;
}.raci-matrix-grid__cell,
.raci-matrix-grid__cell--roadmap,
.raci-matrix-grid__cell--roadmap:first-child {
  text-align: left !important;
  overflow: visible !important;
}.raci-matrix-grid button.raci-matrix-grid__roadmap-link {
  background: transparent !important;
  color: #9a3412 !important;
  border: none !important;
  border-left: 3px solid rgba(202, 138, 4, 0.5) !important;
  box-shadow: none !important;
  filter: none !important;
}.raci-matrix-grid button.raci-matrix-grid__roadmap-link:hover {
  color: #7c2d12 !important;
  border-left-color: #dc2626 !important;
  background: rgba(255, 247, 237, 0.65) !important;
  filter: none !important;
  box-shadow: none !important;
}.raci-matrix-grid__row--head .raci-matrix-grid__cell {
  background: transparent !important;
}.raci-matrix-grid__row:not(.raci-matrix-grid__row--head) .raci-matrix-grid__cell {
  color: inherit !important;
}.raci-matrix-grid__cell--roadmap {
  box-shadow: 2px 0 6px rgba(127, 29, 29, 0.04);
}/* Unified roadmap modal: bulk edit mode */
#roadmapModal.roadmap-modal--bulk [data-view-only-section],
#roadmapModal.roadmap-modal--bulk .roadmap-modal-section-btn--view-only {
  display: none !important;
}#roadmapModal.roadmap-modal--bulk .form-section-hint {
  color: #92400e;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-field-mode-wrap label {
  font-weight: 600;
  color: #78716c;
}#roadmapModal.roadmap-modal--bulk .roadmap-form--bulk-item-dirty {
  outline: 2px solid rgba(217, 119, 6, 0.22);
  outline-offset: 4px;
  border-radius: 12px;
}#roadmapModal.roadmap-modal--bulk .modal-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding-bottom: 0.85rem;
}#roadmapModal .modal-header-main {
  display: block;
  width: 100%;
}#roadmapModal.roadmap-modal--bulk .modal-title-group {
  min-width: 0;
}#roadmapModal .roadmap-bulk-nav {
  display: none !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav:not([hidden]) {
  --bulk-preview-index: 1;
  --bulk-preview-count: 2;
  display: flex !important;
  flex-direction: column;
  gap: 0.55rem;
  width: 100%;
  max-width: none;
  margin-top: 0.85rem;
  padding: 0.62rem 0.68rem 0.58rem;
  border-radius: 12px;
  border: 1px solid rgba(212, 175, 55, 0.32);
  background: linear-gradient(165deg, rgba(255, 253, 248, 0.98) 0%, rgba(250, 250, 249, 0.98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 1px 3px rgba(63, 15, 25, 0.05);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}#roadmapModal .roadmap-bulk-nav__toolbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}#roadmapModal .roadmap-bulk-nav__field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}#roadmapModal .roadmap-bulk-nav__counter {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.65rem;
  padding: 0.12rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(214, 211, 209, 0.9);
  background: rgba(255, 255, 255, 0.88);
  font-size: 0.68rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: #57534e;
  white-space: nowrap;
}#roadmapModal .roadmap-bulk-nav__counter--dirty {
  border-color: rgba(217, 119, 6, 0.35);
  background: rgba(255, 251, 235, 0.95);
  color: #b45309;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:hover,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:active,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:focus,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:focus-visible,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:disabled {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 2.15rem !important;
  height: 2.15rem !important;
  min-height: 2.15rem !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(214, 211, 209, 0.95) !important;
  background: rgba(255, 255, 255, 0.95) !important;
  color: #44403c !important;
  box-shadow: none !important;
  filter: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  font-weight: 500 !important;
  font-size: inherit !important;
  cursor: pointer !important;
  transform: none !important;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    box-shadow 0.16s ease !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:hover:not(:disabled) {
  background: #fff !important;
  border-color: rgba(161, 98, 7, 0.45) !important;
  color: #7c2d12 !important;
  box-shadow: 0 1px 4px rgba(161, 98, 7, 0.12) !important;
  transform: none !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:focus-visible {
  outline: none !important;
  border-color: rgba(161, 98, 7, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.16) !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:disabled {
  background: #f5f5f4 !important;
  border-color: #e7e5e4 !important;
  color: #d6d3d1 !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}#roadmapModal .roadmap-bulk-nav__select-shell {
  position: relative;
  min-width: 0;
  display: flex;
  align-items: center;
}#roadmapModal .roadmap-bulk-nav__select-chevron {
  position: absolute;
  right: 0.68rem;
  top: 50%;
  transform: translateY(-50%);
  color: #78716c;
  pointer-events: none;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:hover,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:focus,
#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:focus-visible {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 2.15rem !important;
  height: 2.15rem !important;
  padding: 0 1.9rem 0 0.72rem !important;
  border-radius: 10px !important;
  border: 1px solid rgba(214, 211, 209, 0.95) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  background-image: none !important;
  color: #292524 !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  box-shadow: none !important;
  text-overflow: ellipsis;
  transition:
    border-color 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:hover {
  border-color: rgba(161, 98, 7, 0.4) !important;
  background: #fff !important;
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:focus-visible {
  outline: none !important;
  border-color: rgba(161, 98, 7, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.14) !important;
}#roadmapModal .roadmap-bulk-nav__track {
  height: 3px;
  border-radius: 999px;
  background: rgba(245, 245, 244, 0.95);
  overflow: hidden;
}#roadmapModal .roadmap-bulk-nav__track-fill {
  height: 100%;
  width: calc(var(--bulk-preview-index, 1) / var(--bulk-preview-count, 2) * 100%);
  border-radius: inherit;
  background: linear-gradient(90deg, #b91c1c 0%, #dc2626 100%);
  transition: width 0.24s cubic-bezier(0.4, 0, 0.2, 1);
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav--has-edits {
  border-color: rgba(217, 119, 6, 0.38);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 0 0 1px rgba(217, 119, 6, 0.08);
}#roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav--pulse:not([hidden]) {
  animation: roadmapBulkNavPulse 0.24s ease;
}@keyframes roadmapBulkNavPulse {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  45% {
    opacity: 0.9;
    transform: translateY(-1px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}@media (max-width: 720px) {
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav:not([hidden]) {
    margin-top: 0.72rem;
    padding: 0.55rem 0.58rem 0.5rem;
  }

  #roadmapModal .roadmap-bulk-nav__field {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.35rem;
  }

  #roadmapModal .roadmap-bulk-nav__counter {
    justify-self: start;
  }
}@media (max-width: 480px) {
  #roadmapModal .roadmap-bulk-nav__toolbar {
    gap: 0.38rem;
  }

  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:hover,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:active,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:focus,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:focus-visible,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__arrow:disabled {
    width: 2rem !important;
    height: 2rem !important;
    min-height: 2rem !important;
  }

  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:hover,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:focus,
  #roadmapModal.roadmap-modal--bulk .roadmap-bulk-nav__select:focus-visible {
    min-height: 2rem !important;
    height: 2rem !important;
    font-size: 0.78rem !important;
  }
}.filter-autocomplete__dropdown--portaled {
  position: fixed !important;
  z-index: 920 !important;
  pointer-events: auto;
}

/* Visually hidden file input — keeps native picker usable (avoid display:none). */
.sr-only-file-input {
  position: fixed;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  opacity: 0.001;
  z-index: 2147483646;
}

.sr-only-file-input:focus {
  outline: none;
}