/* @tunnel-grandfather: legacy/admin/game CSS — selectors are stable and page-scoped; registry conflicts are cross-page false positives; ID selectors intentional and working; refactor risk exceeds value. W3 2026-10-08. */
/* B"H
 * Boruch Hashem
 * Blessed is He
 *
 * The Awtsmoos arranges the visible roof while Awtsmoos.com keeps brand, search, actions, and stage
 * inside one bounded Docs shell whose layers are named for purpose rather than numbered by fear.
 */
body[data-geelooy-route="docs"] .skip-link {
	position: fixed;
	z-index: var(--docs-layer-skip);
	inset-inline-start: max(16px, env(safe-area-inset-left));
	inset-block-start: -80px;
	padding: 10px 14px;
	border-radius: var(--radius-sm);
	background: var(--accent);
	color: var(--bg);
	transition: inset-block-start .18s ease;
}

body[data-geelooy-route="docs"] .skip-link:focus {
	inset-block-start: max(12px, env(safe-area-inset-top));
}

body[data-geelooy-route="docs"] .topbar {
	position: sticky;
	z-index: var(--docs-layer-topbar);
	top: 0;
	display: grid;
	grid-template-columns: var(--nav-width) minmax(280px, 620px) 1fr;
	align-items: center;
	gap: 20px;
	min-inline-size: 0;
	min-block-size: var(--topbar);
	padding: max(8px, env(safe-area-inset-top)) max(22px, env(safe-area-inset-right)) 8px max(22px, env(safe-area-inset-left));
	border-bottom: 1px solid var(--line);
	background: color-mix(in srgb, var(--bg) 88%, transparent);
	backdrop-filter: blur(18px) saturate(140%);
}

body[data-geelooy-route="docs"] .brand {
	display: flex;
	align-items: center;
	gap: 11px;
	min-inline-size: 0;
	text-decoration: none;
}

body[data-geelooy-route="docs"] .brand-mark {
	display: grid;
	inline-size: 38px;
	block-size: 38px;
	flex: 0 0 auto;
	place-items: center;
	border: 1px solid var(--line-strong);
	border-radius: 12px;
	background: linear-gradient(145deg, var(--accent-soft), transparent);
	color: var(--accent);
	font: 700 1.25rem var(--font-serif);
}

body[data-geelooy-route="docs"] .brand :where(strong, small) {
	display: block;

  color: var(--aw-text); /* B"H tunnel CSS law: explicit theme-safe text color */}

body[data-geelooy-route="docs"] .brand small {
	margin-block-start: 1px;
	color: var(--muted);
	font-size: .72rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

body[data-geelooy-route="docs"] .top-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	min-inline-size: 0;
}

body[data-geelooy-route="docs"] .app-shell {
	display: grid;
	grid-template-columns: var(--nav-width) minmax(0, 1fr) var(--context-width);
	min-inline-size: 0;
	min-block-size: calc(100dvh - var(--topbar));
}

body[data-geelooy-route="docs"] .mobile-only {
	display: none;
}