/* ===================================================================== */
/* Dungeon tracker — board, cards, notes                                  */
/* ===================================================================== */

.tracker-toolbar {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex-wrap: wrap;
	margin-bottom: 1rem;
}
.tracker-toolbar .spacer { flex: 1 1 auto; }

/* ---- Kanban board --------------------------------------------------- */
.board {
	display: grid;
	grid-template-columns: repeat(5, minmax(220px, 1fr));
	gap: .75rem;
	align-items: start;
}
.board-col {
	background: #f4f5f7;
	border-radius: 8px;
	padding: .5rem;
	min-height: 120px;
	transition: background .12s ease, outline-color .12s ease;
	outline: 2px dashed transparent;
}
.board-col.drag-over {
	background: #e9effd;
	outline-color: #0d6efd;
}
.board-col-head {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-weight: 600;
	font-size: .85rem;
	text-transform: uppercase;
	letter-spacing: .03em;
	padding: .25rem .35rem .5rem;
	color: #42526e;
}
.board-col-head .dot {
	width: 10px; height: 10px; border-radius: 50%;
}
.board-col-head .count {
	margin-left: auto;
	background: #dfe1e6;
	color: #42526e;
	border-radius: 10px;
	padding: 0 .5rem;
	font-size: .75rem;
}

/* ---- Cards ---------------------------------------------------------- */
.card-item {
	background: #fff;
	border-radius: 6px;
	border-left: 4px solid #ccc;
	box-shadow: 0 1px 2px rgba(9,30,66,.18);
	padding: .5rem .6rem;
	margin-bottom: .5rem;
	cursor: grab;
	user-select: none;
}
.card-item:active { cursor: grabbing; }
.card-item .card-title {
	font-size: .9rem;
	line-height: 1.25;
	margin-bottom: .35rem;
}
.card-meta {
	display: flex;
	align-items: center;
	gap: .35rem;
	flex-wrap: wrap;
	font-size: .72rem;
	color: #6b778c;
}
.epic-chip {
	color: #fff;
	border-radius: 3px;
	padding: 0 .4rem;
	font-weight: 600;
	font-size: .68rem;
}
.key-chip {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	color: #42526e;
}
.subtask-of {
	color: #8993a4;
	font-style: italic;
}
.git-chip {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	background: #eef1f5;
	border-radius: 3px;
	padding: 0 .35rem;
	color: #42526e;
	text-decoration: none;
}
.git-chip:hover { background: #e2e8f0; }

/* ---- Dashboard tiles ------------------------------------------------ */
.tiles { display: flex; gap: .75rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.tile {
	background: #fff;
	border: 1px solid #ebecf0;
	border-radius: 8px;
	padding: .75rem 1rem;
	min-width: 130px;
}
.tile .n { font-size: 1.6rem; font-weight: 700; line-height: 1; }
.tile .l { font-size: .78rem; color: #6b778c; text-transform: uppercase; letter-spacing: .03em; }

/* ---- Backlog list --------------------------------------------------- */
.backlog-epic { margin-bottom: 1.5rem; }
.backlog-epic h3 { font-size: 1.05rem; display: flex; align-items: center; gap: .5rem; }
.backlog-row {
	display: flex; align-items: center; gap: .6rem;
	padding: .4rem .5rem; border-bottom: 1px solid #f0f1f3;
}
.backlog-row.sub { padding-left: 2rem; }
.status-pill {
	font-size: .7rem; color: #fff; border-radius: 10px; padding: .05rem .55rem; white-space: nowrap;
}

/* ---- Notes ---------------------------------------------------------- */
.note-card {
	background: #fff; border: 1px solid #ebecf0; border-radius: 8px;
	padding: .75rem 1rem; margin-bottom: .75rem;
}
.note-card h4 { font-size: 1rem; margin-bottom: .35rem; }
.note-body :is(p, ul, ol) { margin-bottom: .4rem; }

/* ---- Simple modal --------------------------------------------------- */
.modal-backdrop-x {
	position: fixed; inset: 0; background: rgba(9,30,66,.45);
	display: flex; align-items: flex-start; justify-content: center;
	padding-top: 6vh; z-index: 1050;
}
.modal-x {
	background: #fff; border-radius: 8px; width: min(560px, 92vw);
	box-shadow: 0 8px 30px rgba(9,30,66,.3); padding: 1.25rem;
}
.modal-x h3 { margin-bottom: 1rem; }