:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:light dark;--bg:#f4f6f8;--panel:#fff;--text:#17212b;--accent:#1f6f8b;--danger:#b42318;--border:#d7dde3}
@media(prefers-color-scheme:dark){:root{--bg:#111820;--panel:#1b2530;--text:#edf2f7;--border:#3a4652}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}header{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:max(12px,env(safe-area-inset-top)) 16px 12px;background:var(--accent);color:#fff}button,input,select,textarea{font:inherit;min-height:44px;border:1px solid var(--border);border-radius:10px;padding:9px 12px}button{cursor:pointer}header button{background:transparent;color:#fff;border:0;font-size:1.4rem}nav{position:fixed;inset:0 auto 0 0;width:min(82vw,320px);padding:80px 16px 16px;background:var(--panel);display:none;z-index:4;box-shadow:0 0 24px #0005}nav.open{display:grid;align-content:start;gap:8px}nav button{text-align:left;background:transparent;color:var(--text)}main{max-width:1000px;margin:auto;padding:16px 16px calc(24px + env(safe-area-inset-bottom))}.panel,.card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:12px}.toolbar{display:flex;gap:8px;flex-wrap:wrap}.task-grid{display:grid;grid-template-columns:1fr;gap:12px}.card h2{font-size:1.05rem;margin:.2rem 0}.meta{font-size:.88rem;opacity:.78}.labels{display:flex;gap:6px;flex-wrap:wrap}.label{padding:3px 7px;border-radius:999px;border:1px solid var(--border);font-size:.8rem}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.danger{color:var(--danger)}form{display:grid;gap:12px}label{display:grid;gap:5px}.offline{position:fixed;bottom:0;left:0;right:0;z-index:10;padding:8px;text-align:center;background:#8a4b00;color:#fff}.error{border-left:5px solid var(--danger)}@media(min-width:760px){#menuButton{display:none}nav{display:grid;position:fixed;top:56px;width:220px;box-shadow:none;border-right:1px solid var(--border)}main{margin-left:220px}.task-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.board-card {
	cursor: pointer;
	transition: transform 120ms ease, box-shadow 120ms ease;
}

.board-card:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 14px #0002;
}

.board-card:focus-visible {
	outline: 3px solid var(--accent);
	outline-offset: 3px;
}

.board-view {
	max-width: none;
}

.board-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.board-summary {
	color: #55616f;
	font-size: 0.95rem;
}

.board-columns {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(280px, 340px);
	gap: 1rem;
	align-items: start;
	overflow-x: auto;
	padding: 0.25rem 0.25rem 1rem;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
}

.board-column {
	min-height: 180px;
	padding: 0.8rem;
	border: 1px solid #d8e0e7;
	border-radius: 14px;
	background: #f7f9fb;
	scroll-snap-align: start;
}

.board-column-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-bottom: 0.8rem;
}

.board-column-header h2 {
	margin: 0;
	font-size: 1.05rem;
}

.board-column-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.8rem;
	height: 1.8rem;
	padding: 0 0.45rem;
	border-radius: 999px;
	background: #e5ebf0;
	font-size: 0.85rem;
	font-weight: 600;
}

.board-column-cards {
	display: grid;
	gap: 0.75rem;
}

.board-column-cards .card {
	margin: 0;
	background: #fff;
}

.empty-stack {
	margin: 0;
	padding: 1rem;
	text-align: center;
	color: #687583;
	border: 1px dashed #c7d0d9;
	border-radius: 10px;
	background: #fff;
}

@media (max-width: 700px) {
	.board-toolbar {
		align-items: stretch;
		flex-direction: column;
	}

	.board-toolbar button {
		width: 100%;
	}

	.board-columns {
		grid-auto-columns: minmax(84vw, 84vw);
	}

	.board-column {
		min-height: 140px;
	}
}