/* Vibetiles: the design-system components the panel wears (its buttons,
   its segmented rows, its sheet), and the floor they all stand on. GENERATED by
   tools/build-plugin.py from the theme's assets/css/quire.css; loaded only where
   the plugin is a guest. */
:where(.reading-panel) :is(button, input, select, textarea):not(#live-design-panel-guard) {
	all: revert;
}
:not(#live-design-panel-guard) .reading-panel, :not(#live-design-panel-guard) .reading-panel *, :not(#live-design-panel-guard) .reading-panel *::before, :not(#live-design-panel-guard) .reading-panel *::after, .architrave-panel-opener, .architrave-panel-opener * {
	box-sizing: border-box;
}
:not(#live-design-panel-guard) .reading-panel :focus-visible, .architrave-panel-opener:focus-visible {
	outline: var(--focus-ring-width) solid var(--focus);
	outline-offset: var(--focus-ring-offset);
}
:not(#live-design-panel-guard) .reading-panel :is(.quire-input, .quire-textarea, input[type="text"], input[type="search"], textarea) {
	transition: border-color var(--motion-duration-fast, 120ms) ease, background-color var(--motion-duration-fast, 120ms) ease;
}
:not(#live-design-panel-guard) .reading-panel :is(.quire-input, .quire-textarea, input[type="text"], input[type="search"], textarea)::placeholder {
	color: var(--text-secondary);
	opacity: 1;
}
:not(#live-design-panel-guard) .reading-panel :is(.quire-input, .quire-textarea, input[type="text"], input[type="search"], textarea):hover:not(:focus) {
	border-color: var(--text-secondary) !important;
	background-color: var(--surface-hover) !important;
}
:not(#live-design-panel-guard) .reading-panel :is(.quire-input, .quire-textarea, input[type="text"], input[type="search"], textarea):focus {
	border-color: var(--text-secondary) !important;
	outline: var(--focus-ring-width) solid var(--focus) !important;
	outline-offset: var(--focus-ring-offset) !important;
}
:not(#live-design-panel-guard) .quire-surface {
	background: var(--interaction-surface, var(--surface-canvas));
}
@supports (color: color-mix(in oklab, white, black)) {
	:not(#live-design-panel-guard) .quire-surface {
		--surface-hover: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-hover)
		);
		--surface-selected: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-selected)
		);
		--surface-pressed: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-pressed)
		);
		--border-subtle: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-border-subtle)
		);
		--border-default: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-border-default)
		);
		--border-strong: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-border-strong)
		);
		--border: var(--border-default);
	}
}
:not(#live-design-panel-guard) .quire-segmented {
	font-family: var(--font-sans);
	--groove: var(--space-1);
	display: inline-flex;
	gap: var(--layout-row-stack-gap);
	padding: var(--groove);
	border: var(--border-width-default) solid transparent;
	border-radius: var(--radius-lg);
	background: var(--surface-track);
}
@supports (color: color-mix(in oklab, white, black)) {
	:not(#live-design-panel-guard) .quire-segmented {
		--surface-track: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-hover)
		);
		--surface-hover: color-mix(
		in oklab,
		var(--surface-track),
		var(--text-primary) var(--step-surface-hover)
		);
		--surface-selected: color-mix(
		in oklab,
		var(--surface-track),
		var(--text-primary) var(--step-surface-selected)
		);
		--surface-pressed: color-mix(
		in oklab,
		var(--surface-track),
		var(--text-primary) var(--step-surface-pressed)
		);
		--surface-track-selected: color-mix(
		in oklab,
		var(--surface-track),
		white var(--step-track-selected)
		);
	}
	:not(#live-design-panel-guard) .quire-segmented.is-plain {
		--surface-hover: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-hover)
		);
		--surface-selected: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-selected)
		);
		--surface-pressed: color-mix(
		in oklab,
		var(--interaction-surface, var(--surface-canvas)),
		var(--text-primary) var(--step-surface-pressed)
		);
	}
}
:not(#live-design-panel-guard) .quire-segmented :is(button, a) {
	height: var(--layout-row-min-height);
	text-decoration: none;
	padding: 0 var(--space-3);
	border: 0;
	border-radius: calc(var(--radius-lg) - var(--groove));
	background: transparent;
	color: var(--text-muted);
	font-size: var(--text-sm-contextual);
	line-height: var(--text-sm-line-height);
	transition: background-color var(--motion-duration-feedback)
	var(--motion-easing-standard);
}
:not(#live-design-panel-guard) .quire-segmented a {
	display: inline-flex;
	align-items: center;
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-segmented :is(button, a):hover:not(.is-active) {
		background: color-mix(in oklab, var(--surface-track), var(--text-primary) var(--step-surface-selected));
		color: var(--text);
	}
}
:not(#live-design-panel-guard) .quire-segmented :is(button, a).is-active {
	background: var(--surface-track-selected);
	color: var(--text);
	box-shadow: var(--elevation-control);
}
:not(#live-design-panel-guard) .quire-segmented :is(button, a):active:not(.is-active) {
	background: var(--surface-pressed);
	color: var(--text);
	box-shadow: none;
}
:not(#live-design-panel-guard) .quire-segmented.is-icon :is(button, a) {
	display: grid;
	width: var(--layout-control-height-compact);
	height: var(--layout-control-height-compact);
	padding: 0;
	place-items: center;
	color: var(--text-subtle);
}
:not(#live-design-panel-guard) .quire-segmented.is-icon :is(button, a) svg {
	width: var(--icon-control);
	height: var(--icon-control);
	stroke-width: var(--icon-stroke-width);
}
:not(#live-design-panel-guard) .quire-segmented.is-plain {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-1);
	padding: 0;
	border: 0;
	background: none;
}
:not(#live-design-panel-guard) .quire-segmented.is-plain :is(button, a) {
	height: var(--layout-control-height-compact);
	padding: 0 var(--space-2);
}
:not(#live-design-panel-guard) .quire-segmented.is-plain :is(button, a).is-active {
	background: var(--surface-selected);
	box-shadow: none;
}
:not(#live-design-panel-guard) .quire-segmented.is-plain :is(button, a):active {
	background: var(--surface-pressed);
}
:not(#live-design-panel-guard) .quire-selectmenu-trigger .quire-menu-icon svg, :not(#live-design-panel-guard) .quire-selectmenu-list li .quire-menu-icon svg {
	color: var(--text-muted);
}
:not(#live-design-panel-guard) .quire-button {
	display: inline-flex;
	height: var(--layout-control-height);
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	padding: 0 var(--space-3);
	border: var(--border-width-default) solid transparent;
	border-radius: var(--radius-control);
	background: var(--surface-hover);
	color: var(--text);
	font-family: var(--font-sans);
	font-size: var(--text-base);
	font-weight: var(--font-weight-medium);
	line-height: 1;
	white-space: nowrap;
	--button-glyph: var(--icon-control);
}
:not(#live-design-panel-guard) .quire-button svg {
	flex: 0 0 auto;
	width: var(--button-glyph);
	height: var(--button-glyph);
	stroke-width: var(--icon-stroke-width);
}
:not(#live-design-panel-guard) .quire-button :is(
  .quire-external-mark,
  .quire-menu-chevron,
  .quire-menu-check
) {
	width: var(--button-glyph);
	height: var(--button-glyph);
	margin-inline-start: 0;
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button:hover {
		background: var(--surface-selected);
	}
}
:not(#live-design-panel-guard) .quire-button:active {
	background: var(--surface-pressed);
}
:not(#live-design-panel-guard) .quire-button:disabled, :not(#live-design-panel-guard) .quire-button[aria-disabled="true"] {
	background: var(--surface-subtle);
	border-color: transparent;
	color: var(--text-disabled);
	cursor: not-allowed;
}
:not(#live-design-panel-guard) .quire-button.ghost:disabled, :not(#live-design-panel-guard) .quire-button.ghost[aria-disabled="true"] {
	background: transparent;
	border-color: transparent;
	color: var(--text-disabled);
}
:not(#live-design-panel-guard) .quire-button:disabled:active, :not(#live-design-panel-guard) .quire-button[aria-disabled="true"]:active, :not(#live-design-panel-guard) .quire-button.ghost:disabled:active, :not(#live-design-panel-guard) .quire-button.ghost[aria-disabled="true"]:active {
	background: transparent;
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button:disabled:hover, :not(#live-design-panel-guard) .quire-button[aria-disabled="true"]:hover, :not(#live-design-panel-guard) .quire-button.ghost:disabled:hover, :not(#live-design-panel-guard) .quire-button.ghost[aria-disabled="true"]:hover {
		background: transparent;
	}
}
:not(#live-design-panel-guard) .quire-button:disabled:active, :not(#live-design-panel-guard) .quire-button[aria-disabled="true"]:active {
	background: var(--surface-subtle);
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button:disabled:hover, :not(#live-design-panel-guard) .quire-button[aria-disabled="true"]:hover {
		background: var(--surface-subtle);
	}
}
:not(#live-design-panel-guard) .quire-button.primary {
	border-color: transparent;
	background: var(--accent);
	color: var(--accent-contrast);
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button.primary:hover {
		opacity: var(--opacity-fill-hover);
	}
}
:not(#live-design-panel-guard) .quire-button.primary:active {
	opacity: var(--opacity-fill-active);
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button.ghost:hover {
		background: var(--surface-hover);
	}
}
:not(#live-design-panel-guard) .quire-button.ghost:active {
	background: var(--surface-selected);
}
:not(#live-design-panel-guard) .quire-button.ghost {
	border-color: transparent;
	background: transparent;
	color: var(--text-muted);
}
:not(#live-design-panel-guard) .quire-button.danger {
	border-color: transparent;
	background: var(--danger);
	color: var(--text-inverse);
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-button.danger:hover {
		background: var(--danger-hover);
	}
}
:not(#live-design-panel-guard) .quire-button.medium {
	height: var(--layout-control-height);
	padding: 0 var(--space-3);
	font-size: var(--text-base);
}
:not(#live-design-panel-guard) .quire-button.small {
	height: var(--layout-control-height-compact);
	padding: 0 var(--space-2-5);
	font-size: var(--text-sm-contextual);
	--button-glyph: var(--icon-inline);
}
:not(#live-design-panel-guard) .quire-button.large {
	height: var(--layout-control-height-large);
	padding: 0 var(--space-4);
	font-size: var(--text-base);
}
:not(#live-design-panel-guard) .quire-input {
	inline-size: 100%;
	min-width: 0;
	min-height: var(--layout-control-height);
	padding: 0 var(--layout-row-padding-inline);
	border: var(--border-width-default) solid var(--border-control);
	border-radius: var(--radius-control);
	background: var(--surface);
	color: var(--text-primary);
	font-family: var(--font-sans);
	font-size: var(--text-base);
}
:not(#live-design-panel-guard) .quire-input::placeholder {
	color: var(--text-subtle);
}
:not(#live-design-panel-guard) .quire-input:focus {
	outline: var(--focus-ring-width) solid var(--focus);
	outline-offset: var(--focus-ring-offset);
}
:not(#live-design-panel-guard) .quire-input:disabled {
	background: var(--surface-subtle);
	border-color: var(--border);
	color: var(--text-disabled);
	cursor: not-allowed;
}
:not(#live-design-panel-guard) .quire-input:disabled::placeholder {
	color: var(--text-disabled);
}
:not(#live-design-panel-guard) .quire-menu {
	font-family: var(--font-sans);
	display: flex;
	flex-direction: column;
	gap: var(--layout-row-stack-gap);
	min-width: var(--layout-menu-min-width);
	margin: 0;
	list-style: none;
	background: var(--surface-raised);
	--card-padding: var(--layout-menu-padding);
	padding: var(--card-padding);
	border-radius: calc(var(--card-padding) + var(--radius-control-base));
	box-shadow: var(--elevation-floating);
}
:not(#live-design-panel-guard) .quire-menu[hidden] {
	display: none;
}
:not(#live-design-panel-guard) .quire-menu {
	animation: quire-menu-in var(--motion-duration-reveal)
	var(--motion-easing-standard);
}
:not(#live-design-panel-guard) .quire-menu-branch {
	position: relative;
	display: flex;
	flex-direction: column;
}
:not(#live-design-panel-guard) .quire-menu-item {
	display: flex;
	width: 100%;
	min-height: var(--layout-row-min-height);
	align-items: center;
	gap: var(--layout-menu-item-gap);
	padding: 0 var(--layout-menu-item-padding-inline);
	border: 0;
	border-radius: var(--radius-control);
	background: transparent;
	color: var(--text-primary);
	font-family: inherit;
	font-size: var(--text-base);
	line-height: var(--text-base-line-height);
	text-align: start;
	cursor: pointer;
	transition: background-color var(--motion-duration-feedback)
	var(--motion-easing-standard);
}
:not(#live-design-panel-guard) a.quire-menu-item {
	text-decoration: none;
}
:not(#live-design-panel-guard) .quire-menu-separator {
	height: 0;
	margin-block: calc(
	var(--layout-menu-separator-air) - var(--layout-row-stack-gap)
	);
	margin-inline: var(--layout-menu-item-padding-inline);
	border: 0;
	border-top: var(--border-width-default) solid var(--border);
}
:not(#live-design-panel-guard) .quire-menu .quire-nav-section + .quire-nav-section, :not(#live-design-panel-guard) .quire-menu .quire-nav-section-items + .quire-nav-section {
	position: relative;
	margin-top: calc(
	var(--layout-menu-separator-air) - var(--layout-row-stack-gap)
	);
	padding-top: var(--layout-menu-separator-air);
	border-top: var(--border-width-default) solid transparent;
}
:not(#live-design-panel-guard) .quire-menu .quire-nav-section + .quire-nav-section::before, :not(#live-design-panel-guard) .quire-menu .quire-nav-section-items + .quire-nav-section::before {
	content: "";
	position: absolute;
	inset-block-start: calc(-1 * var(--border-width-default));
	inset-inline: var(--layout-menu-item-padding-inline);
	border-block-start: var(--border-width-default) solid var(--border);
}
:not(#live-design-panel-guard) .quire-menu-item.is-open {
	background: var(--surface-hover);
}
@media (hover: hover) {
	:not(#live-design-panel-guard) .quire-menu-item:hover {
		background: var(--surface-hover);
	}
}
:not(#live-design-panel-guard) .quire-menu-item:active, :not(#live-design-panel-guard) .quire-menu-item.is-selected {
	background: var(--surface-selected);
}
:not(#live-design-panel-guard) .quire-menu-icon {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	color: var(--text-muted);
}
:not(#live-design-panel-guard) .quire-menu-icon svg, :not(#live-design-panel-guard) .quire-menu-chevron, :not(#live-design-panel-guard) .quire-menu-check {
	width: var(--icon-control);
	height: var(--icon-control);
	stroke-width: var(--icon-stroke-width);
}
:not(#live-design-panel-guard) .quire-menu-label {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
:not(#live-design-panel-guard) .quire-menu-chevron {
	flex: 0 0 auto;
	margin-inline-start: auto;
	color: inherit;
}
:not(#live-design-panel-guard) .quire-menu-check {
	flex: 0 0 auto;
	margin-inline-start: auto;
	color: inherit;
}
:not(#live-design-panel-guard) .quire-srow .quire-input {
	width: min(100%, 320px);
}
@media (forced-colors: active) {
	:not(#live-design-panel-guard) .quire-button.primary {
		border: var(--border-width-default) solid ButtonText;
	}
}
:not(#live-design-panel-guard) .quire-activity-note .quire-button {
	margin-inline-start: var(--space-2);
}