/* QuoteRecon design system: components. Shared by public pages and the application. */

/* ---------- Buttons ---------- */
.qr-btn {
	--btn-bg: var(--q-surface);
	--btn-fg: var(--q-text);
	--btn-line: var(--q-line-strong);
	--btn-hover-bg: var(--q-surface-3);
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--q-2);
	min-height: var(--q-control-h);
	padding: 0 var(--q-4);
	border: 1px solid var(--btn-line);
	border-radius: var(--q-r);
	background: var(--btn-bg);
	color: var(--btn-fg);
	font-size: var(--q-fs-md);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(10, 31, 82, 0.05);
	transition: background-color var(--q-dur-2) var(--q-ease), background-position 0.6s var(--q-ease-out), border-color var(--q-dur-2) var(--q-ease), color var(--q-dur-1) var(--q-ease), box-shadow var(--q-dur-3) var(--q-ease-out), translate var(--q-dur-3) var(--q-ease-out), transform var(--q-dur-1) var(--q-ease);
}
.qr-btn:hover { background-color: var(--btn-hover-bg); color: var(--btn-fg); }
.qr-btn:active:not(:disabled) { transform: translateY(1px); }
.qr-btn:disabled, .qr-btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none; }
.qr-btn .qr-next-icon { width: 1rem; height: 1rem; transition: translate var(--q-dur-3) var(--q-ease-out); }
.qr-btn:hover .qr-next-icon[data-icon-nudge], .qr-btn--primary:hover > .qr-next-icon:last-child { translate: 2px 0; }
/* Filled actions: a gradient that keeps 4.5:1 behind white text, a soft glow and a passing sheen on hover. */
.qr-btn--primary, .qr-btn--pro {
	--btn-fg: #ffffff;
	--btn-line: transparent;
	--btn-hover-bg: #0b3fc4;
	overflow: hidden;
	background: var(--q-grad) #1466f0;
	background-size: 170% 100%;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.22) inset, 0 8px 20px -10px rgba(20, 102, 240, 0.85);
}
.qr-btn--pro { --btn-hover-bg: #3b12d9; background: var(--q-grad-pro) #7a22e8; background-size: 170% 100%; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.22) inset, 0 8px 20px -10px rgba(122, 34, 232, 0.9); }
.qr-btn--primary::after, .qr-btn--pro::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 45%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.38), transparent); transform: translateX(-140%) skewX(-18deg); pointer-events: none; }
.qr-btn:is(.qr-btn--primary, .qr-btn--pro):hover:not(:disabled) { background-position: 100% 0; color: #fff; translate: 0 -1px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset, 0 14px 28px -12px rgba(20, 102, 240, 0.9); }
.qr-btn--pro:hover:not(:disabled) { box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset, 0 14px 28px -12px rgba(122, 34, 232, 0.95) !important; }
.qr-btn:is(.qr-btn--primary, .qr-btn--pro):hover:not(:disabled)::after { animation: qr-sheen 0.9s var(--q-ease-out); }
.qr-btn:is(.qr-btn--primary, .qr-btn--pro):disabled { background: var(--q-surface-3); color: var(--q-text-3); }
.qr-btn:not(.qr-btn--primary):not(.qr-btn--pro):not(.qr-btn--ghost):not(.qr-btn--quiet):hover:not(:disabled) { border-color: var(--q-accent-line); box-shadow: 0 6px 16px -10px rgba(20, 102, 240, 0.45); }
.qr-btn--ghost { --btn-bg: transparent; --btn-line: transparent; --btn-fg: var(--q-text-2); box-shadow: none; }
.qr-btn--ghost:hover { --btn-fg: var(--q-text); }
.qr-btn--quiet { --btn-bg: transparent; --btn-line: transparent; --btn-fg: var(--q-accent-text); --btn-hover-bg: var(--q-accent-soft); box-shadow: none; }
.qr-btn--danger { --btn-fg: var(--q-danger); }
.qr-btn--sm { min-height: 1.875rem; padding: 0 var(--q-3); font-size: var(--q-fs-sm); gap: 0.375rem; }
@media (pointer: coarse) { .qr-btn--sm { min-height: 2.25rem; } }
.qr-btn--lg { min-height: var(--q-control-h-lg); padding: 0 var(--q-5); font-size: var(--q-fs-base); }
.qr-btn--icon { padding: 0; width: var(--q-control-h); }
.qr-btn--icon.qr-btn--sm { width: 1.875rem; }
.qr-btn--block { width: 100%; }
.qr-btn[aria-busy="true"] { color: transparent !important; pointer-events: none; }
.qr-btn[aria-busy="true"]::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 1rem; height: 1rem;
	border: 2px solid var(--btn-fg);
	border-right-color: transparent;
	border-radius: 50%;
	animation: qr-spin 700ms linear infinite;
}

/* ---------- Fields ---------- */
.qr-field { display: grid; gap: 0.375rem; }
.qr-field > label, .qr-label { color: var(--q-text); font-size: var(--q-fs-sm); font-weight: 600; }
.qr-hint { color: var(--q-text-3); font-size: var(--q-fs-xs); }
.qr-input, .qr-select, .qr-textarea {
	width: 100%;
	min-height: var(--q-control-h);
	padding: 0.4375rem var(--q-3);
	border: 1px solid var(--q-line-input);
	border-radius: var(--q-r);
	background: var(--q-surface);
	color: var(--q-text);
	font-size: var(--q-fs-md);
	line-height: 1.4;
	box-shadow: 0 1px 2px rgba(10, 31, 82, 0.04) inset;
	transition: border-color var(--q-dur-1) var(--q-ease), box-shadow var(--q-dur-2) var(--q-ease), background-color var(--q-dur-2) var(--q-ease);
}
.qr-textarea { min-height: 5.5rem; resize: vertical; line-height: var(--q-lh); }
.qr-input::placeholder, .qr-textarea::placeholder { color: var(--q-text-3); opacity: 1; }
.qr-input:hover, .qr-select:hover, .qr-textarea:hover { border-color: var(--q-text-3); }
.qr-input:focus, .qr-select:focus, .qr-textarea:focus { border-color: var(--q-accent); outline: 2px solid var(--q-focus); outline-offset: 2px; box-shadow: 0 0 0 4px var(--q-accent-soft); }
.qr-input[aria-invalid="true"] { border-color: var(--q-danger); }
.qr-search { position: relative; display: block; }
.qr-search > .qr-next-icon { position: absolute; top: 50%; left: 0.625rem; width: 1rem; height: 1rem; color: var(--q-text-3); transform: translateY(-50%); pointer-events: none; }
.qr-search > .qr-input { padding-left: 2.125rem; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--q-accent); width: 1rem; height: 1rem; margin: 0; }

/* ---------- Tags (status labels) ---------- */
.qr-tag {
	--tag-fg: var(--q-text-2);
	--tag-bg: var(--q-surface-3);
	--tag-line: var(--q-line);
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	min-height: 1.375rem;
	padding: 0 0.5rem;
	border: 1px solid var(--tag-line);
	border-radius: var(--q-r-pill);
	background: var(--tag-bg);
	color: var(--tag-fg);
	font-size: var(--q-fs-xs);
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}
.qr-tag--plain { padding: 0; border: 0; background: none; min-height: 0; }
.qr-tag--dot::before { content: ""; flex: none; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.qr-tag--diff { --tag-fg: var(--q-diff); --tag-bg: var(--q-diff-bg); --tag-line: var(--q-diff-line); }
.qr-tag--missing { --tag-fg: var(--q-missing); --tag-bg: var(--q-missing-bg); --tag-line: var(--q-missing-line); }
.qr-tag--extra { --tag-fg: var(--q-extra); --tag-bg: var(--q-extra-bg); --tag-line: var(--q-extra-line); }
.qr-tag--review { --tag-fg: var(--q-review); --tag-bg: var(--q-review-bg); --tag-line: var(--q-review-line); border-style: dashed; }
.qr-tag--match, .qr-tag--ok { --tag-fg: var(--q-match); --tag-bg: var(--q-match-bg); --tag-line: var(--q-match-line); }
.qr-tag--excluded { --tag-fg: var(--q-excluded); --tag-bg: var(--q-excluded-bg); --tag-line: var(--q-excluded-line); }
.qr-tag--warn { --tag-fg: var(--q-warn); --tag-bg: var(--q-warn-bg); --tag-line: var(--q-warn-line); }
.qr-tag--danger { --tag-fg: var(--q-danger); --tag-bg: var(--q-danger-bg); --tag-line: var(--q-danger-line); }
.qr-tag--info { --tag-fg: var(--q-info); --tag-bg: var(--q-info-bg); --tag-line: var(--q-info-line); }
.qr-tag--pro { --tag-fg: #ffffff; --tag-line: transparent; background: var(--q-grad-pro) #7a22e8; font-weight: 750; letter-spacing: 0.05em; box-shadow: 0 4px 10px -6px rgba(122, 34, 232, 0.9); }

/* ---------- Tabs / segmented filters ---------- */
.qr-tabs {
	display: flex;
	gap: var(--q-1);
	overflow-x: auto;
	scrollbar-width: none;
	border-bottom: 1px solid var(--q-line);
}
.qr-tabs::-webkit-scrollbar { display: none; }
.qr-tabs > :is(button, a) {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.4375rem;
	flex: none;
	min-height: 2.5rem;
	padding: 0 var(--q-3);
	border: 0;
	background: none;
	color: var(--q-text-2);
	font-size: var(--q-fs-md);
	font-weight: 550;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: color var(--q-dur-1) var(--q-ease);
}
.qr-tabs > :is(button, a)::after {
	content: "";
	position: absolute;
	right: var(--q-2); bottom: -1px; left: var(--q-2);
	height: 2px;
	border-radius: 2px 2px 0 0;
	background: var(--q-grad-vivid);
	transform: scaleX(0);
	transition: transform var(--q-dur-3) var(--q-ease-out);
}
.qr-tabs > :is(button, a):hover { color: var(--q-text); }
.qr-tabs > :is(button, a):hover::after { transform: scaleX(0.35); opacity: 0.6; }
.qr-tabs > :is([aria-pressed="true"], [aria-current="page"], [aria-selected="true"]) { color: var(--q-text); font-weight: 650; }
.qr-tabs > :is([aria-pressed="true"], [aria-current="page"], [aria-selected="true"])::after { transform: scaleX(1); }
.qr-tabs .qr-count { color: var(--q-text-3); font-size: var(--q-fs-xs); font-weight: 600; font-variant-numeric: tabular-nums; }
.qr-tabs [data-empty="true"] { color: var(--q-text-3); }

.qr-segmented { display: inline-flex; padding: 3px; gap: 2px; border: 1px solid var(--q-line); border-radius: var(--q-r-pill); background: var(--q-surface-2); }
.qr-segmented > :is(a, button) { display: inline-flex; align-items: center; gap: var(--q-2); min-height: 1.875rem; padding: 0 var(--q-3); border: 0; border-radius: var(--q-r-pill); transition: background-color var(--q-dur-2) var(--q-ease), color var(--q-dur-2) var(--q-ease); background: none; color: var(--q-text-2); font-size: var(--q-fs-sm); font-weight: 600; text-decoration: none; }
.qr-segmented > :is([aria-current="page"], [aria-pressed="true"]) { background: var(--q-surface); color: var(--q-text); box-shadow: var(--q-shadow-1), 0 0 0 1px var(--q-line); }

/* ---------- Panels ---------- */
.qr-panel { border: 1px solid var(--q-line); border-radius: var(--q-r-lg); background: var(--q-surface); box-shadow: var(--q-shadow-card); }
.qr-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--q-3); min-height: 3.25rem; padding: var(--q-3) var(--q-5); border-bottom: 1px solid var(--q-line); }
.qr-panel__head h2, .qr-panel__head h3 { font-size: var(--q-fs-base); font-weight: 700; letter-spacing: -0.01em; }
.qr-panel__body { padding: var(--q-5); }

.qr-eyebrow { color: var(--q-text-3); font-size: var(--q-fs-xs); font-weight: 600; letter-spacing: 0.01em; }
.qr-muted { color: var(--q-text-3); }
.qr-meta { color: var(--q-text-3); font-size: var(--q-fs-sm); }
.qr-mono { font-family: var(--q-font-mono); font-size: 0.9em; }

/* ---------- Notices ---------- */
.qr-notice {
	--n-fg: var(--q-info); --n-bg: var(--q-info-bg); --n-line: var(--q-info-line);
	display: flex;
	gap: var(--q-3);
	align-items: flex-start;
	padding: var(--q-3) var(--q-4);
	position: relative;
	overflow: hidden;
	border: 1px solid var(--n-line);
	border-radius: var(--q-r);
	background: var(--n-bg);
	color: var(--q-text);
	font-size: var(--q-fs-md);
}
.qr-notice::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 3px; background: var(--n-fg); opacity: 0.85; }
.qr-notice > .qr-next-icon { width: 1.125rem; height: 1.125rem; margin-top: 0.0625rem; color: var(--n-fg); }
.qr-notice strong { font-weight: 650; }
.qr-notice p + p { margin-top: var(--q-1); }
.qr-notice a { color: inherit; font-weight: 600; }
.qr-notice--warn { --n-fg: var(--q-warn); --n-bg: var(--q-warn-bg); --n-line: var(--q-warn-line); }
.qr-notice--danger { --n-fg: var(--q-danger); --n-bg: var(--q-danger-bg); --n-line: var(--q-danger-line); }
.qr-notice--ok { --n-fg: var(--q-ok); --n-bg: var(--q-ok-bg); --n-line: var(--q-ok-line); }
.qr-notice--stack { display: grid; gap: var(--q-1); }
.qr-notice--quiet { --n-bg: var(--q-surface-2); --n-line: var(--q-line); --n-fg: var(--q-text-3); }

/* ---------- Key/value ---------- */
.qr-kv { display: grid; grid-template-columns: max-content 1fr; gap: var(--q-2) var(--q-4); font-size: var(--q-fs-md); }
.qr-kv dt { color: var(--q-text-3); }
.qr-kv dd { color: var(--q-text); font-weight: 500; overflow-wrap: anywhere; }

/* ---------- Tables ---------- */
.qr-table { width: 100%; font-size: var(--q-fs-md); }
.qr-table :is(th, td) { padding: var(--q-2) var(--q-3); border-bottom: 1px solid var(--q-line); text-align: left; vertical-align: top; }
.qr-table th { color: var(--q-text-3); font-size: var(--q-fs-xs); font-weight: 600; white-space: nowrap; }
.qr-table tr:last-child > td { border-bottom: 0; }
.qr-table tbody tr { transition: background-color var(--q-dur-1) var(--q-ease); }
.qr-table tbody tr:hover { background: color-mix(in srgb, var(--q-accent-soft) 45%, transparent); }
.qr-table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---------- Menus (details-based, no-JS friendly) ---------- */
.qr-menu { position: relative; }
.qr-menu > summary { list-style: none; }
.qr-menu > summary::-webkit-details-marker { display: none; }
.qr-menu__panel {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	z-index: 60;
	display: grid;
	min-width: 13.5rem;
	padding: var(--q-1);
	border: 1px solid var(--q-line);
	border-radius: var(--q-r-lg);
	background: var(--q-glass);
	-webkit-backdrop-filter: blur(18px) saturate(1.6);
	backdrop-filter: blur(18px) saturate(1.6);
	box-shadow: var(--q-shadow-pop);
	animation: qr-pop-in var(--q-dur-3) var(--q-ease-out);
	transform-origin: top right;
}
.qr-menu__panel :is(a, button) {
	display: flex;
	align-items: center;
	gap: var(--q-2);
	width: 100%;
	min-height: 2.25rem;
	padding: 0 var(--q-3);
	border: 0;
	border-radius: var(--q-r-sm);
	background: none;
	color: var(--q-text);
	font-size: var(--q-fs-md);
	font-weight: 500;
	text-align: left;
	text-decoration: none;
}
.qr-menu__panel :is(a, button):hover { background: var(--q-accent-soft); color: var(--q-accent-text); }
.qr-menu__panel form { margin: 0; }
.qr-menu__panel p { padding: var(--q-2) var(--q-3); color: var(--q-text-3); font-size: var(--q-fs-sm); }

/* ---------- Disclosure ---------- */
.qr-disclosure { border-top: 1px solid var(--q-line); }
.qr-disclosure > summary {
	display: flex;
	align-items: center;
	gap: var(--q-2);
	min-height: 2.5rem;
	color: var(--q-text-2);
	font-size: var(--q-fs-md);
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}
.qr-disclosure > summary::-webkit-details-marker { display: none; }
.qr-disclosure > summary::before {
	content: "";
	flex: none;
	width: 0.4375rem; height: 0.4375rem;
	margin: 0 0.125rem;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(-45deg);
	transition: transform var(--q-dur-2) var(--q-ease);
}
.qr-disclosure[open] > summary::before { transform: rotate(45deg); }
.qr-disclosure > summary:hover { color: var(--q-text); }
.qr-disclosure__body { padding: 0 0 var(--q-4); }

/* ---------- Empty / loading ---------- */
.qr-empty { display: grid; justify-items: center; gap: var(--q-2); padding: var(--q-10) var(--q-6); text-align: center; }
.qr-empty h2, .qr-empty h3 { font-size: var(--q-fs-lg); }
.qr-empty p { max-width: 44ch; color: var(--q-text-3); }
.qr-empty .qr-art { width: min(11rem, 60%); margin-bottom: var(--q-2); }
.qr-empty__art { position: relative; width: min(10rem, 55%); margin: 0 auto var(--q-2); }
.qr-empty__art::before { content: ""; position: absolute; inset: 12% 8%; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(31, 116, 255, 0.22), transparent 70%); filter: blur(16px); }
.qr-empty h2, .qr-empty h3 { letter-spacing: -0.02em; }
.qr-empty__art img { display: block; width: 100%; height: auto; }
.qr-spinner { display: inline-block; width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: qr-spin 700ms linear infinite; vertical-align: -0.1875rem; }
.qr-skeleton { border-radius: var(--q-r-sm); background: linear-gradient(90deg, var(--q-surface-3), var(--q-surface-2), var(--q-surface-3)); background-size: 200% 100%; animation: qr-shimmer 1.4s ease-in-out infinite; }

/* ---------- Dialogs ---------- */
.qr-dialog {
	width: min(34rem, calc(100vw - 2rem));
	max-height: calc(100dvh - 2rem);
	padding: 0;
	border: 1px solid var(--q-line);
	border-radius: var(--q-r-xl);
	background: var(--q-surface);
	color: var(--q-text);
	box-shadow: var(--q-shadow-pop);
}
.qr-dialog::backdrop { background: var(--q-overlay); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.qr-dialog[open] { animation: qr-dialog-in var(--q-dur-3) var(--q-ease-out); }

/* ---------- Public layout and type (theme pages and plugin-rendered public pages) ---------- */
.qr-container { width: min(100% - 2 * var(--q-gutter), var(--q-public-max)); margin: 0 auto; }
.qr-display { font-size: var(--q-fs-display); font-weight: 700; line-height: 1.04; letter-spacing: var(--q-tracking-display); }
.qr-h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); font-weight: 700; line-height: 1.08; letter-spacing: -0.035em; }
.qr-h2 { font-size: var(--q-fs-3xl); font-weight: 680; line-height: 1.12; letter-spacing: -0.03em; }
.qr-lead { max-width: 38rem; color: var(--q-text-2); font-size: var(--q-fs-lg); line-height: var(--q-lh-relaxed); }
.qr-public-section { padding: clamp(3rem, 2rem + 3vw, 5.5rem) 0; }
.qr-public-section--band { border-block: 1px solid var(--q-line); background: var(--q-surface); }
.qr-section-intro { display: grid; gap: var(--q-3); max-width: 44rem; margin-bottom: var(--q-8); }
.qr-section-intro p { color: var(--q-text-2); }

/* ---------- Brand mark variants: the navy Q is lightened on dark surfaces (qr-mark-dark.webp) ---------- */
.qr-mark-img { display: block; width: 100%; height: auto; }
.qr-mark-img.qr-mark-img--dark, html[data-theme="dark"] .qr-mark-img.qr-mark-img--light { display: none; }
html[data-theme="dark"] .qr-mark-img.qr-mark-img--dark { display: block; }

/* ---------- Motion primitives ---------- */
@keyframes qr-spin { to { transform: rotate(360deg); } }
@keyframes qr-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@keyframes qr-pop-in { from { opacity: 0; transform: translateY(-6px) scale(0.97); } }
@keyframes qr-dialog-in { from { opacity: 0; transform: translateY(12px) scale(0.97); } }
@keyframes qr-sheen { from { transform: translateX(-140%) skewX(-18deg); } to { transform: translateX(260%) skewX(-18deg); } }
@keyframes qr-rise { from { opacity: 0; transform: translateY(14px); } }
@keyframes qr-glow-drift { 0% { transform: translate3d(0, 0, 0) scale(1); } 50% { transform: translate3d(3%, 4%, 0) scale(1.06); } 100% { transform: translate3d(-3%, 2%, 0) scale(0.97); } }
@keyframes qr-fade-up { from { opacity: 0; transform: translateY(6px); } }
@keyframes qr-fade-in { from { opacity: 0; } }
@keyframes qr-sheet-in { from { transform: translateY(100%); } }
@keyframes qr-flash { 0% { background-color: var(--q-accent-soft); } 100% { background-color: transparent; } }
.qr-enter { animation: qr-fade-up var(--q-dur-3) var(--q-ease-out) both; }

@media (prefers-reduced-motion: reduce) {
	.qr-btn, .qr-btn .qr-next-icon { transition: none; }
	.qr-btn:hover { translate: none !important; }
	.qr-btn::after { animation: none !important; }
	.qr-menu__panel, .qr-dialog[open] { animation: none; }
}

/* ---------- QuoteRecon illustrations (inline SVG, theme aware) ---------- */
@keyframes qr-flow-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes qr-flow-twinkle { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.45; transform: scale(0.8); } }
@keyframes qr-flow-lens { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-10px, -6px); } }
@keyframes qr-flow-dash { to { stroke-dashoffset: -20; } }
@keyframes qr-flow-scan { 0% { transform: translateY(0); opacity: 0; } 12% { opacity: 0.85; } 88% { opacity: 0.85; } 100% { transform: translateY(96px); opacity: 0; } }
.qr-flow-art { display: block; width: 100%; height: auto; overflow: visible; }
.qr-empty__art .qr-flow-art { animation: qr-flow-float 6s var(--q-ease) infinite; }
.qr-flow-art__spark { transform-box: fill-box; transform-origin: center; animation: qr-flow-twinkle 2.8s ease-in-out infinite; }
.qr-flow-art__lens { animation: qr-flow-lens 5s var(--q-ease) infinite; }
.qr-flow-art__flow { animation: qr-flow-dash 0.9s linear infinite; }
.qr-flow-art__scan { animation: qr-flow-scan 2.4s ease-in-out infinite; }
html[data-theme="dark"] .qr-flow-art { filter: drop-shadow(0 0 22px rgba(77, 155, 255, 0.18)); }
@media (prefers-reduced-motion: reduce) {
	.qr-flow-art, .qr-flow-art *, .qr-empty__art .qr-flow-art { animation: none !important; }
	.qr-flow-art__scan { opacity: 0; }
}
/* A disabled PRO action reads as unavailable, not as a faded gradient. */
.qr-btn--pro:disabled, .qr-btn--pro[aria-disabled="true"] { border-color: var(--q-line); background: var(--q-surface-3); color: var(--q-text-2); opacity: 1; }
.qr-btn--pro:disabled::after, .qr-btn--pro[aria-disabled="true"]::after { display: none; }