diff --git a/apps/web/src/styles.css b/apps/web/src/styles.css
deleted file mode 100644
index 288b5a9..0000000
--- a/apps/web/src/styles.css
+++ /dev/null
@@ -1,5683 +0,0 @@
-:root {
-	color-scheme: light;
-	font-family: "Inter", "IBM Plex Sans", "Segoe UI", sans-serif;
-	--bg: #f4f1ea;
-	--panel: #fffef9;
-	--ink: #1d1d1b;
-	--muted: #5f5b55;
-	--brand: #275d4b;
-	--brand-strong: #154236;
-	--border: #d8d0c5;
-	--primary: #275d4b;
-	--primary-fg: #fffef9;
-	--color-primary: #275d4b;
-	--success: #2f8f62;
-	--success-light: rgba(47, 143, 98, 0.14);
-	--warning: #c08a1e;
-	--warning-light: rgba(192, 138, 30, 0.14);
-	--danger: #b94a3c;
-	--danger-light: rgba(185, 74, 60, 0.14);
-	--info: #4f7fb8;
-	--info-light: rgba(79, 127, 184, 0.14);
-
-	/* Spacing Scale (4px base) */
-	--space-1: 0.25rem;
-	--space-2: 0.5rem;
-	--space-3: 0.75rem;
-	--space-4: 1rem;
-	--space-5: 1.5rem;
-	--space-6: 2rem;
-	--space-8: 3rem;
-	--space-10: 4rem;
-
-	/* Breakpoints */
-	--bp-sm: 480px;
-	--bp-md: 768px;
-	--bp-lg: 1024px;
-	--bp-xl: 1280px;
-
-	/* Fluid Typography */
-	--font-size-xs: clamp(0.625rem, 0.6rem + 0.125vw, 0.75rem);
-	--font-size-sm: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
-	--font-size-base: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
-	--font-size-lg: clamp(1rem, 0.9rem + 0.5vw, 1.25rem);
-	--font-size-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);
-	--font-size-2xl: clamp(1.5rem, 1.3rem + 1vw, 2rem);
-}
-
-[data-theme="dark"] {
-	color-scheme: dark;
-	--bg: #171613;
-	--panel: #22201d;
-	--ink: #ece7df;
-	--muted: #a59d92;
-	--brand: #5fa889;
-	--brand-strong: #4d9175;
-	--border: #39342d;
-	--primary: #5fa889;
-	--primary-fg: #171613;
-	--color-primary: #5fa889;
-	--success: #22c55e;
-	--success-light: rgba(34, 197, 94, 0.15);
-	--warning: #f59e0b;
-	--warning-light: rgba(245, 158, 11, 0.15);
-	--danger: #ef4444;
-	--danger-light: rgba(239, 68, 68, 0.15);
-	--info: #3b82f6;
-	--info-light: rgba(59, 130, 246, 0.15);
-}
-
-* {
-	box-sizing: border-box;
-}
-
-body {
-	margin: 0;
-	background: var(--bg);
-	color: var(--ink);
-}
-
-html.terminal-page-open,
-body.terminal-page-open {
-	overflow: hidden;
-}
-
-[data-theme="dark"] body {
-	background: radial-gradient(circle at top right, #2a2520, var(--bg));
-}
-
-a {
-	color: inherit;
-	text-decoration: none;
-}
-
-.shell {
-	min-height: 100vh;
-	display: flex;
-	flex-direction: column;
-}
-
-.shell-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 0.85rem 1.25rem;
-	border-bottom: 1px solid var(--border);
-	background: color-mix(in srgb, var(--panel) 88%, transparent);
-	backdrop-filter: blur(7px);
-}
-
-[data-theme="dark"] .shell-header {
-	background: color-mix(in srgb, var(--panel) 88%, transparent);
-}
-
-.brand {
-	font-weight: 700;
-	letter-spacing: 0.02em;
-}
-
-.header-actions {
-	display: flex;
-	align-items: center;
-	gap: 0.75rem;
-}
-
-.shell-body {
-	display: grid;
-	grid-template-columns: 230px 1fr;
-	height: calc(100vh - 57px);
-	flex: 1;
-}
-
-.shell-nav {
-	border-right: 1px solid var(--border);
-	padding: 1rem 0.75rem;
-	display: flex;
-	flex-direction: column;
-	gap: 0.4rem;
-	background: color-mix(in srgb, var(--panel) 65%, transparent);
-}
-
-.nav-item {
-	padding: 0.65rem 0.75rem;
-	border-radius: 10px;
-	color: var(--muted);
-}
-
-.nav-item:hover {
-	background: #ece7df;
-	color: var(--ink);
-}
-
-.nav-item-active {
-	background: var(--brand);
-	color: #f7fff7;
-}
-
-.nav-section-title {
-	margin-top: 0.5rem;
-	padding: 0.25rem 0.75rem;
-	font-size: var(--font-size-xs);
-	text-transform: uppercase;
-	letter-spacing: 0.08em;
-	color: var(--muted);
-}
-
-.nav-divider {
-	height: 1px;
-	background: var(--border);
-	margin: 0.5rem 0;
-}
-
-.shell-content {
-	padding: 1.25rem;
-	overflow-x: hidden;
-	display: flex;
-	flex-direction: column;
-	min-height: 0;
-	height: 100%;
-}
-
-.eyebrow {
-	margin: 0;
-	font-size: var(--font-size-xs);
-	text-transform: uppercase;
-	letter-spacing: 0.08em;
-	color: var(--muted);
-}
-
-.home-page,
-.settings-page {
-	max-width: 1240px;
-}
-
-.home-hero {
-	display: flex;
-	justify-content: space-between;
-	gap: var(--space-4);
-	align-items: flex-start;
-}
-
-.home-hero-actions {
-	display: flex;
-	gap: var(--space-2);
-	flex-wrap: wrap;
-}
-
-.home-summary-grid,
-.home-project-grid,
-.home-session-grid {
-	display: grid;
-	gap: var(--space-4);
-}
-
-.home-summary-grid {
-	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
-}
-
-.home-project-grid,
-.home-session-grid {
-	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
-}
-
-.home-section h2,
-.settings-header h1,
-.settings-panel h2 {
-	margin: 0;
-}
-
-.home-section h3,
-.home-section p {
-	margin: 0;
-}
-
-.row-tight {
-	gap: var(--space-2);
-}
-
-.settings-tabs {
-	display: flex;
-	gap: var(--space-2);
-	flex-wrap: wrap;
-}
-
-.settings-tab {
-	padding: 0.6rem 0.9rem;
-	border-radius: 999px;
-	border: 1px solid var(--border);
-	color: var(--muted);
-	background: var(--panel);
-}
-
-.settings-tab.active {
-	background: var(--brand);
-	color: white;
-	border-color: transparent;
-}
-
-.settings-panel {
-	padding: 1.5rem;
-}
-
-.settings-actions,
-.form-actions {
-	display: flex;
-	gap: var(--space-3);
-	align-items: center;
-	flex-wrap: wrap;
-}
-
-.error-text {
-	color: var(--danger);
-}
-
-.success-text {
-	color: var(--success);
-}
-
-.small {
-	padding: 0.42rem 0.7rem;
-	min-height: 38px;
-}
-
-.session-card,
-.project-card,
-.recent-session-item {
-	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02);
-}
-
-/* Responsive Shell */
-@media (max-width: 767px) {
-	.shell-body {
-		grid-template-columns: 1fr;
-		grid-template-rows: auto 1fr;
-	}
-
-	.shell-nav {
-		flex-direction: row;
-		flex-wrap: wrap;
-		gap: 0.25rem;
-		padding: 0.5rem;
-		border-right: none;
-		border-bottom: 1px solid var(--border);
-		overflow-x: auto;
-		-webkit-overflow-scrolling: touch;
-	}
-
-	.nav-item {
-		padding: 0.5rem 0.75rem;
-		white-space: nowrap;
-		font-size: var(--font-size-sm);
-	}
-
-	.shell-content {
-		padding: var(--space-4);
-		height: 100%;
-	}
-}
-
-.stack {
-	display: flex;
-	flex-direction: column;
-	gap: 1rem;
-}
-
-.muted {
-	color: var(--muted);
-}
-
-.card-grid {
-	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
-	gap: var(--space-4);
-}
-
-@media (min-width: 768px) {
-	.card-grid {
-		grid-template-columns: repeat(2, minmax(0, 1fr));
-	}
-}
-
-@media (min-width: 1024px) {
-	.card-grid {
-		grid-template-columns: repeat(3, minmax(0, 1fr));
-	}
-}
-
-.card {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	padding: 1rem;
-}
-
-.card-label {
-	margin: 0;
-	color: var(--muted);
-}
-
-.card-value {
-	margin: 0.45rem 0 0;
-	font-size: 1.6rem;
-	font-weight: 700;
-}
-
-.quick-actions {
-	display: flex;
-	gap: 0.6rem;
-}
-
-.primary-button,
-.secondary-button,
-.ghost-button {
-	border-radius: 10px;
-	border: 1px solid transparent;
-	padding: 0.58rem 0.85rem;
-	cursor: pointer;
-	font: inherit;
-}
-
-.primary-button {
-	background: var(--brand);
-	color: white;
-}
-
-.primary-button:hover {
-	background: var(--brand-strong);
-}
-
-.secondary-button {
-	border-color: var(--border);
-	background: var(--panel);
-}
-
-.ghost-button {
-	border-color: var(--border);
-	background: transparent;
-}
-
-.user-chip {
-	border: 1px solid var(--border);
-	background: var(--panel);
-	border-radius: 999px;
-	padding: 0.35rem 0.7rem;
-	font-size: 0.9rem;
-}
-
-.center-screen {
-	min-height: 55vh;
-	display: grid;
-	place-content: center;
-	text-align: center;
-}
-
-.page-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	flex-wrap: wrap;
-	gap: var(--space-3);
-}
-
-@media (max-width: 767px) {
-	.page-header {
-		flex-direction: column;
-		align-items: flex-start;
-	}
-}
-
-.project-list {
-	display: flex;
-	flex-direction: column;
-	gap: 0.75rem;
-}
-
-.project-card {
-	display: flex;
-	justify-content: space-between;
-	align-items: flex-start;
-	gap: 1rem;
-}
-
-.project-info h3 {
-	margin: 0 0 0.35rem;
-}
-
-.project-info p {
-	margin: 0;
-}
-
-.project-actions {
-	display: flex;
-	gap: 0.5rem;
-	align-items: center;
-	flex-shrink: 0;
-}
-
-.delete-confirm {
-	display: flex;
-	gap: 0.5rem;
-	align-items: center;
-}
-
-.danger-button {
-	border-radius: 10px;
-	border: 1px solid transparent;
-	padding: 0.58rem 0.85rem;
-	cursor: pointer;
-	font: inherit;
-	background: #b91c1c;
-	color: white;
-}
-
-.danger-text {
-	color: #b91c1c;
-}
-
-.error-text {
-	color: #b91c1c;
-	margin: 0;
-}
-
-.dialog-overlay {
-	position: fixed;
-	inset: 0;
-	background: rgba(0, 0, 0, 0.35);
-	display: grid;
-	place-content: center;
-	z-index: 50;
-}
-
-.dialog {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	padding: var(--space-5);
-	width: min(560px, 100vw - 2rem);
-	max-height: min(800px, 100vh - 2rem);
-	overflow-y: auto;
-}
-
-.dialog-lg {
-	width: min(800px, 100vw - 2rem);
-}
-
-@media (max-width: 767px) {
-	.dialog {
-		width: 100vw;
-		height: 100vh;
-		max-height: 100vh;
-		border-radius: 0;
-		padding: var(--space-4);
-	}
-
-	.dialog-overlay {
-		padding: 0;
-	}
-}
-
-.dialog h2 {
-	margin: 0 0 1rem;
-}
-
-.form-field {
-	display: flex;
-	flex-direction: column;
-	gap: 0.35rem;
-}
-
-.form-field input,
-.form-field textarea,
-.form-field select {
-	padding: 0.55rem 0.7rem;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	font: inherit;
-	background: var(--panel);
-	color: var(--ink);
-}
-
-.dialog-actions {
-	display: flex;
-	justify-content: flex-end;
-	gap: 0.6rem;
-}
-
-.keys-list {
-	display: flex;
-	flex-direction: column;
-	gap: 0.75rem;
-}
-
-.key-card {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	padding: 1rem;
-}
-
-.key-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	margin-bottom: 0.5rem;
-}
-
-.key-header h3 {
-	margin: 0;
-}
-
-.key-meta {
-	margin-bottom: 0.75rem;
-}
-
-.key-public {
-	display: flex;
-	align-items: center;
-	gap: 0.75rem;
-	padding: 0.5rem;
-	background: #f5f3ee;
-	border-radius: 8px;
-}
-
-.key-public code {
-	font-size: 0.85rem;
-	word-break: break-all;
-	flex: 1;
-}
-
-.form-group {
-	display: flex;
-	flex-direction: column;
-	gap: 0.35rem;
-}
-
-.form-group input {
-	padding: 0.55rem 0.7rem;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	font: inherit;
-}
-
-.error {
-	color: #b91c1c;
-	padding: 0.75rem;
-	background: #fef2f2;
-	border-radius: 10px;
-}
-
-@media (max-width: 860px) {
-	.shell-body {
-		grid-template-columns: 1fr;
-	}
-
-	.shell-nav {
-		flex-direction: row;
-		overflow-x: auto;
-		border-right: 0;
-		border-bottom: 1px solid var(--border);
-	}
-
-	.card-grid {
-		grid-template-columns: 1fr;
-	}
-
-	.quick-actions {
-		flex-direction: column;
-	}
-
-	.project-card {
-		flex-direction: column;
-	}
-}
-
-/* URL Validation Styles */
-.valid-url {
-	border-color: var(--success, #16a34a) !important;
-	background-color: var(--success-light, #f0fdf4) !important;
-}
-
-.needs-parsing-url {
-	border-color: var(--warning, #ca8a04) !important;
-	background-color: var(--warning-light, #fefce8) !important;
-}
-
-.invalid-url {
-	border-color: var(--danger, #dc2626) !important;
-	background-color: var(--danger-light, #fef2f2) !important;
-}
-
-.validation-status {
-	font-size: 0.85rem;
-	margin-top: 0.25rem;
-	display: block;
-}
-
-.validation-status.valid {
-	color: var(--success, #16a34a);
-}
-
-.validation-status.warning {
-	color: var(--warning, #ca8a04);
-}
-
-.validation-status.invalid {
-	color: #dc2626;
-}
-
-.validation-status.validating {
-	color: var(--muted);
-}
-
-.url-suggestion {
-	margin-top: 0.5rem;
-	padding: 0.5rem;
-	background: #fefce8;
-	border-radius: 8px;
-	border: 1px solid #fde047;
-}
-
-.suggestion-actions {
-	display: flex;
-	align-items: center;
-	gap: 0.75rem;
-	margin-top: 0.35rem;
-}
-
-.suggested-url {
-	font-size: 0.85rem;
-	color: #854d0e;
-	flex: 1;
-	word-break: break-all;
-}
-
-.secondary-button.small {
-	padding: 0.35rem 0.6rem;
-	font-size: 0.85rem;
-}
-
-/* Git History Page Styles */
-.history-actions {
-	display: flex;
-	gap: 0.75rem;
-	align-items: center;
-}
-
-.branch-selector {
-	padding: 0.45rem 0.7rem;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	font: inherit;
-	background: var(--panel);
-	color: var(--ink);
-}
-
-.history-container {
-	display: grid;
-	grid-template-columns: 1fr;
-	gap: 1rem;
-	min-height: 60vh;
-}
-
-.commit-list {
-	display: flex;
-	flex-direction: column;
-	gap: 0.5rem;
-	overflow-y: auto;
-	max-height: 70vh;
-}
-
-.commit-list.with-detail {
-	grid-column: 1;
-}
-
-.commit-item {
-	display: flex;
-	gap: 0.75rem;
-	padding: 0.75rem;
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	cursor: pointer;
-	transition: background-color 0.15s ease;
-}
-
-.commit-item:hover {
-	background: #ece7df;
-}
-
-.commit-item.selected {
-	border-color: var(--brand);
-	background: #f0f7f4;
-}
-
-.commit-graph {
-	font-family: monospace;
-	font-size: 0.9rem;
-	color: var(--brand);
-	white-space: pre;
-	flex-shrink: 0;
-	min-width: 60px;
-}
-
-.graph-line {
-	display: inline-block;
-}
-
-.commit-content {
-	flex: 1;
-	min-width: 0;
-}
-
-.commit-header {
-	display: flex;
-	gap: 0.5rem;
-	align-items: center;
-	margin-bottom: 0.35rem;
-}
-
-.commit-hash {
-	font-family: monospace;
-	font-size: 0.85rem;
-	color: var(--brand);
-	background: #f0f7f4;
-	padding: 0.15rem 0.4rem;
-	border-radius: 6px;
-}
-
-.commit-refs {
-	display: flex;
-	gap: 0.35rem;
-	flex-wrap: wrap;
-}
-
-.ref-tag {
-	font-size: 0.75rem;
-	padding: 0.15rem 0.4rem;
-	background: var(--brand);
-	color: white;
-	border-radius: 999px;
-}
-
-.commit-message {
-	margin: 0 0 0.35rem;
-	font-weight: 500;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.commit-meta {
-	display: flex;
-	gap: 0.75rem;
-	font-size: 0.85rem;
-	color: var(--muted);
-}
-
-.commit-detail-panel {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	padding: 1.25rem;
-	overflow-y: auto;
-	max-height: 70vh;
-}
-
-.detail-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	margin-bottom: 1rem;
-	padding-bottom: 0.75rem;
-	border-bottom: 1px solid var(--border);
-}
-
-.detail-header h3 {
-	margin: 0;
-}
-
-.detail-content {
-	display: flex;
-	flex-direction: column;
-	gap: 1.25rem;
-}
-
-.detail-section {
-	display: flex;
-	flex-direction: column;
-	gap: 0.35rem;
-}
-
-.detail-section h4 {
-	margin: 0 0 0.5rem;
-	color: var(--muted);
-	font-size: 0.9rem;
-	text-transform: uppercase;
-	letter-spacing: 0.05em;
-}
-
-.commit-hash-full {
-	font-family: monospace;
-	font-size: 0.85rem;
-	color: var(--brand);
-	margin: 0;
-}
-
-.commit-message-full {
-	margin: 0.5rem 0 0;
-	line-height: 1.5;
-	white-space: pre-wrap;
-}
-
-.stats-grid {
-	display: grid;
-	grid-template-columns: repeat(3, 1fr);
-	gap: 0.75rem;
-}
-
-.stat {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	padding: 0.75rem;
-	background: #f5f3ee;
-	border-radius: 10px;
-}
-
-.stat.additions {
-	background: #f0fdf4;
-}
-
-.stat.deletions {
-	background: #fef2f2;
-}
-
-.stat-value {
-	font-size: 1.25rem;
-	font-weight: 700;
-	color: var(--ink);
-}
-
-.stat.additions .stat-value {
-	color: #16a34a;
-}
-
-.stat.deletions .stat-value {
-	color: #dc2626;
-}
-
-.stat-label {
-	font-size: 0.8rem;
-	color: var(--muted);
-}
-
-.parent-list {
-	display: flex;
-	gap: 0.5rem;
-	flex-wrap: wrap;
-}
-
-.parent-hash {
-	font-family: monospace;
-	font-size: 0.85rem;
-	padding: 0.2rem 0.5rem;
-	background: #f5f3ee;
-	border-radius: 6px;
-}
-
-.diff-content {
-	font-family: monospace;
-	font-size: 0.8rem;
-	line-height: 1.5;
-	background: #f5f3ee;
-	padding: 0.75rem;
-	border-radius: 10px;
-	overflow-x: auto;
-	white-space: pre-wrap;
-	word-break: break-all;
-}
-
-@media (min-width: 1024px) {
-	.history-container {
-		grid-template-columns: 1fr 400px;
-	}
-
-	.commit-list.with-detail {
-		grid-column: 1;
-	}
-
-	.commit-detail-panel {
-		grid-column: 2;
-		position: sticky;
-		top: 1rem;
-	}
-}
-
-/* Repository Workspace */
-.repo-workspace {
-	display: flex;
-	flex-direction: column;
-	height: calc(100vh - 60px);
-	overflow: hidden;
-}
-
-.workspace-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 1rem 1.5rem;
-	border-bottom: 1px solid var(--border);
-	background: var(--panel);
-}
-
-.workspace-header-left {
-	display: flex;
-	align-items: center;
-	gap: 0.75rem;
-}
-
-.workspace-header-icon {
-	font-size: 1.5rem;
-}
-
-.workspace-header-info {
-	display: flex;
-	flex-direction: column;
-	gap: 0.25rem;
-}
-
-.workspace-header-title {
-	margin: 0;
-	font-size: 1.25rem;
-	font-weight: 600;
-}
-
-.workspace-header-subtitle {
-	color: var(--muted);
-	font-size: 0.875rem;
-}
-
-.workspace-header-actions {
-	display: flex;
-	gap: 0.5rem;
-}
-
-.workspace-header-action-btn {
-	display: flex;
-	align-items: center;
-	gap: 0.5rem;
-	padding: 0.5rem 1rem;
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	background: var(--panel);
-	color: var(--ink);
-	font-size: 0.875rem;
-	cursor: pointer;
-	transition: all 0.2s;
-}
-
-.workspace-header-action-btn:hover {
-	background: var(--bg);
-	border-color: var(--brand);
-}
-
-.workspace-title {
-	display: flex;
-	align-items: center;
-	gap: 1rem;
-}
-
-.workspace-title h1 {
-	margin: 0;
-	font-size: 1.25rem;
-}
-
-.repo-name {
-	color: var(--muted);
-	font-size: 0.875rem;
-}
-
-.workspace-layout {
-	display: flex;
-	flex: 1;
-	overflow: hidden;
-}
-
-.workspace-sidebar {
-	width: 280px;
-	min-width: 280px;
-	border-right: 1px solid var(--border);
-	background: var(--panel);
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-}
-
-@media (max-width: 767px) {
-	.workspace-layout {
-		flex-direction: column;
-	}
-
-	.workspace-sidebar {
-		width: 100%;
-		min-width: auto;
-		max-height: 40vh;
-		border-right: none;
-		border-bottom: 1px solid var(--border);
-	}
-
-	.workspace-header {
-		flex-direction: column;
-		gap: var(--space-3);
-		align-items: flex-start;
-		padding: var(--space-4);
-	}
-
-	.workspace-header-actions {
-		width: 100%;
-		flex-wrap: wrap;
-	}
-}
-
-.sidebar-section {
-	padding: 1rem;
-	border-bottom: 1px solid var(--border);
-}
-
-.sidebar-section label {
-	margin: 0;
-}
-
-.workspace-main {
-	flex: 1;
-	overflow: hidden;
-	padding: 1rem;
-	background: var(--bg);
-	display: flex;
-	flex-direction: column;
-}
-
-/* File Tree */
-.file-tree {
-	flex: 1;
-	overflow: auto;
-	padding: 0.5rem;
-}
-
-.tree-entry {
-	display: block;
-	width: 100%;
-	padding: 0.375rem 0.5rem;
-	border: none;
-	background: none;
-	color: var(--ink);
-	text-align: left;
-	cursor: pointer;
-	border-radius: 4px;
-	font-size: 0.875rem;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.tree-entry:hover {
-	background: var(--bg);
-}
-
-.tree-directory {
-	font-weight: 500;
-}
-
-.tree-up {
-	color: var(--muted);
-	font-style: italic;
-}
-
-/* File Viewer */
-.file-viewer {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	overflow: hidden;
-}
-
-.file-viewer-header {
-	padding: 0.75rem 1rem;
-	border-bottom: 1px solid var(--border);
-	background: var(--bg);
-}
-
-.file-breadcrumbs {
-	font-size: 0.875rem;
-	font-family: monospace;
-}
-
-.breadcrumb-sep {
-	color: var(--muted);
-	margin: 0 0.25rem;
-}
-
-.file-content {
-	padding: 1rem;
-	overflow: auto;
-	max-height: calc(100vh - 200px);
-}
-
-.file-content pre {
-	margin: 0;
-	font-family: "IBM Plex Mono", monospace;
-	font-size: 0.875rem;
-	line-height: 1.5;
-	white-space: pre-wrap;
-	word-wrap: break-word;
-}
-
-.file-viewer-empty {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	height: 100%;
-	min-height: 300px;
-}
-
-/* File Status Indicators */
-.file-status-indicator {
-	float: right;
-	font-size: 0.75rem;
-	font-weight: bold;
-	padding: 0 0.375rem;
-	border-radius: 3px;
-	margin-left: 0.5rem;
-}
-
-.file-status-indicator.modified {
-	color: #f59e0b;
-	background: rgba(245, 158, 11, 0.1);
-}
-
-.file-status-indicator.added {
-	color: #10b981;
-	background: rgba(16, 185, 129, 0.1);
-}
-
-.file-status-indicator.deleted {
-	color: #ef4444;
-	background: rgba(239, 68, 68, 0.1);
-}
-
-.file-status-indicator.untracked {
-	color: #6b7280;
-	background: rgba(107, 114, 128, 0.1);
-}
-
-/* Commit Panel */
-.commit-panel {
-	padding: 1rem;
-	border-top: 1px solid var(--border);
-	background: var(--panel);
-}
-
-.commit-panel h4 {
-	margin: 0 0 0.5rem 0;
-	font-size: 0.875rem;
-	font-weight: 600;
-}
-
-.file-list {
-	max-height: 150px;
-	overflow: auto;
-	margin-bottom: 0.75rem;
-}
-
-.file-item {
-	display: flex;
-	align-items: center;
-	gap: 0.5rem;
-	padding: 0.25rem 0;
-	font-size: 0.8125rem;
-}
-
-.file-status {
-	font-weight: bold;
-	font-size: 0.75rem;
-	width: 1rem;
-	text-align: center;
-}
-
-.file-item.modified .file-status {
-	color: #f59e0b;
-}
-.file-item.added .file-status {
-	color: #10b981;
-}
-.file-item.deleted .file-status {
-	color: #ef4444;
-}
-.file-item.untracked .file-status {
-	color: #6b7280;
-}
-
-.commit-form {
-	display: flex;
-	flex-direction: column;
-	gap: 0.5rem;
-}
-
-.commit-message-input {
-	width: 100%;
-	padding: 0.5rem;
-	border: 1px solid var(--border);
-	border-radius: 4px;
-	background: var(--bg);
-	color: var(--ink);
-	font-family: inherit;
-	font-size: 0.875rem;
-	resize: vertical;
-}
-
-.commit-button {
-	padding: 0.5rem 1rem;
-	background: var(--primary);
-	color: white;
-	border: none;
-	border-radius: 4px;
-	cursor: pointer;
-	font-size: 0.875rem;
-	font-weight: 500;
-}
-
-.commit-button:disabled {
-	opacity: 0.5;
-	cursor: not-allowed;
-}
-
-.commit-error {
-	color: #ef4444;
-	font-size: 0.8125rem;
-}
-
-/* Modal Styles */
-.modal-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.5);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	z-index: 1000;
-}
-
-.modal-content {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	padding: 1.5rem;
-	min-width: 400px;
-	max-width: 600px;
-	max-height: 80vh;
-	overflow: auto;
-}
-
-.modal-content h2 {
-	margin: 0 0 1rem 0;
-	font-size: 1.25rem;
-}
-
-.modal-actions {
-	display: flex;
-	justify-content: flex-end;
-	gap: 0.75rem;
-	margin-top: 1.5rem;
-}
-
-/* Merge Dialog */
-.merge-form {
-	display: flex;
-	flex-direction: column;
-	gap: 1rem;
-}
-
-.merge-form .form-field {
-	display: flex;
-	flex-direction: column;
-	gap: 0.375rem;
-}
-
-.merge-form label {
-	font-size: 0.875rem;
-	font-weight: 500;
-}
-
-.merge-form select,
-.merge-form input,
-.merge-form textarea {
-	padding: 0.5rem;
-	border: 1px solid var(--border);
-	border-radius: 4px;
-	background: var(--bg);
-	color: var(--ink);
-	font-family: inherit;
-	font-size: 0.875rem;
-}
-
-.merge-form textarea {
-	resize: vertical;
-}
-
-.input-disabled {
-	opacity: 0.6;
-	cursor: not-allowed;
-}
-
-.success-text {
-	color: #10b981;
-	font-size: 0.875rem;
-	padding: 0.5rem;
-	background: rgba(16, 185, 129, 0.1);
-	border-radius: 4px;
-}
-
-/* Settings Layout */
-.settings-layout {
-	display: flex;
-	gap: 2rem;
-	padding: 1.5rem 0;
-}
-
-.settings-sidebar {
-	width: 200px;
-	flex-shrink: 0;
-}
-
-.settings-nav {
-	display: flex;
-	flex-direction: column;
-	gap: 0.25rem;
-}
-
-.settings-nav-link {
-	padding: 0.625rem 1rem;
-	border-radius: 8px;
-	color: var(--muted);
-	text-decoration: none;
-	font-size: 0.95rem;
-	transition: all 0.2s;
-}
-
-.settings-nav-link:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-.settings-nav-link.active {
-	background: var(--brand);
-	color: white;
-	font-weight: 500;
-}
-
-.settings-content {
-	flex: 1;
-	min-width: 0;
-}
-
-.settings-panel {
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	padding: 1.5rem;
-}
-
-/* Mobile responsiveness */
-@media (max-width: 768px) {
-	.settings-layout {
-		flex-direction: column;
-		gap: 1rem;
-	}
-
-	.settings-sidebar {
-		width: 100%;
-	}
-
-	.settings-nav {
-		flex-direction: row;
-		overflow-x: auto;
-		padding-bottom: 0.5rem;
-	}
-
-	.settings-nav-link {
-		white-space: nowrap;
-		padding: 0.5rem 0.75rem;
-		font-size: 0.875rem;
-	}
-
-	.workspace-header {
-		flex-direction: column;
-		gap: 1rem;
-		align-items: flex-start;
-	}
-
-	.workspace-header-actions {
-		width: 100%;
-		justify-content: flex-start;
-	}
-}
-
-.settings-panel h2 {
-	margin: 0 0 1.25rem;
-	font-size: 1.25rem;
-}
-
-.settings-breadcrumb {
-	display: flex;
-	align-items: center;
-	gap: 0.5rem;
-	font-size: 0.9rem;
-	color: var(--muted);
-	margin-bottom: 1rem;
-}
-
-.settings-breadcrumb a {
-	color: var(--brand);
-	text-decoration: none;
-}
-
-.settings-breadcrumb a:hover {
-	text-decoration: underline;
-}
-
-.project-settings-page {
-	padding: 1.5rem;
-}
-
-/* Repositories Settings Tab */
-.repositories-settings-tab h2 {
-	margin: 0 0 1.25rem;
-	font-size: 1.25rem;
-}
-
-.repositories-list {
-	display: flex;
-	flex-direction: column;
-	gap: 0.75rem;
-}
-
-.repository-card {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 1rem;
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-}
-
-.repository-info h3 {
-	margin: 0 0 0.25rem;
-	font-size: 1rem;
-}
-
-.repository-info p {
-	margin: 0 0 0.5rem;
-	font-size: 0.85rem;
-	color: var(--muted);
-}
-
-.repo-type {
-	font-size: 0.75rem;
-	padding: 0.2rem 0.5rem;
-	background: var(--brand);
-	color: white;
-	border-radius: 999px;
-}
-
-/* Git Toolbar - Top Bar Styles */
-.git-toolbar {
-	display: flex;
-	align-items: center;
-	gap: 1rem;
-	padding: 0.5rem 1.5rem;
-	background: var(--bg);
-	border-bottom: 1px solid var(--border);
-	min-height: 48px;
-}
-
-.toolbar-row {
-	display: flex;
-	align-items: center;
-	gap: 0.75rem;
-	flex-wrap: wrap;
-}
-
-.toolbar-group {
-	display: flex;
-	align-items: center;
-	gap: 0.5rem;
-}
-
-.toolbar-button {
-	display: flex;
-	align-items: center;
-	gap: 0.35rem;
-	padding: 0.4rem 0.75rem;
-	border: 1px solid var(--border);
-	border-radius: 6px;
-	background: var(--panel);
-	color: var(--ink);
-	font-size: 0.85rem;
-	cursor: pointer;
-	transition: all 0.2s;
-	white-space: nowrap;
-}
-
-.toolbar-button:hover:not(:disabled) {
-	background: var(--brand);
-	color: white;
-	border-color: var(--brand);
-}
-
-.toolbar-button:disabled {
-	opacity: 0.5;
-	cursor: not-allowed;
-}
-
-.toolbar-button.primary {
-	background: var(--brand);
-	color: white;
-	border-color: var(--brand);
-}
-
-.branch-select {
-	padding: 0.4rem 0.75rem;
-	border: 1px solid var(--border);
-	border-radius: 6px;
-	background: var(--panel);
-	color: var(--ink);
-	font-size: 0.85rem;
-	cursor: pointer;
-	min-width: 140px;
-}
-
-.badge {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	min-width: 18px;
-	height: 18px;
-	padding: 0 4px;
-	background: var(--brand);
-	color: white;
-	font-size: 0.7rem;
-	font-weight: 600;
-	border-radius: 999px;
-}
-
-.toolbar-error {
-	color: #ef4444;
-	font-size: 0.85rem;
-	padding: 0.25rem 0.5rem;
-	background: rgba(239, 68, 68, 0.1);
-	border-radius: 4px;
-}
-
-.toolbar-input {
-	padding: 0.4rem 0.75rem;
-	border: 1px solid var(--border);
-	border-radius: 6px;
-	background: var(--panel);
-	color: var(--ink);
-	font-size: 0.85rem;
-}
-
-.new-branch-form {
-	padding: 0.75rem;
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	margin-top: 0.5rem;
-}
-
-.status-summary {
-	gap: 0.75rem;
-}
-
-.status-badge {
-	display: inline-flex;
-	align-items: center;
-	gap: 0.25rem;
-	padding: 0.2rem 0.5rem;
-	border-radius: 4px;
-	font-size: 0.8rem;
-}
-
-.status-badge.modified {
-	background: rgba(245, 158, 11, 0.1);
-	color: #d97706;
-}
-
-.status-badge.added {
-	background: rgba(16, 185, 129, 0.1);
-	color: #059669;
-}
-
-.status-badge.deleted {
-	background: rgba(239, 68, 68, 0.1);
-	color: #dc2626;
-}
-
-.status-badge.untracked {
-	background: rgba(107, 114, 128, 0.1);
-	color: #4b5563;
-}
-
-/* File Editor */
-.file-editor {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	overflow: hidden;
-}
-
-.file-editor-toolbar {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 0.75rem 1rem;
-	background: var(--panel);
-	border-bottom: 1px solid var(--border);
-}
-
-.file-actions {
-	display: flex;
-	gap: 0.5rem;
-}
-
-.file-editor-content {
-	flex: 1;
-	overflow: hidden;
-	background: var(--bg);
-	display: flex;
-	flex-direction: column;
-}
-
-/* Syntax Highlighter */
-.syntax-highlighter {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-}
-
-.highlighter-toolbar {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 0.5rem 1rem;
-	background: var(--panel);
-	border-bottom: 1px solid var(--border);
-}
-
-.language-badge {
-	font-size: 0.8rem;
-	padding: 0.2rem 0.5rem;
-	background: var(--bg);
-	border-radius: 4px;
-	color: var(--muted);
-}
-
-.copy-button {
-	font-size: 0.8rem;
-	padding: 0.25rem 0.5rem;
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 4px;
-	cursor: pointer;
-	color: var(--ink);
-}
-
-.copy-button:hover {
-	background: var(--brand);
-	color: white;
-	border-color: var(--brand);
-}
-
-.code-container {
-	display: flex;
-	flex: 1;
-	overflow: auto;
-	font-family: "Fira Code", "Monaco", "Courier New", monospace;
-	font-size: 14px;
-	line-height: 1.5;
-}
-
-.line-numbers {
-	display: flex;
-	flex-direction: column;
-	padding: 1rem 0.5rem;
-	background: var(--panel);
-	border-right: 1px solid var(--border);
-	color: var(--muted);
-	text-align: right;
-	user-select: none;
-	min-width: 3rem;
-}
-
-.line-number {
-	padding: 0 0.5rem;
-}
-
-.code-block {
-	flex: 1;
-	margin: 0;
-	padding: 1rem;
-	overflow: visible;
-	background: transparent;
-}
-
-.code-block code {
-	display: block;
-	background: transparent;
-}
-
-/* Code Editor */
-.code-editor {
-	height: 100%;
-	overflow: auto;
-}
-
-.editor-textarea {
-	font-family: "Fira Code", "Monaco", "Courier New", monospace;
-	font-size: 14px;
-	line-height: 1.5;
-	min-height: 100%;
-}
-
-.editor-textarea-input {
-	background: transparent;
-	color: var(--ink);
-	caret-color: var(--ink);
-}
-
-.editor-line {
-	display: flex;
-}
-
-.editor-line-number {
-	display: inline-block;
-	width: 3rem;
-	padding: 0 0.5rem;
-	text-align: right;
-	color: var(--muted);
-	user-select: none;
-	background: var(--panel);
-	border-right: 1px solid var(--border);
-}
-
-.editor-line-content {
-	flex: 1;
-	padding: 0 0.5rem;
-	white-space: pre;
-}
-
-/* Commit Dialog */
-.dialog-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.5);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	z-index: 1000;
-	padding: 1rem;
-}
-
-.commit-dialog {
-	background: var(--panel);
-	border-radius: 14px;
-	width: 100%;
-	max-width: 600px;
-	max-height: 90vh;
-	overflow: auto;
-	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
-}
-
-.dialog-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: 1rem 1.5rem;
-	border-bottom: 1px solid var(--border);
-}
-
-.dialog-header h3 {
-	margin: 0;
-	font-size: 1.1rem;
-}
-
-.dialog-close {
-	background: none;
-	border: none;
-	font-size: 1.5rem;
-	cursor: pointer;
-	color: var(--muted);
-	padding: 0;
-	width: 2rem;
-	height: 2rem;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	border-radius: 6px;
-}
-
-.dialog-close:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-.dialog-body {
-	padding: 1.5rem;
-}
-
-.file-info {
-	margin: 0 0 1rem;
-	color: var(--muted);
-}
-
-.diff-preview {
-	margin-bottom: 1.5rem;
-}
-
-.diff-preview h4 {
-	margin: 0 0 0.75rem;
-	font-size: 0.9rem;
-	color: var(--muted);
-}
-
-.diff-content {
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	overflow: auto;
-	max-height: 300px;
-	font-family: "Fira Code", "Monaco", "Courier New", monospace;
-	font-size: 13px;
-}
-
-.diff-line {
-	display: flex;
-	padding: 0.15rem 0.5rem;
-	gap: 0.5rem;
-}
-
-.diff-line-number {
-	color: var(--muted);
-	min-width: 2rem;
-	text-align: right;
-	user-select: none;
-}
-
-.diff-marker {
-	width: 1rem;
-	text-align: center;
-	font-weight: bold;
-}
-
-.diff-added {
-	background: rgba(16, 185, 129, 0.1);
-}
-
-.diff-added .diff-marker {
-	color: #059669;
-}
-
-.diff-removed {
-	background: rgba(239, 68, 68, 0.1);
-}
-
-.diff-removed .diff-marker {
-	color: #dc2626;
-}
-
-.diff-same {
-	background: transparent;
-}
-
-.warning-message {
-	padding: 0.75rem;
-	background: rgba(245, 158, 11, 0.1);
-	color: #d97706;
-	border-radius: 8px;
-	margin-bottom: 1rem;
-}
-
-.dialog-footer {
-	display: flex;
-	justify-content: flex-end;
-	gap: 0.75rem;
-	padding: 1rem 1.5rem;
-	border-top: 1px solid var(--border);
-}
-
-/* Prism.js Theme Integration */
-code[class*="language-"],
-pre[class*="language-"] {
-	color: var(--ink);
-	text-shadow: none;
-	font-family: "Fira Code", "Monaco", "Courier New", monospace;
-	font-size: 14px;
-	text-align: left;
-	white-space: pre;
-	word-spacing: normal;
-	word-break: normal;
-	word-wrap: normal;
-	line-height: 1.5;
-	tab-size: 2;
-	hyphens: none;
-}
-
-/* Syntax Highlighting Colors */
-.token.comment,
-.token.prolog,
-.token.doctype,
-.token.cdata {
-	color: var(--muted);
-}
-
-.token.punctuation {
-	color: var(--ink);
-}
-
-.token.namespace {
-	opacity: 0.7;
-}
-
-.token.property,
-.token.tag,
-.token.boolean,
-.token.number,
-.token.constant,
-.token.symbol,
-.token.deleted {
-	color: #f59e0b;
-}
-
-.token.selector,
-.token.attr-name,
-.token.string,
-.token.char,
-.token.builtin,
-.token.inserted {
-	color: #10b981;
-}
-
-.token.operator,
-.token.entity,
-.token.url,
-.language-css .token.string,
-.style .token.string {
-	color: #f43f5e;
-}
-
-.token.atrule,
-.token.attr-value,
-.token.keyword {
-	color: #3b82f6;
-}
-
-.token.function,
-.token.class-name {
-	color: #8b5cf6;
-}
-
-.token.regex,
-.token.important,
-.token.variable {
-	color: #ec4899;
-}
-
-/* Icon System */
-.icon {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	flex-shrink: 0;
-	vertical-align: middle;
-}
-
-.icon svg {
-	display: block;
-}
-
-.icon-sm {
-	width: 16px;
-	height: 16px;
-}
-
-.icon-md {
-	width: 20px;
-	height: 20px;
-}
-
-.icon-lg {
-	width: 24px;
-	height: 24px;
-}
-
-.icon-xl {
-	width: 32px;
-	height: 32px;
-}
-
-/* Button icons */
-button .icon,
-a .icon {
-	margin-right: 0.35rem;
-}
-
-button .icon:last-child,
-a .icon:last-child {
-	margin-right: 0;
-}
-
-/* Navigation icons */
-.nav-item .icon {
-	margin-right: 0.5rem;
-}
-
-/* Status badge icons */
-.status-badge .icon {
-	margin-right: 0.25rem;
-}
-
-/* ============================================
-   Responsive Design System
-   ============================================ */
-
-/* Layout Utilities */
-.container {
-	width: 100%;
-	max-width: min(1200px, 100vw - 2rem);
-	margin-inline: auto;
-	padding-inline: var(--space-4);
-}
-
-.stack {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-}
-
-.stack-sm {
-	gap: var(--space-2);
-}
-
-.stack-md {
-	gap: var(--space-4);
-}
-
-.stack-lg {
-	gap: var(--space-6);
-}
-
-.row {
-	display: flex;
-	flex-wrap: wrap;
-	gap: var(--space-4);
-	align-items: center;
-}
-
-.grid {
-	display: grid;
-	gap: var(--space-4);
-	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
-}
-
-/* Text Utilities */
-.truncate {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.truncate-multiline {
-	display: -webkit-box;
-	-webkit-line-clamp: 3;
-	-webkit-box-orient: vertical;
-	overflow: hidden;
-}
-
-.break-word {
-	overflow-wrap: break-word;
-	word-wrap: break-word;
-	hyphens: auto;
-}
-
-/* Touch Targets */
-.button,
-.nav-link,
-.icon-button,
-button,
-[role="button"] {
-	min-height: 44px;
-	min-width: 44px;
-}
-
-/* Dialog Responsive */
-.dialog {
-	width: min(560px, 100vw - 2rem);
-	max-height: min(800px, 100vh - 2rem);
-	overflow-y: auto;
-}
-
-.dialog-lg {
-	width: min(800px, 100vw - 2rem);
-}
-
-/* Table Responsive */
-.table-responsive {
-	overflow-x: auto;
-	-webkit-overflow-scrolling: touch;
-}
-
-.table-responsive table {
-	min-width: 100%;
-}
-
-/* Mobile-first Media Queries */
-@media (max-width: 767px) {
-	/* Card layout for tables on mobile */
-	.table-responsive thead {
-		display: none;
-	}
-
-	.table-responsive tbody tr {
-		display: block;
-		margin-bottom: var(--space-4);
-		border: 1px solid var(--border);
-		border-radius: 8px;
-		padding: var(--space-4);
-	}
-
-	.table-responsive td {
-		display: flex;
-		justify-content: space-between;
-		padding: var(--space-2) 0;
-		border-bottom: 1px solid var(--border);
-	}
-
-	.table-responsive td:last-child {
-		border-bottom: none;
-	}
-
-	.table-responsive td::before {
-		content: attr(data-label);
-		font-weight: 600;
-		margin-right: var(--space-2);
-	}
-
-	/* Larger touch targets on mobile */
-	.button,
-	button {
-		padding: var(--space-3) var(--space-4);
-	}
-
-	/* Full-width inputs on mobile */
-	input,
-	select,
-	textarea {
-		width: 100%;
-		min-height: 44px;
-	}
-}
-
-/* Small devices */
-@media (min-width: 480px) {
-	.container {
-		padding-inline: var(--space-5);
-	}
-}
-
-/* Medium devices */
-@media (min-width: 768px) {
-	.container {
-		padding-inline: var(--space-6);
-	}
-}
-
-/* Large devices */
-@media (min-width: 1024px) {
-	.container {
-		padding-inline: var(--space-8);
-	}
-}
-
-/* Extra large devices */
-@media (min-width: 1280px) {
-	.container {
-		max-width: 1200px;
-	}
-}
-
-/* ============================================
-   Page-Specific Responsive Styles
-   ============================================ */
-
-/* Forms - Full width on mobile */
-@media (max-width: 767px) {
-	.form-field input,
-	.form-field textarea,
-	.form-field select {
-		width: 100%;
-		min-height: 44px;
-	}
-
-	/* Settings page stack */
-	.settings-layout {
-		flex-direction: column;
-	}
-
-	.settings-nav {
-		flex-direction: row;
-		overflow-x: auto;
-		padding-bottom: var(--space-2);
-	}
-
-	/* Project cards full width */
-	.project-card {
-		flex-direction: column;
-		gap: var(--space-3);
-	}
-
-	.project-actions {
-		width: 100%;
-		justify-content: flex-start;
-	}
-
-	/* Repository cards */
-	.repository-card {
-		flex-direction: column;
-		gap: var(--space-3);
-		align-items: flex-start;
-	}
-
-	.repository-actions {
-		width: 100%;
-		justify-content: flex-start;
-	}
-
-	/* Git toolbar wrap */
-	.git-toolbar {
-		flex-wrap: wrap;
-		gap: var(--space-2);
-	}
-
-	/* Dashboard cards */
-	.dashboard-grid {
-		grid-template-columns: 1fr;
-	}
-
-	/* Stack form actions */
-	.form-actions {
-		flex-direction: column;
-		width: 100%;
-	}
-
-	.form-actions button {
-		width: 100%;
-		justify-content: center;
-	}
-}
-
-/* Ensure all pages have proper padding */
-.stack > h1,
-.stack > h2 {
-	margin-top: 0;
-}
-
-/* Touch target verification override */
-button,
-[role="button"],
-a.nav-item,
-.tree-entry {
-	min-height: 44px;
-}
-
-/* Table horizontal scroll wrapper */
-.table-wrapper {
-	overflow-x: auto;
-	-webkit-overflow-scrolling: touch;
-	width: 100%;
-}
-
-/* Dialog content spacing */
-.dialog-body {
-	padding: var(--space-4) 0;
-}
-
-/* Prevent text overflow in cards */
-.card h3,
-.card p {
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-/* SSH keys table responsive */
-.ssh-key-list {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-}
-
-.ssh-key-item {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-2);
-	padding: var(--space-4);
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-}
-
-@media (min-width: 768px) {
-	.ssh-key-item {
-		flex-direction: row;
-		justify-content: space-between;
-		align-items: center;
-	}
-}
-
-/* Session Navigation */
-.session-item {
-	position: relative;
-	padding-left: var(--space-6);
-}
-
-.session-status {
-	position: absolute;
-	left: var(--space-2);
-	top: 50%;
-	transform: translateY(-50%);
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background: var(--muted);
-}
-
-.session-status.running {
-	background: var(--success);
-}
-
-.session-name {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	max-width: 140px;
-}
-
-.nav-divider {
-	height: 1px;
-	background: var(--border);
-	margin: var(--space-2) var(--space-3);
-}
-
-.nav-section-title {
-	padding: var(--space-2) var(--space-4);
-	font-size: var(--text-xs);
-	font-weight: 600;
-	text-transform: uppercase;
-	letter-spacing: 0.05em;
-	color: var(--muted);
-}
-
-/* Instance List */
-.instance-list {
-	margin-top: var(--space-4);
-}
-
-.instance-list-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	margin-bottom: var(--space-4);
-}
-
-.instance-list-header h3 {
-	margin: 0;
-}
-
-.instance-grid {
-	display: grid;
-	gap: var(--space-3);
-}
-
-.instance-card {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: var(--space-4);
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	position: relative;
-}
-
-.instance-info {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-1);
-}
-
-.instance-name {
-	font-weight: 600;
-}
-
-.instance-meta {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	font-size: var(--text-sm);
-	color: var(--muted);
-}
-
-.status-dot {
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-}
-
-.instance-actions {
-	display: flex;
-	gap: var(--space-2);
-	align-items: center;
-}
-
-.instance-card.busy {
-	opacity: 0.7;
-}
-
-.instance-busy-overlay {
-	position: absolute;
-	inset: 0;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	gap: var(--space-2);
-	background: rgba(var(--bg-rgb, 255, 255, 255), 0.8);
-	border-radius: 10px;
-	z-index: 1;
-	font-size: var(--text-sm);
-	color: var(--muted);
-}
-
-.session-card {
-	position: relative;
-}
-
-.session-card.busy {
-	opacity: 0.7;
-}
-
-.session-busy-overlay {
-	position: absolute;
-	inset: 0;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	background: rgba(var(--bg-rgb, 255, 255, 255), 0.8);
-	border-radius: var(--space-2);
-	z-index: 1;
-}
-
-/* ============================================
-   Terminal Styles
-   ============================================ */
-
-.terminal-page {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	min-height: 0;
-	padding: var(--space-4);
-	gap: var(--space-4);
-}
-
-.terminal-page-header {
-	display: flex;
-	align-items: center;
-	gap: var(--space-4);
-	flex-shrink: 0;
-}
-
-.terminal-page-header h1 {
-	margin: 0;
-}
-
-.terminal-wrapper {
-	display: grid;
-	grid-template-rows: auto 1fr;
-	flex: 1;
-	min-height: 0;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	overflow: hidden;
-	background: #1e1e1e;
-}
-
-/* When controls are hidden (fullscreen), only the container is in flow;
-   force it into the 1fr track so it fills the wrapper instead of landing
-   in the auto track and shrinking on each fit(). */
-.terminal-wrapper.no-controls {
-	grid-template-rows: 1fr;
-}
-
-.terminal-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: var(--space-3) var(--space-4);
-	background: #2d2d2d;
-	border-bottom: 1px solid #3e3e3e;
-	flex-shrink: 0;
-}
-
-.terminal-status {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.status-dot {
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background: #666;
-}
-
-.status-dot.connecting {
-	background: #f5f543;
-	animation: pulse 1.5s infinite;
-}
-
-.status-dot.connected {
-	background: #0dbc79;
-}
-
-.status-dot.disconnected,
-.status-dot.error {
-	background: #cd3131;
-}
-
-@keyframes pulse {
-	0%,
-	100% {
-		opacity: 1;
-	}
-	50% {
-		opacity: 0.5;
-	}
-}
-
-.status-text {
-	font-size: 0.875rem;
-	color: #d4d4d4;
-	text-transform: capitalize;
-}
-
-.terminal-close {
-	padding: var(--space-1) var(--space-3);
-	background: transparent;
-	border: 1px solid #666;
-	border-radius: 6px;
-	color: #d4d4d4;
-	cursor: pointer;
-	font-size: 0.875rem;
-}
-
-.terminal-close:hover {
-	background: #3e3e3e;
-}
-
-.terminal-error {
-	padding: var(--space-3) var(--space-4);
-	background: #cd3131;
-	color: white;
-	font-size: 0.875rem;
-	flex-shrink: 0;
-}
-
-.terminal-container {
-	position: relative;
-	width: 100%;
-	height: 100%;
-	padding: 0;
-	overflow: hidden;
-}
-
-/* xterm.js manages its own positioning and sizing */
-
-.terminal-container canvas {
-	display: block;
-}
-
-/* xterm.js manages its own viewport dimensions - do not override */
-
-/* Mobile terminal container - no padding to maximize space */
-.terminal-wrapper.mobile .terminal-container {
-	padding: 0;
-}
-
-/* Ensure xterm viewport fills container properly */
-/* Responsive terminal */
-@media (max-width: 767px) {
-	.terminal-page {
-		padding: var(--space-2);
-		gap: var(--space-2);
-	}
-
-	.terminal-page-header h1 {
-		font-size: 1.25rem;
-	}
-}
-
-/* ============================================
-   Terminal Session Tabs
-   ============================================ */
-
-.terminal-session-tabs {
-	display: flex;
-	flex-shrink: 0;
-	background: #2d2d2d;
-	border-bottom: 1px solid #3e3e3e;
-	overflow: hidden;
-}
-
-.terminal-session-tabs.mobile {
-	background: #1e1e1e;
-}
-
-.terminal-session-tabs-scroll {
-	display: flex;
-	gap: 2px;
-	padding: var(--space-1) var(--space-2);
-	overflow-x: auto;
-	scrollbar-width: thin;
-	scrollbar-color: #555 transparent;
-	flex: 1;
-	min-width: 0;
-}
-
-.terminal-session-tabs-scroll::-webkit-scrollbar {
-	height: 4px;
-}
-
-.terminal-session-tabs-scroll::-webkit-scrollbar-thumb {
-	background: #555;
-	border-radius: 2px;
-}
-
-.terminal-session-tab {
-	display: flex;
-	align-items: center;
-	gap: var(--space-1);
-	padding: var(--space-1) var(--space-2);
-	border: 1px solid transparent;
-	border-radius: 6px;
-	background: transparent;
-	color: #888;
-	cursor: pointer;
-	font-size: 0.8125rem;
-	white-space: nowrap;
-	transition:
-		background 0.15s,
-		color 0.15s,
-		border-color 0.15s;
-	user-select: none;
-	min-width: 0;
-}
-
-.terminal-session-tab:hover {
-	background: #3e3e3e;
-	color: #ccc;
-}
-
-.terminal-session-tab.active {
-	background: #1e1e1e;
-	color: #d4d4d4;
-	border-color: #3e3e3e;
-}
-
-.terminal-session-tab-status {
-	width: 6px;
-	height: 6px;
-	border-radius: 50%;
-	flex-shrink: 0;
-}
-
-.terminal-session-tab-status.connecting {
-	background: #f5f543;
-	animation: pulse 1.5s infinite;
-}
-
-.terminal-session-tab-status.connected {
-	background: #0dbc79;
-}
-
-.terminal-session-tab-status.disconnected,
-.terminal-session-tab-status.error {
-	background: #cd3131;
-}
-
-.terminal-session-tab-name {
-	max-width: 120px;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.terminal-session-tab-input {
-	background: #1e1e1e;
-	border: 1px solid var(--brand);
-	border-radius: 4px;
-	color: #d4d4d4;
-	font-size: 0.8125rem;
-	padding: 1px 4px;
-	width: 100px;
-	outline: none;
-}
-
-.terminal-session-tab-close {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 16px;
-	height: 16px;
-	padding: 0;
-	margin: 0;
-	background: transparent;
-	border: none;
-	color: #888;
-	cursor: pointer;
-	font-size: 0.875rem;
-	line-height: 1;
-	border-radius: 3px;
-	opacity: 0;
-	transition:
-		opacity 0.15s,
-		background 0.15s;
-}
-
-.terminal-session-tab:hover .terminal-session-tab-close {
-	opacity: 1;
-}
-
-.terminal-session-tab-close:hover {
-	background: #cd3131;
-	color: white;
-}
-
-.terminal-session-tab-confirm {
-	font-size: 0.6875rem;
-	color: #cd3131;
-	padding: 1px 4px;
-	border-radius: 3px;
-	background: rgba(205, 49, 49, 0.15);
-	white-space: nowrap;
-}
-
-.terminal-session-tab.new-session {
-	font-weight: 600;
-	font-size: 1rem;
-	line-height: 1;
-	padding: var(--space-1) var(--space-2);
-	color: #888;
-}
-
-.terminal-session-tab.new-session:hover {
-	background: #3e3e3e;
-	color: #d4d4d4;
-}
-
-.terminal-session-tab.new-session:disabled {
-	opacity: 0.4;
-	cursor: not-allowed;
-}
-
-/* Terminal page with multi-session */
-.terminal-page-content {
-	display: flex;
-	flex-direction: column;
-	flex: 1;
-	min-height: 0;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	overflow: hidden;
-	background: #1e1e1e;
-}
-
-.terminal-instance {
-	flex: 1;
-	min-height: 0;
-	display: none;
-}
-
-.terminal-instance.active {
-	display: flex;
-}
-
-.terminal-empty-state {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex: 1;
-	color: #888;
-	font-size: 0.875rem;
-}
-
-.terminal-error-banner {
-	padding: var(--space-2) var(--space-4);
-	background: var(--danger-light);
-	color: var(--danger);
-	font-size: 0.875rem;
-	border-bottom: 1px solid var(--danger-light);
-}
-
-/* Fullscreen mode */
-.terminal-page.fullscreen {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	z-index: 1000;
-	padding: 8px;
-	gap: 8px;
-	background: #1e1e1e;
-}
-
-.terminal-page.fullscreen .terminal-page-content {
-	border: none;
-	border-radius: 0;
-}
-
-/* Unified fullscreen header: session tabs + terminal controls */
-.terminal-fullscreen-header {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	background: #2d2d2d;
-	border-bottom: 1px solid #3e3e3e;
-	flex-shrink: 0;
-	min-height: 0;
-}
-
-.terminal-fullscreen-header-tabs {
-	flex: 1;
-	min-width: 0;
-	overflow: hidden;
-}
-
-.terminal-fullscreen-header-tabs .terminal-session-tabs {
-	background: transparent;
-	border-bottom: none;
-}
-
-.terminal-fullscreen-header-controls {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	padding: 0 var(--space-3);
-	flex-shrink: 0;
-	border-left: 1px solid #3e3e3e;
-}
-
-.terminal-fullscreen-status {
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background: #666;
-	flex-shrink: 0;
-}
-
-.terminal-fullscreen-status.connecting {
-	background: #f5f543;
-	animation: pulse 1.5s infinite;
-}
-
-.terminal-fullscreen-status.connected {
-	background: #0dbc79;
-}
-
-.terminal-fullscreen-status.disconnected,
-.terminal-fullscreen-status.error {
-	background: #cd3131;
-}
-
-/* ============================================
-   Mobile Terminal Overlay
-   ============================================ */
-
-/* Mobile terminal page — no padding, terminal fills viewport */
-.terminal-page.mobile {
-	padding: 0;
-	gap: 0;
-	height: 100vh;
-	height: 100dvh;
-	position: relative;
-	overflow: hidden;
-}
-
-/* Overlay status bar — floats over terminal, never resizes it */
-.mobile-terminal-overlay {
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	z-index: 100;
-	background: #2d2d2d;
-	border-bottom: 1px solid #3e3e3e;
-	transition:
-		transform 0.3s ease,
-		opacity 0.3s ease;
-}
-
-.mobile-terminal-overlay.hidden {
-	transform: translateY(-100%);
-	opacity: 0;
-	pointer-events: none;
-}
-
-.mobile-terminal-overlay.visible {
-	transform: translateY(0);
-	opacity: 1;
-}
-
-/* Toolbar row */
-.mobile-terminal-toolbar {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: var(--space-2) var(--space-3);
-	gap: var(--space-2);
-}
-
-.mobile-terminal-toolbar-left,
-.mobile-terminal-toolbar-right {
-	display: flex;
-	align-items: center;
-	gap: var(--space-1);
-	flex: 0 0 auto;
-}
-
-.mobile-terminal-toolbar-center {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	flex: 1;
-	justify-content: center;
-	min-width: 0;
-}
-
-.mobile-terminal-title {
-	font-size: 0.875rem;
-	font-weight: 500;
-	color: #d4d4d4;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.mobile-terminal-status {
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background: #666;
-	flex-shrink: 0;
-}
-
-.mobile-terminal-status.connecting {
-	background: #f5f543;
-	animation: pulse 1.5s infinite;
-}
-
-.mobile-terminal-status.connected {
-	background: #0dbc79;
-}
-
-.mobile-terminal-status.disconnected,
-.mobile-terminal-status.error {
-	background: #cd3131;
-}
-
-.mobile-terminal-toolbtn {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 36px;
-	height: 36px;
-	padding: 0;
-	background: transparent;
-	border: 1px solid #3e3e3e;
-	border-radius: 6px;
-	color: #d4d4d4;
-	cursor: pointer;
-	font-size: 0.875rem;
-	transition: background 0.2s ease;
-}
-
-.mobile-terminal-toolbtn:hover {
-	background: #3e3e3e;
-}
-
-/* Session tabs inside overlay */
-.mobile-terminal-overlay-tabs {
-	background: #1e1e1e;
-	border-top: 1px solid #3e3e3e;
-}
-
-.mobile-terminal-overlay-tabs .terminal-session-tabs {
-	background: #1e1e1e;
-	border-bottom: none;
-}
-
-/* Terminal content — always fills full viewport on mobile */
-.terminal-page-content.mobile-full {
-	flex: 1;
-	min-height: 0;
-	border: none;
-	border-radius: 0;
-	overflow: hidden;
-}
-
-/* Mobile fullscreen */
-@media (max-width: 767px) {
-	.terminal-page.fullscreen {
-		padding: 0;
-	}
-
-	.terminal-session-tab-name {
-		max-width: 80px;
-	}
-}
-
-/* ============================================
-   Sessions Page Styles
-   ============================================ */
-
-.nav-badge {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	min-width: 18px;
-	height: 18px;
-	padding: 0 5px;
-	background: var(--primary);
-	color: var(--primary-fg);
-	border-radius: 9px;
-	font-size: 11px;
-	font-weight: 600;
-	margin-left: auto;
-}
-
-.sessions-page {
-	max-width: 1200px;
-}
-
-.last-session-section {
-	margin-bottom: var(--space-6);
-}
-
-.last-session-card {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	gap: var(--space-4);
-	padding: var(--space-5);
-	border: 2px solid var(--primary);
-}
-
-.last-session-info h3 {
-	margin: 0 0 var(--space-1) 0;
-	font-size: 1.25rem;
-}
-
-.active-sessions-section {
-	position: relative;
-	margin-bottom: var(--space-6);
-}
-
-.active-sessions-section.dimmed {
-	opacity: 0.5;
-	pointer-events: none;
-}
-
-.active-sessions-section h2 {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.active-sessions-section .badge {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	min-width: 24px;
-	height: 24px;
-	padding: 0 6px;
-	background: var(--success);
-	color: white;
-	border-radius: 12px;
-	font-size: 12px;
-	font-weight: 600;
-}
-
-.sessions-grid {
-	display: grid;
-	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
-	gap: var(--space-4);
-}
-
-.session-card {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-	padding: var(--space-4);
-}
-
-.session-info h4 {
-	margin: 0 0 var(--space-1) 0;
-	font-size: 1rem;
-}
-
-.session-url {
-	margin: var(--space-1) 0;
-	font-size: 0.8rem;
-	word-break: break-all;
-}
-
-.session-url a {
-	color: var(--color-primary);
-	text-decoration: none;
-}
-
-.session-url a:hover {
-	text-decoration: underline;
-}
-
-.session-actions {
-	display: flex;
-	gap: var(--space-2);
-}
-
-/* Session Card - Unified Component */
-.session-card-content {
-	flex: 1;
-}
-
-.session-card-header {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-2);
-}
-
-.session-card-title {
-	display: flex;
-	justify-content: space-between;
-	align-items: flex-start;
-	gap: var(--space-2);
-}
-
-.session-card-title h4 {
-	margin: 0;
-	font-size: 1rem;
-	font-weight: 600;
-}
-
-.session-card-status-badges {
-	display: flex;
-	gap: var(--space-1);
-	flex-wrap: wrap;
-}
-
-.session-card-meta {
-	font-size: 0.85rem;
-	margin: 0;
-}
-
-.session-card-meta .icon {
-	margin-right: var(--space-1);
-	vertical-align: text-bottom;
-}
-
-.session-card-url {
-	margin: var(--space-1) 0;
-	font-size: 0.8rem;
-	word-break: break-all;
-}
-
-.session-card-url a {
-	color: var(--color-primary);
-	text-decoration: none;
-}
-
-.session-card-url a:hover {
-	text-decoration: underline;
-}
-
-.session-card-actions {
-	display: flex;
-	gap: var(--space-2);
-	flex-wrap: wrap;
-	margin-top: var(--space-2);
-	padding-top: var(--space-3);
-	border-top: 1px solid var(--color-border);
-}
-
-/* Session List - Unified Component */
-.session-list {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-6);
-}
-
-.session-group {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-}
-
-.session-group-header {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.session-group-header h3 {
-	margin: 0;
-	font-size: 1.1rem;
-	font-weight: 600;
-}
-
-/* Action labels - hidden on mobile */
-.action-label {
-	margin-left: var(--space-1);
-}
-
-@media (max-width: 640px) {
-	.action-label {
-		display: none;
-	}
-
-	.session-card-actions {
-		gap: var(--space-1);
-	}
-
-	.session-card-actions button,
-	.session-card-actions a {
-		padding: var(--space-1);
-	}
-}
-
-.recent-sessions-section {
-	margin-bottom: var(--space-6);
-}
-
-/* Loading overlay for sessions */
-.sessions-grid {
-	position: relative;
-}
-
-.sessions-grid.dimmed {
-	opacity: 0.5;
-	pointer-events: none;
-}
-
-.create-session-form-wrapper {
-	position: relative;
-}
-
-.loading-overlay {
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	z-index: 10;
-	background: rgba(255, 254, 249, 0.7);
-	border-radius: var(--space-2);
-}
-
-.loading-content {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	gap: var(--space-3);
-	padding: var(--space-6);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: var(--space-2);
-	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-
-.loading-content .icon {
-	animation: spin 1s linear infinite;
-	color: var(--brand);
-}
-
-.loading-content p {
-	margin: 0;
-	font-size: var(--font-size-base);
-	color: var(--muted);
-}
-
-@keyframes spin {
-	from {
-		transform: rotate(0deg);
-	}
-	to {
-		transform: rotate(360deg);
-	}
-}
-
-.recent-sessions-list {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-2);
-}
-
-.recent-session-item {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: var(--space-3) var(--space-4);
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-}
-
-.recent-session-info {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-1);
-}
-
-.recent-session-name {
-	font-weight: 500;
-}
-
-.recent-session-actions {
-	display: flex;
-	gap: var(--space-2);
-	align-items: center;
-}
-
-.delete-confirm-inline,
-.stop-confirm-inline {
-	display: flex;
-	gap: var(--space-2);
-	align-items: center;
-}
-
-.confirm-text {
-	font-size: 13px;
-	color: var(--muted);
-	font-weight: 500;
-}
-
-.create-session-section {
-	position: relative;
-	margin-bottom: var(--space-6);
-}
-
-.create-session-section.dimmed {
-	opacity: 0.5;
-	pointer-events: none;
-}
-
-.create-session-form {
-	max-width: 600px;
-}
-
-.create-session-form .form-row {
-	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-	gap: var(--space-4);
-}
-
-/* Workflow Step Styles */
-.workflow-form {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-6);
-}
-
-.workflow-step {
-	opacity: 0.4;
-	pointer-events: none;
-	transition: opacity 0.2s ease;
-}
-
-.workflow-step.active {
-	opacity: 1;
-	pointer-events: auto;
-}
-
-.workflow-step.complete {
-	opacity: 0.7;
-	pointer-events: auto;
-}
-
-.workflow-step-header {
-	display: flex;
-	align-items: center;
-	gap: var(--space-3);
-	margin-bottom: var(--space-3);
-	font-weight: 600;
-	color: var(--text-muted);
-}
-
-.workflow-step.active .workflow-step-header {
-	color: var(--text-primary);
-}
-
-.workflow-step-number {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 28px;
-	height: 28px;
-	border-radius: 50%;
-	background: var(--bg-muted);
-	color: var(--text-muted);
-	font-size: 14px;
-	font-weight: 600;
-}
-
-.workflow-step.active .workflow-step-number {
-	background: var(--primary);
-	color: white;
-}
-
-.workflow-step.complete .workflow-step-number {
-	background: var(--success);
-	color: white;
-}
-
-.status-badge {
-	display: inline-flex;
-	align-items: center;
-	padding: 2px 8px;
-	border-radius: 4px;
-	font-size: 12px;
-	font-weight: 500;
-	text-transform: capitalize;
-}
-
-.status-badge.running {
-	background: var(--success-light, #dcfce7);
-	color: var(--success, #16a34a);
-}
-
-.status-badge.stopped {
-	background: var(--muted-bg, #f3f4f6);
-	color: var(--muted, #6b7280);
-}
-
-.status-badge.pending {
-	background: var(--warning-light, #fef3c7);
-	color: var(--warning, #d97706);
-}
-
-.status-badge.error {
-	background: var(--danger-light, #fee2e2);
-	color: var(--danger, #dc2626);
-}
-
-.status-badge.starting,
-.status-badge.probing {
-	background: var(--info-light, #dbeafe);
-	color: var(--info, #2563eb);
-}
-
-.status-badge.unhealthy {
-	background: var(--warning-light, #fef3c7);
-	color: var(--warning, #d97706);
-}
-
-/* ============================================
-   Mobile Terminal Styles
-   ============================================ */
-
-/* Mobile terminal shell - fills viewport */
-.shell.mobile-terminal-shell {
-	height: 100vh;
-	height: 100dvh;
-	overflow: hidden;
-	display: flex;
-	flex-direction: column;
-}
-
-.mobile-terminal-wrapper {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	min-height: 0;
-	background: #1e1e1e;
-	position: relative;
-	overflow: hidden;
-}
-
-/* Mobile Terminal Header */
-.mobile-terminal-header {
-	flex-shrink: 0;
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: var(--space-2) var(--space-3);
-	background: #2d2d2d;
-	border-bottom: 1px solid #3e3e3e;
-	transition:
-		transform 0.3s ease,
-		opacity 0.3s ease,
-		height 0.3s ease,
-		padding 0.3s ease,
-		margin 0.3s ease;
-	z-index: 100;
-	overflow: hidden;
-}
-
-.mobile-terminal-header.hidden {
-	transform: translateY(-100%);
-	opacity: 0;
-	pointer-events: none;
-	height: 0;
-	padding-top: 0;
-	padding-bottom: 0;
-	margin-top: 0;
-	margin-bottom: 0;
-	border-width: 0;
-	flex-shrink: 1;
-}
-
-.mobile-terminal-header.visible {
-	transform: translateY(0);
-	opacity: 1;
-	height: auto;
-}
-
-.mobile-terminal-header-left,
-.mobile-terminal-header-right {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	flex: 0 0 auto;
-}
-
-.mobile-terminal-header-center {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	flex: 1;
-	justify-content: center;
-	min-width: 0;
-}
-
-.mobile-terminal-header-title {
-	font-size: 0.875rem;
-	font-weight: 500;
-	color: #d4d4d4;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.mobile-terminal-header-button {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 36px;
-	height: 36px;
-	padding: 0;
-	background: transparent;
-	border: 1px solid #3e3e3e;
-	border-radius: 6px;
-	color: #d4d4d4;
-	cursor: pointer;
-	font-size: 0.875rem;
-	transition: background 0.2s ease;
-}
-
-.mobile-terminal-header-button:hover {
-	background: #3e3e3e;
-}
-
-.mobile-terminal-header-status {
-	width: 8px;
-	height: 8px;
-	border-radius: 50%;
-	background: #666;
-	flex-shrink: 0;
-}
-
-.mobile-terminal-header-status.connecting {
-	background: #f5f543;
-	animation: pulse 1.5s infinite;
-}
-
-.mobile-terminal-header-status.connected {
-	background: #0dbc79;
-}
-
-.mobile-terminal-header-status.disconnected,
-.mobile-terminal-header-status.error {
-	background: #cd3131;
-}
-
-/* Mobile Terminal Content */
-.mobile-terminal-content {
-	flex: 1;
-	min-height: 0;
-	overflow: hidden;
-	position: relative;
-	background: #1e1e1e;
-	display: flex;
-	flex-direction: column;
-}
-
-/* Terminal wrapper - fills content area */
-.terminal-wrapper.mobile {
-	border: none;
-	border-radius: 0;
-	flex: 1;
-	min-height: 0;
-	width: 100%;
-	overflow: hidden;
-	display: flex;
-	flex-direction: column;
-}
-
-.terminal-wrapper.mobile .terminal-container {
-	width: 100%;
-	flex: 1;
-	min-height: 0;
-	padding: 0;
-	overflow: hidden;
-	position: relative;
-	touch-action: none;
-}
-
-/* xterm.js manages its own sizing */
-
-/* xterm.js manages its own scrolling and viewport dimensions */
-
-/* Special Keys Strip */
-.special-keys-strip {
-	flex-shrink: 0;
-	display: flex;
-	align-items: center;
-	gap: 2px;
-	padding: var(--space-1) var(--space-2);
-	background: #2d2d2d;
-	border-top: 1px solid #3e3e3e;
-	overflow-x: auto;
-	-webkit-overflow-scrolling: touch;
-	scrollbar-width: none;
-	transition:
-		transform 0.3s ease,
-		opacity 0.3s ease;
-	z-index: 100;
-}
-
-.special-keys-strip.hidden {
-	transform: translateY(100%);
-	opacity: 0;
-	pointer-events: none;
-}
-
-.special-keys-strip.visible {
-	transform: translateY(0);
-	opacity: 1;
-}
-
-.special-keys-strip::-webkit-scrollbar {
-	display: none;
-}
-
-.special-key-button {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	min-width: 44px;
-	height: 44px;
-	padding: 0 var(--space-2);
-	background: #3e3e3e;
-	border: 1px solid #4e4e4e;
-	border-radius: 6px;
-	color: #d4d4d4;
-	font-size: 0.75rem;
-	font-weight: 500;
-	cursor: pointer;
-	white-space: nowrap;
-	flex-shrink: 0;
-	transition:
-		background 0.15s ease,
-		transform 0.1s ease;
-	user-select: none;
-	-webkit-user-select: none;
-	touch-action: manipulation;
-}
-
-.special-key-button:active {
-	background: #4e4e4e;
-	transform: scale(0.95);
-}
-
-.special-key-more {
-	background: #2472c8;
-	border-color: #2472c8;
-	color: white;
-}
-
-.special-key-more:active {
-	background: #1e5fa8;
-}
-
-.special-key-button.active-modifier {
-	background: #f5f543;
-	color: #1e1e1e;
-	border-color: #f5f543;
-	font-weight: 700;
-	box-shadow: 0 0 8px rgba(245, 245, 67, 0.5);
-}
-
-/* Special Keys Panel */
-.special-keys-panel-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.5);
-	z-index: 200;
-	display: flex;
-	align-items: flex-end;
-	justify-content: center;
-}
-
-.special-keys-panel {
-	background: #2d2d2d;
-	border-top: 1px solid #3e3e3e;
-	border-radius: 12px 12px 0 0;
-	padding: var(--space-4);
-	width: 100%;
-	max-height: 70vh;
-	overflow-y: auto;
-	animation: slideUp 0.2s ease;
-}
-
-.special-keys-panel-section {
-	display: flex;
-	flex-wrap: wrap;
-	gap: var(--space-2);
-	margin-bottom: var(--space-3);
-}
-
-.special-keys-panel-section:last-child {
-	margin-bottom: 0;
-}
-
-.special-keys-panel-divider {
-	height: 1px;
-	background: #3e3e3e;
-	margin: var(--space-3) 0;
-}
-
-/* Terminal Component Updates */
-/* Note: .terminal-wrapper.mobile is defined above with position: absolute to fill grid cell */
-
-.terminal-wrapper.mobile .terminal-header {
-	display: none;
-}
-
-.terminal-header-left {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.terminal-header-right {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.terminal-header-button {
-	padding: var(--space-1) var(--space-2);
-	background: transparent;
-	border: 1px solid #666;
-	border-radius: 4px;
-	color: #d4d4d4;
-	cursor: pointer;
-	font-size: 0.75rem;
-	transition: background 0.2s ease;
-}
-
-.terminal-header-button:hover {
-	background: #3e3e3e;
-}
-
-.terminal-reconnect {
-	margin-left: var(--space-2);
-	padding: var(--space-1) var(--space-2);
-	background: #2472c8;
-	border: none;
-	border-radius: 4px;
-	color: white;
-	cursor: pointer;
-	font-size: 0.75rem;
-}
-
-.terminal-reset-confirm {
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.8);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	z-index: 100;
-}
-
-.terminal-reset-confirm-content {
-	background: var(--bg-surface);
-	border: 1px solid var(--border-color);
-	border-radius: 8px;
-	padding: var(--space-4);
-	max-width: 400px;
-	text-align: center;
-}
-
-.terminal-reset-confirm-content p {
-	margin: 0 0 var(--space-4) 0;
-	color: var(--text-primary);
-}
-
-.terminal-reset-confirm-buttons {
-	display: flex;
-	gap: var(--space-2);
-	justify-content: center;
-}
-
-.terminal-reset-confirm-button {
-	padding: var(--space-2) var(--space-4);
-	border: none;
-	border-radius: 4px;
-	cursor: pointer;
-	font-size: 0.875rem;
-}
-
-.terminal-reset-confirm-button.cancel {
-	background: var(--bg-elevated);
-	color: var(--text-primary);
-}
-
-.terminal-reset-confirm-button.confirm {
-	background: #cd3131;
-	color: white;
-}
-
-.terminal-hidden-input {
-	position: fixed;
-	left: -9999px;
-	top: -9999px;
-	width: 1px;
-	height: 1px;
-	opacity: 0;
-	pointer-events: none;
-	user-select: none;
-	-webkit-user-select: none;
-}
-
-/* Disable zoom on mobile terminal */
-@media (max-width: 767px) {
-	.mobile-terminal-wrapper {
-		touch-action: pan-y;
-		-webkit-text-size-adjust: none;
-	}
-
-	.mobile-terminal-wrapper button,
-	.mobile-terminal-wrapper .special-key-button {
-		touch-action: manipulation;
-	}
-
-	.terminal-container {
-		touch-action: pan-y;
-		padding: 0;
-	}
-}
-
-/* Animations */
-@keyframes slideUp {
-	from {
-		transform: translateY(100%);
-	}
-	to {
-		transform: translateY(0);
-	}
-}
-
-@keyframes pulse {
-	0%,
-	100% {
-		opacity: 1;
-	}
-	50% {
-		opacity: 0.5;
-	}
-}
-
-/* Mobile Menu Overlay */
-.mobile-menu-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.5);
-	z-index: 50;
-}
-
-.mobile-menu-close {
-	position: absolute;
-	top: var(--space-2);
-	right: var(--space-2);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 36px;
-	height: 36px;
-	background: transparent;
-	border: none;
-	color: var(--text);
-	cursor: pointer;
-}
-
-/* AppShell mobile menu */
-@media (max-width: 767px) {
-	.shell-nav {
-		position: fixed;
-		top: 0;
-		left: 0;
-		bottom: 0;
-		width: 260px;
-		background: var(--bg);
-		z-index: 100;
-		transform: translateX(-100%);
-		transition: transform 0.3s ease;
-		padding-top: var(--space-8);
-	}
-
-	.shell-nav.mobile-open {
-		transform: translateX(0);
-	}
-}
-
-/* Mobile Navigation */
-.mobile-nav {
-	position: fixed;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	display: flex;
-	justify-content: space-around;
-	align-items: center;
-	background: var(--panel);
-	border-top: 1px solid var(--border);
-	padding-bottom: env(safe-area-inset-bottom, 0);
-	z-index: 100;
-	height: 64px;
-}
-
-.mobile-nav-item {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	gap: 2px;
-	padding: 8px 12px;
-	color: var(--muted);
-	text-decoration: none;
-	font-size: 11px;
-	min-width: 64px;
-	min-height: 44px;
-	border-radius: 8px;
-	transition: color 0.15s ease;
-}
-
-.mobile-nav-item.active {
-	color: var(--brand);
-}
-
-.mobile-nav-icon-wrapper {
-	position: relative;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-.mobile-nav-badge {
-	position: absolute;
-	top: -6px;
-	right: -8px;
-	background: var(--danger);
-	color: white;
-	font-size: 10px;
-	font-weight: 600;
-	min-width: 16px;
-	height: 16px;
-	border-radius: 8px;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	padding: 0 4px;
-}
-
-/* Mobile Bottom Sheet */
-.mobile-bottom-sheet-overlay {
-	position: fixed;
-	inset: 0;
-	background: rgba(0, 0, 0, 0.5);
-	z-index: 200;
-	display: flex;
-	align-items: flex-end;
-	justify-content: center;
-}
-
-.mobile-bottom-sheet {
-	background: var(--panel);
-	border-radius: 16px 16px 0 0;
-	width: 100%;
-	max-width: 600px;
-	max-height: 70vh;
-	display: flex;
-	flex-direction: column;
-	animation: slide-up 0.2s ease-out;
-}
-
-@keyframes slide-up {
-	from {
-		transform: translateY(100%);
-	}
-	to {
-		transform: translateY(0);
-	}
-}
-
-.mobile-bottom-sheet-header {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	padding: 12px 16px 8px;
-	border-bottom: 1px solid var(--border);
-}
-
-.mobile-bottom-sheet-handle {
-	width: 36px;
-	height: 4px;
-	background: var(--border);
-	border-radius: 2px;
-	margin-bottom: 8px;
-}
-
-.mobile-bottom-sheet-title {
-	font-size: 16px;
-	font-weight: 600;
-	margin: 0;
-}
-
-.mobile-bottom-sheet-content {
-	padding: 8px 0;
-	overflow-y: auto;
-}
-
-.mobile-bottom-sheet-item {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	width: 100%;
-	padding: 16px;
-	background: none;
-	border: none;
-	color: var(--text);
-	font-size: 16px;
-	text-align: left;
-	cursor: pointer;
-	min-height: 44px;
-}
-
-.mobile-bottom-sheet-item:active {
-	background: var(--hover);
-}
-
-.mobile-bottom-sheet-item.active {
-	color: var(--brand);
-}
-
-/* Mobile Page Header */
-.mobile-page-header {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	padding: var(--space-2) 0;
-	margin-bottom: var(--space-3);
-	border-bottom: 1px solid var(--border);
-}
-
-.mobile-page-header-back {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 40px;
-	height: 40px;
-	background: transparent;
-	border: none;
-	color: var(--text);
-	cursor: pointer;
-	border-radius: 8px;
-	padding: 0;
-}
-
-.mobile-page-header-back:active {
-	background: var(--color-border);
-}
-
-.mobile-page-header h1 {
-	margin: 0;
-	font-size: 1.1rem;
-	font-weight: 600;
-	flex: 1;
-}
-
-.mobile-page-header-actions {
-	display: flex;
-	gap: var(--space-2);
-}
-
-.mobile-nav-label {
-	font-size: 11px;
-	font-weight: 500;
-}
-
-/* Mobile shell content padding adjustment */
-.shell-content.mobile {
-	padding-bottom: calc(1.25rem + 64px);
-}
-
-/* Ensure minimum touch targets on mobile */
-button,
-a,
-input,
-select,
-textarea,
-[role="button"] {
-	min-height: 44px;
-	min-width: 44px;
-}
-
-/* Active states for touch feedback */
-button:active,
-a:active,
-[role="button"]:active {
-	opacity: 0.8;
-	transform: scale(0.98);
-}
-
-/* Remove transform on buttons that shouldn't scale */
-.mobile-nav-item:active,
-.mobile-action-sheet-button:active,
-.mobile-action-sheet-cancel:active {
-	transform: none;
-}
-@media (max-width: 767px) {
-	.dialog-actions {
-		flex-direction: column-reverse;
-		gap: 0.5rem;
-	}
-
-	.dialog-actions button {
-		width: 100%;
-		min-height: 44px;
-	}
-}
-
-.workspace-main {
-	padding: var(--space-2);
-}
-
-.tree-entry {
-	padding: 0.5rem;
-	min-height: 44px;
-	display: flex;
-	align-items: center;
-}
-@media (max-width: 767px) {
-	.modal-content {
-		min-width: auto;
-		width: calc(100% - 2rem);
-		max-width: 100%;
-		margin: 1rem;
-		padding: 1rem;
-		max-height: calc(100vh - 2rem);
-	}
-
-	.modal-actions {
-		flex-direction: column-reverse;
-		gap: 0.5rem;
-	}
-
-	.modal-actions button {
-		width: 100%;
-		min-height: 44px;
-	}
-}
-
-/* Mobile Sessions Page */
-@media (max-width: 767px) {
-	.sessions-page {
-		padding: var(--space-2);
-	}
-
-	.sessions-page .page-header {
-		margin-bottom: var(--space-3);
-	}
-
-	.sessions-page .page-header h1 {
-		font-size: 1.25rem;
-	}
-
-	.last-session-section {
-		margin-bottom: var(--space-4);
-	}
-
-	.last-session-section h2 {
-		font-size: 1rem;
-		margin-bottom: var(--space-2);
-	}
-
-	.create-session-section {
-		padding: var(--space-3);
-	}
-
-	.create-session-section h2 {
-		font-size: 1rem;
-		margin-bottom: var(--space-2);
-	}
-}
-
-.session-card-actions.mobile {
-	display: flex;
-	gap: var(--space-2);
-	padding-top: var(--space-3);
-	border-top: 1px solid var(--color-border);
-}
-
-.session-card-actions.mobile .mobile-primary {
-	flex: 1;
-	justify-content: center;
-	min-height: 44px;
-	padding: var(--space-2) var(--space-3);
-}
-
-.session-card-actions.mobile .mobile-more {
-	min-width: 44px;
-	min-height: 44px;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	padding: var(--space-2);
-}
-@media (max-width: 767px) {
-	.create-session-form .form-row {
-		grid-template-columns: 1fr;
-		gap: var(--space-3);
-	}
-
-	.create-session-form input,
-	.create-session-form select,
-	.create-session-form textarea,
-	.create-session-form button {
-		min-height: 44px;
-	}
-}
-
-/* Mobile Action Sheet */
-.mobile-action-sheet-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background: rgba(0, 0, 0, 0.5);
-	z-index: 200;
-	display: flex;
-	align-items: flex-end;
-	justify-content: center;
-	animation: fadeIn 0.2s ease;
-}
-
-.mobile-action-sheet {
-	background: var(--bg);
-	border-radius: 16px 16px 0 0;
-	width: 100%;
-	max-width: 500px;
-	max-height: 80vh;
-	overflow-y: auto;
-	animation: slideUp 0.3s ease;
-	padding-bottom: env(safe-area-inset-bottom, 0);
-}
-
-.mobile-action-sheet-header {
-	padding: var(--space-3) var(--space-4) var(--space-2);
-	text-align: center;
-}
-
-.mobile-action-sheet-handle {
-	width: 36px;
-	height: 4px;
-	background: var(--color-border);
-	border-radius: 2px;
-	margin: 0 auto var(--space-3);
-}
-
-.mobile-action-sheet-header h3 {
-	margin: 0;
-	font-size: 1rem;
-	font-weight: 600;
-}
-
-.mobile-action-sheet-actions {
-	display: flex;
-	flex-direction: column;
-	gap: 1px;
-	background: var(--color-border);
-	margin: 0 var(--space-2);
-	border-radius: 12px;
-	overflow: hidden;
-}
-
-.mobile-action-sheet-button {
-	display: flex;
-	align-items: center;
-	gap: var(--space-3);
-	width: 100%;
-	padding: var(--space-3) var(--space-4);
-	background: var(--bg);
-	border: none;
-	color: var(--text);
-	font-size: 1rem;
-	cursor: pointer;
-	min-height: 56px;
-	text-align: left;
-}
-
-.mobile-action-sheet-button.danger {
-	color: #cd3131;
-}
-
-.mobile-action-sheet-button:active {
-	background: var(--color-border);
-}
-
-.mobile-action-sheet-cancel {
-	display: block;
-	width: calc(100% - var(--space-4));
-	margin: var(--space-3) var(--space-2);
-	padding: var(--space-3);
-	background: var(--bg);
-	border: 1px solid var(--color-border);
-	border-radius: 12px;
-	color: var(--text);
-	font-size: 1rem;
-	font-weight: 600;
-	cursor: pointer;
-	min-height: 56px;
-}
-
-.mobile-action-sheet-cancel:active {
-	background: var(--color-border);
-}
-
-@keyframes fadeIn {
-	from {
-		opacity: 0;
-	}
-	to {
-		opacity: 1;
-	}
-}
-
-@keyframes slideUp {
-	from {
-		transform: translateY(100%);
-	}
-	to {
-		transform: translateY(0);
-	}
-}
-
-/* Git Mount Editor Styles */
-.git-mount-editor {
-	margin-top: 1rem;
-}
-
-.git-mount-editor .section-subtitle {
-	margin: 0 0 0.75rem 0;
-	font-size: 1rem;
-	font-weight: 600;
-}
-
-.git-mount-list {
-	display: flex;
-	flex-direction: column;
-	gap: 0.5rem;
-	margin-bottom: 1rem;
-}
-
-.git-mount-item {
-	background: var(--surface);
-	border: 1px solid var(--border);
-	border-radius: 0.5rem;
-	padding: 0.75rem;
-}
-
-.git-mount-display {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	gap: 0.5rem;
-}
-
-.git-mount-info {
-	display: flex;
-	flex-direction: column;
-	gap: 0.25rem;
-}
-
-.git-mount-repo {
-	font-weight: 600;
-	color: var(--text);
-}
-
-.git-mount-paths {
-	font-size: 0.875rem;
-	color: var(--text-muted);
-	font-family: monospace;
-}
-
-.git-mount-branch {
-	font-size: 0.75rem;
-	color: var(--accent);
-	background: var(--accent-bg);
-	padding: 0.125rem 0.375rem;
-	border-radius: 0.25rem;
-	width: fit-content;
-}
-
-.git-mount-actions {
-	display: flex;
-	gap: 0.25rem;
-}
-
-.git-mount-add {
-	border-top: 1px solid var(--border);
-	padding-top: 1rem;
-	margin-top: 1rem;
-}
-
-.git-mount-add h5 {
-	margin: 0 0 0.75rem 0;
-	font-size: 0.875rem;
-	font-weight: 600;
-	color: var(--text-muted);
-}
-
-.git-mount-form {
-	display: flex;
-	flex-direction: column;
-	gap: 0.75rem;
-}
-
-.git-mount-form .form-row {
-	display: flex;
-	flex-direction: column;
-	gap: 0.25rem;
-}
-
-.git-mount-form .form-row label {
-	font-size: 0.875rem;
-	font-weight: 500;
-	color: var(--text);
-}
-
-.git-mount-form .form-row input,
-.git-mount-form .form-row select {
-	padding: 0.5rem;
-	border: 1px solid var(--border);
-	border-radius: 0.375rem;
-	background: var(--bg);
-	color: var(--text);
-	font-size: 0.875rem;
-}
-
-.git-mount-form .form-row input.error,
-.git-mount-form .form-row select.error {
-	border-color: #cd3131;
-}
-
-.git-mount-form .form-row .hint {
-	font-size: 0.75rem;
-	color: var(--text-muted);
-}
-
-.git-mount-form .form-row .error-text {
-	font-size: 0.75rem;
-	color: #cd3131;
-}
-
-.git-mount-form .form-actions {
-	display: flex;
-	gap: 0.5rem;
-	margin-top: 0.5rem;
-}
-
-.new-repo-form {
-	display: flex;
-	flex-direction: column;
-	gap: 0.5rem;
-	padding: 0.75rem;
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 0.375rem;
-}
-
-.new-repo-form input {
-	padding: 0.5rem;
-	border: 1px solid var(--border);
-	border-radius: 0.375rem;
-	background: var(--surface);
-	color: var(--text);
-	font-size: 0.875rem;
-}
-
-.new-repo-actions {
-	display: flex;
-	gap: 0.5rem;
-	margin-top: 0.25rem;
-}
-
-/* Notification Center */
-.notification-center {
-	position: relative;
-	display: inline-flex;
-	z-index: 9999;
-}
-
-.notification-bell {
-	position: relative;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	padding: 0.4rem;
-	background: transparent;
-	border: none;
-	border-radius: 8px;
-	color: var(--muted);
-	cursor: pointer;
-	transition:
-		background-color 0.15s ease,
-		color 0.15s ease;
-	min-height: 36px;
-	min-width: 36px;
-}
-
-.notification-bell:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-.notification-badge {
-	position: absolute;
-	top: -2px;
-	right: -4px;
-	min-width: 18px;
-	height: 18px;
-	padding: 0 5px;
-	background: var(--danger);
-	color: white;
-	border-radius: 9px;
-	font-size: 11px;
-	font-weight: 600;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-}
-
-.notification-dropdown {
-	position: fixed;
-	width: 360px;
-	max-width: calc(100vw - 2rem);
-	max-height: 480px;
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 12px;
-	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
-	z-index: 9999;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-}
-
-.notification-dropdown-header {
-	padding: 0.75rem 1rem;
-	font-weight: 600;
-	font-size: 0.95rem;
-	border-bottom: 1px solid var(--border);
-	color: var(--ink);
-	flex-shrink: 0;
-}
-
-.notification-list {
-	list-style: none;
-	margin: 0;
-	padding: 0;
-	overflow-y: auto;
-	flex: 1;
-	min-height: 0;
-}
-
-.notification-empty {
-	padding: 2rem 1rem;
-	text-align: center;
-	color: var(--muted);
-	font-size: 0.9rem;
-}
-
-.notification-dropdown-footer {
-	padding: 0.75rem 1rem;
-	border-top: 1px solid var(--border);
-	flex-shrink: 0;
-	display: flex;
-	gap: 0.5rem;
-}
-
-.notification-mark-all {
-	flex: 1;
-	padding: 0.5rem 0.75rem;
-	background: transparent;
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	color: var(--muted);
-	font: inherit;
-	font-size: 0.85rem;
-	cursor: pointer;
-	transition: all 0.15s ease;
-}
-
-.notification-mark-all:hover {
-	background: var(--bg);
-	color: var(--ink);
-	border-color: var(--brand);
-}
-
-.notification-clear-all {
-	flex: 1;
-	padding: 0.5rem 0.75rem;
-	background: transparent;
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	color: var(--muted);
-	font: inherit;
-	font-size: 0.85rem;
-	cursor: pointer;
-	transition: all 0.15s ease;
-}
-
-.notification-clear-all:hover {
-	background: var(--bg);
-	color: var(--danger);
-	border-color: var(--danger);
-}
-
-/* Notification Item */
-.notification-item {
-	display: flex;
-	align-items: flex-start;
-	gap: 0.75rem;
-	padding: 0.75rem 1rem;
-	border-bottom: 1px solid var(--border);
-	transition: background-color 0.15s ease;
-}
-
-.notification-item:last-child {
-	border-bottom: none;
-}
-
-.notification-item:hover {
-	background: var(--bg);
-}
-
-.notification-item--unread {
-	font-weight: 500;
-	border-left: 3px solid var(--brand);
-	padding-left: calc(1rem - 3px);
-	background: color-mix(in srgb, var(--brand) 4%, var(--panel));
-}
-
-.notification-item--read {
-	opacity: 0.75;
-}
-
-.notification-item-icon {
-	flex-shrink: 0;
-	margin-top: 0.1rem;
-	color: var(--muted);
-}
-
-.notification-item-content {
-	flex: 1;
-	min-width: 0;
-	display: flex;
-	flex-direction: column;
-	gap: 0.2rem;
-}
-
-.notification-item-title {
-	font-size: 0.9rem;
-	line-height: 1.3;
-	color: var(--ink);
-}
-
-.notification-item--read .notification-item-title {
-	font-weight: 400;
-}
-
-.notification-item-time {
-	font-size: 0.8rem;
-	color: var(--muted);
-}
-
-.notification-item-actions {
-	display: flex;
-	gap: 0.35rem;
-	flex-shrink: 0;
-}
-
-.notification-item-action {
-	padding: 0.25rem 0.5rem;
-	background: transparent;
-	border: none;
-	border-radius: 6px;
-	color: var(--muted);
-	font: inherit;
-	font-size: 0.75rem;
-	cursor: pointer;
-	transition: all 0.15s ease;
-	white-space: nowrap;
-}
-
-.notification-item-action:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-@media (max-width: 767px) {
-	.notification-dropdown-backdrop {
-		position: fixed;
-		inset: 0;
-		background: rgba(0, 0, 0, 0.35);
-		z-index: 9998;
-	}
-
-	.notification-dropdown {
-		width: auto;
-		left: 0.75rem;
-		right: 0.75rem;
-		max-width: none;
-		border-radius: 12px;
-		max-height: 70vh;
-	}
-}
-
-/* Toast animations */
-@keyframes toastSlideIn {
-	from {
-		opacity: 0;
-		transform: translateX(100%);
-	}
-	to {
-		opacity: 1;
-		transform: translateX(0);
-	}
-}
-
-@keyframes toastFadeOut {
-	from {
-		opacity: 1;
-		transform: translateX(0);
-	}
-	to {
-		opacity: 0;
-		transform: translateX(100%);
-	}
-}
-
-/* ─── Workspace Detail Page ─── */
-
-.workspace-detail {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	overflow: hidden;
-}
-
-.workspace-header-link {
-	display: block;
-	text-decoration: none;
-	color: inherit;
-}
-
-.workspace-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: var(--space-4) var(--space-5);
-	border-bottom: 1px solid var(--border);
-	background: var(--panel);
-	flex-shrink: 0;
-}
-
-.workspace-breadcrumb {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	color: var(--muted);
-	font-size: var(--font-size-sm);
-}
-
-.workspace-breadcrumb .sep {
-	color: var(--border);
-}
-
-.workspace-breadcrumb strong {
-	color: var(--ink);
-	font-size: var(--font-size-lg);
-}
-
-.branch-badge {
-	display: inline-flex;
-	align-items: center;
-	gap: var(--space-1);
-	padding: var(--space-1) var(--space-3);
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 999px;
-	font-size: var(--font-size-sm);
-	color: var(--muted);
-}
-
-/* Tab Bar */
-.tab-bar {
-	display: flex;
-	gap: var(--space-1);
-	padding: var(--space-2) var(--space-5);
-	border-bottom: 1px solid var(--border);
-	background: var(--panel);
-	flex-shrink: 0;
-	overflow-x: auto;
-}
-
-.tab {
-	display: inline-flex;
-	align-items: center;
-	gap: var(--space-1);
-	padding: var(--space-2) var(--space-4);
-	border: 1px solid transparent;
-	border-radius: 10px;
-	background: none;
-	color: var(--muted);
-	font: inherit;
-	font-size: var(--font-size-sm);
-	cursor: pointer;
-	white-space: nowrap;
-	transition: all 0.15s ease;
-}
-
-.tab:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-.tab.active {
-	background: var(--brand);
-	color: var(--primary-fg);
-}
-
-/* Mobile Tab Bar */
-.mobile-tab-bar {
-	display: none;
-	position: fixed;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	justify-content: space-around;
-	padding: var(--space-2) 0;
-	background: var(--panel);
-	border-top: 1px solid var(--border);
-	z-index: 50;
-}
-
-.mobile-tab {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	gap: 2px;
-	padding: var(--space-1) var(--space-2);
-	border: none;
-	background: none;
-	color: var(--muted);
-	font: inherit;
-	font-size: var(--font-size-xs);
-	cursor: pointer;
-}
-
-.mobile-tab.active {
-	color: var(--brand);
-}
-
-/* Workspace Content */
-.workspace-content {
-	flex: 1;
-	overflow: hidden;
-	padding: var(--space-4) var(--space-5);
-	overflow-y: auto;
-}
-
-/* Files Tab */
-.files-tab {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-	height: 100%;
-}
-
-.git-toolbar {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: var(--space-3);
-	padding: var(--space-3);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	flex-wrap: wrap;
-}
-
-.git-toolbar-status {
-	display: flex;
-	gap: var(--space-2);
-}
-
-.git-toolbar-status span {
-	padding: var(--space-1) var(--space-2);
-	border-radius: 6px;
-	font-size: var(--font-size-xs);
-	font-weight: 600;
-}
-
-.status-modified {
-	background: var(--warning-light);
-	color: var(--warning);
-}
-
-.status-added {
-	background: var(--success-light);
-	color: var(--success);
-}
-
-.status-deleted {
-	background: var(--danger-light);
-	color: var(--danger);
-}
-
-.status-untracked {
-	background: rgba(107, 114, 128, 0.1);
-	color: #6b7280;
-}
-
-.git-toolbar-actions {
-	display: flex;
-	gap: var(--space-2);
-	align-items: center;
-	flex-wrap: wrap;
-}
-
-.git-toolbar-actions input {
-	padding: var(--space-1) var(--space-3);
-	border: 1px solid var(--border);
-	border-radius: 6px;
-	font: inherit;
-	background: var(--panel);
-	color: var(--ink);
-	min-width: 180px;
-}
-
-.files-split {
-	display: grid;
-	grid-template-columns: 260px 1fr;
-	gap: var(--space-4);
-	flex: 1;
-	min-height: 0;
-	overflow: hidden;
-}
-
-.file-tree {
-	overflow-y: auto;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	padding: var(--space-3);
-	background: var(--panel);
-}
-
-.tree-entry {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	width: 100%;
-	padding: var(--space-1) var(--space-2);
-	border: none;
-	border-radius: 6px;
-	background: none;
-	color: var(--ink);
-	font: inherit;
-	font-size: var(--font-size-sm);
-	text-align: left;
-	cursor: pointer;
-	white-space: nowrap;
-}
-
-.tree-entry:hover {
-	background: var(--bg);
-}
-
-.tree-entry.selected {
-	background: var(--brand);
-	color: var(--primary-fg);
-}
-
-.file-viewer {
-	display: flex;
-	flex-direction: column;
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	background: var(--panel);
-	overflow: hidden;
-}
-
-.file-viewer-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding: var(--space-3);
-	border-bottom: 1px solid var(--border);
-	background: var(--bg);
-}
-
-.file-content {
-	flex: 1;
-	padding: var(--space-4);
-	overflow: auto;
-	margin: 0;
-	font-family: "IBM Plex Mono", monospace;
-	font-size: var(--font-size-sm);
-	line-height: 1.6;
-	white-space: pre-wrap;
-}
-
-.file-editor {
-	flex: 1;
-	padding: var(--space-3);
-	border: none;
-	font-family: "IBM Plex Mono", monospace;
-	font-size: var(--font-size-sm);
-	line-height: 1.6;
-	resize: none;
-	background: var(--panel);
-	color: var(--ink);
-}
-
-.file-editor-actions {
-	display: flex;
-	justify-content: flex-end;
-	gap: var(--space-2);
-	padding: var(--space-3);
-	border-top: 1px solid var(--border);
-}
-
-/* Git Tab */
-.git-tab {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-}
-
-.git-tab-header {
-	display: flex;
-	gap: var(--space-3);
-	align-items: center;
-}
-
-.git-tab-header select {
-	padding: var(--space-2) var(--space-3);
-	border: 1px solid var(--border);
-	border-radius: 6px;
-	font: inherit;
-	background: var(--panel);
-	color: var(--ink);
-}
-
-.commit-history {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-2);
-}
-
-.commit-row {
-	display: grid;
-	grid-template-columns: 60px 1fr 120px 120px;
-	gap: var(--space-3);
-	padding: var(--space-3);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	align-items: center;
-	font-size: var(--font-size-sm);
-}
-
-.commit-hash {
-	font-family: monospace;
-	color: var(--brand);
-}
-
-.commit-message {
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}
-
-.commit-author,
-.commit-date {
-	color: var(--muted);
-	font-size: var(--font-size-xs);
-}
-
-/* Tools Tab */
-.tools-tab {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-}
-
-.empty-state-card {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	gap: var(--space-3);
-	padding: var(--space-10);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-	text-align: center;
-}
-
-.empty-state-card h3 {
-	margin: 0;
-}
-
-.empty-state-card p {
-	margin: 0;
-	color: var(--muted);
-}
-
-.instances-grid {
-	display: grid;
-	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
-	gap: var(--space-4);
-}
-
-.instance-card {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-	padding: var(--space-4);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-}
-
-.instance-card.running {
-	border-color: var(--success);
-}
-
-/* Settings Tab */
-.settings-tab {
-	max-width: 640px;
-}
-
-.settings-section {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-	padding: var(--space-5);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 14px;
-}
-
-.settings-section h3 {
-	margin: 0;
-}
-
-/* Mobile Workspace Detail */
-@media (max-width: 767px) {
-	.workspace-detail.mobile .workspace-content {
-		padding-bottom: 72px;
-	}
-
-	.mobile-tab-bar {
-		display: flex;
-	}
-
-	.files-split {
-		grid-template-columns: 1fr;
-		grid-template-rows: 1fr 1fr;
-	}
-
-	.commit-row {
-		grid-template-columns: 1fr;
-		gap: var(--space-1);
-	}
-
-	.git-toolbar {
-		flex-direction: column;
-		align-items: flex-start;
-	}
-}
-
-/* Workspace Card Link */
-.workspace-header-link {
-	display: block;
-	text-decoration: none;
-	color: inherit;
-	margin: -1rem -1rem 0;
-	padding: 1rem;
-}
-
-.workspace-header-link:hover .workspace-header h4 {
-	color: var(--brand);
-}
-
-/* ─── Projects Page Refresh ─── */
-
-.project-info-row {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	gap: var(--space-3);
-	flex-wrap: wrap;
-}
-
-.project-toggle {
-	display: flex;
-	align-items: center;
-	gap: var(--space-3);
-	background: none;
-	border: none;
-	font: inherit;
-	color: inherit;
-	cursor: pointer;
-	padding: var(--space-2);
-	border-radius: 10px;
-	flex: 1;
-}
-
-.project-toggle:hover {
-	background: var(--bg);
-}
-
-.project-toggle h3 {
-	margin: 0;
-	font-size: var(--font-size-lg);
-}
-
-.repo-count {
-	font-size: var(--font-size-xs);
-	padding: var(--space-1) var(--space-2);
-	background: var(--bg);
-	border-radius: 999px;
-	color: var(--muted);
-}
-
-.project-detail {
-	margin-top: var(--space-4);
-	padding-top: var(--space-4);
-	border-top: 1px solid var(--border);
-}
-
-.repo-list {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-}
-
-.repo-block {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-3);
-	padding: var(--space-4);
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-}
-
-.repo-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	gap: var(--space-3);
-	flex-wrap: wrap;
-}
-
-.repo-header h4 {
-	margin: 0;
-	font-size: var(--font-size-base);
-}
-
-.workspace-grid {
-	display: grid;
-	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
-	gap: var(--space-3);
-}
-
-.workspace-chip {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-1);
-	padding: var(--space-3);
-	background: var(--panel);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	font-size: var(--font-size-sm);
-}
-
-.workspace-chip a {
-	font-weight: 600;
-	color: var(--brand);
-}
-
-.workspace-chip .ws-branch {
-	color: var(--muted);
-	font-size: var(--font-size-xs);
-}
-
-.workspace-chip .ws-instances {
-	font-size: var(--font-size-xs);
-	color: var(--success);
-}
-
-.workspace-chip .ws-actions {
-	display: flex;
-	gap: var(--space-1);
-	margin-top: var(--space-1);
-}
-
-.workspace-chip .ws-actions button {
-	background: none;
-	border: none;
-	color: var(--muted);
-	cursor: pointer;
-	padding: var(--space-1);
-	border-radius: 4px;
-}
-
-.workspace-chip .ws-actions button:hover {
-	background: var(--bg);
-	color: var(--ink);
-}
-
-.workspace-chip .ws-actions button.danger-text:hover {
-	color: var(--danger);
-}
-
-/* ─── Workspace Create Inline ─── */
-
-.workspace-create-inline {
-	padding: var(--space-5);
-	margin-bottom: var(--space-5);
-}
-
-.workspace-create-inline h3 {
-	margin: 0 0 var(--space-4) 0;
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-}
-
-.workspace-create-form-grid {
-	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-	gap: var(--space-4);
-	align-items: end;
-}
-
-.workspace-create-form-grid .form-group {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-1);
-}
-
-.workspace-create-form-grid label {
-	font-size: var(--font-size-sm);
-	color: var(--muted);
-}
-
-.workspace-create-form-grid input,
-.workspace-create-form-grid select {
-	padding: var(--space-2) var(--space-3);
-	border: 1px solid var(--border);
-	border-radius: 8px;
-	font: inherit;
-	background: var(--panel);
-	color: var(--ink);
-}
-
-.workspace-create-form-grid .form-actions {
-	display: flex;
-	gap: var(--space-3);
-	justify-content: flex-end;
-	margin-top: var(--space-2);
-}
-
-/* ─── Tool Starter ─── */
-.tool-starter {
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-4);
-}
-
-.tool-starter-context {
-	background: var(--bg);
-	border: 1px solid var(--border);
-	border-radius: 10px;
-	padding: var(--space-3);
-	display: flex;
-	flex-direction: column;
-	gap: var(--space-2);
-}
-
-.context-row {
-	display: flex;
-	align-items: center;
-	gap: var(--space-3);
-	flex-wrap: wrap;
-}
-
-.context-label {
-	font-size: var(--font-size-sm);
-	color: var(--muted);
-	min-width: 80px;
-}
-
-.context-value {
-	font-weight: 500;
-}
-
-.ssh-key-status {
-	padding: var(--space-2);
-	background: var(--bg);
-	border-radius: 8px;
-}
-
-.ssh-key-status .success-text,
-.ssh-key-status .warning-text {
-	display: flex;
-	align-items: center;
-	gap: var(--space-2);
-	font-size: var(--font-size-sm);
-}
-
-/* ─── Instance Chips ─── */
-.instance-chips {
-	display: flex;
-	flex-wrap: wrap;
-	gap: var(--space-2);
-	margin-top: var(--space-2);
-}
-
-.instance-chip {
-	display: inline-flex;
-	align-items: center;
-	gap: var(--space-1);
-	padding: 0.2rem 0.5rem;
-	border-radius: 999px;
-	font-size: var(--font-size-sm);
-	background: var(--bg);
-	border: 1px solid var(--border);
-}
-
-.instance-chip.running {
-	background: var(--success-light);
-	border-color: var(--success);
-	color: var(--success);
-}
-
-.instance-chip.starting,
-.instance-chip.building,
-.instance-chip.probing {
-	background: var(--warning-light);
-	border-color: var(--warning);
-	color: var(--warning);
-}
-
-.instance-chip.error,
-.instance-chip.unhealthy,
-.instance-chip.stopped {
-	background: var(--danger-light);
-	border-color: var(--danger);
-	color: var(--danger);
-}
-
-.instance-chip a {
-	font-size: 0.75rem;
-	opacity: 0.7;
-}
-
-.instance-chip a:hover {
-	opacity: 1;
-}
-
-/* ─── Tool Starter Header ─── */
-.tool-starter-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	margin-bottom: var(--space-3);
-	padding-bottom: var(--space-2);
-	border-bottom: 1px solid var(--border);
-}
-
-.tool-starter-header h4 {
-	margin: 0;
-}
-
-/* ─── Floating Action Button ─── */
-.start-tool-fab {
-	position: fixed;
-	bottom: 2rem;
-	right: 2rem;
-	z-index: 100;
-	width: 3.5rem;
-	height: 3.5rem;
-	border-radius: 50%;
-	background: var(--primary);
-	color: var(--primary-fg);
-	border: none;
-	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
-	cursor: pointer;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	transition:
-		transform 0.15s ease,
-		box-shadow 0.15s ease;
-}
-
-.start-tool-fab:hover {
-	transform: scale(1.08);
-	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
-}
-
-.start-tool-fab:active {
-	transform: scale(0.95);
-}
-
-.start-tool-modal {
-	max-width: 480px;
-	width: 90vw;
-}
-
-.modal-header {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	margin-bottom: var(--space-3);
-}
-
-.modal-header h3 {
-	margin: 0;
-}
-
-@media (max-width: 640px) {
-	.start-tool-fab {
-		bottom: 5rem; /* above mobile tab bar */
-		right: 1rem;
-		width: 3rem;
-		height: 3rem;
-	}
-}