html[data-theme="eywa"] {
	color-scheme: dark;
	--color-bg: #030f2e;
	--color-surface: #071634;
	--color-surface-muted: #0b1d40;
	--color-border: #24406f;
	--color-text: #e8f1fb;
	--color-muted: #8fa6c4;
	--color-primary: #4484d5;
	--color-primary-strong: #8ad3fd;
	--color-primary-soft: rgba(68, 132, 213, 0.16);
	--color-accent: #8ad3fd;
	--state-ok: #4ade9b;
	--state-warn: #f5b544;
	--state-error: #f2554b;
	--state-info: #4484d5;
	--status-ok: var(--state-ok);
	--status-down: var(--state-error);
	--glow-focus: 0 0 0 1px #4484d5, 0 0 12px rgba(68, 132, 213, 0.45);
	--glow-active: 0 0 16px rgba(138, 211, 253, 0.35);
	--glow-soft: 0 0 24px rgba(68, 132, 213, 0.18);
	--filament: linear-gradient(90deg, transparent, #24406f 18%, #4484d5 50%, #24406f 82%, transparent);
	--shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.55);
	--color-header-glass: rgba(7, 22, 52, 0.88);
	--color-panel-glass: rgba(7, 22, 52, 0.9);
	--color-panel-border: rgba(36, 64, 111, 0.92);
	--color-hero-overlay: rgba(3, 15, 46, 0.98);
	--color-hero-overlay-soft: rgba(7, 22, 52, 0.78);
	--color-hero-warm: #0b1d40;
	--color-login-overlay: rgba(3, 15, 46, 0.96);
	--color-login-overlay-soft: rgba(7, 22, 52, 0.82);
	--color-login-warm: #0b1d40;
}

html[data-theme="eywa"] *:focus-visible {
	box-shadow: var(--glow-focus);
	outline: 2px solid transparent;
}

html[data-theme="eywa"] body { background: var(--color-bg); color: var(--color-text); }
html[data-theme="eywa"] .app-shell { background: radial-gradient(circle at 50% 0, var(--color-primary-soft), transparent 32rem), var(--color-bg); }
html[data-theme="eywa"] .app-page { background: var(--color-bg); }
html[data-theme="eywa"] .app-header { border-bottom: 1px solid var(--color-border); background: var(--color-header-glass); backdrop-filter: blur(14px); }
html[data-theme="eywa"] .brand { color: var(--color-primary-strong); border-color: var(--color-border); background: var(--color-surface); }
html[data-theme="eywa"] .app-nav a { color: var(--color-muted); }
html[data-theme="eywa"] .app-nav a[aria-current="page"] { color: var(--color-primary-strong); text-decoration: none; filter: drop-shadow(var(--glow-active)); }
html[data-theme="eywa"] .app-hero { padding: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--color-hero-overlay), var(--color-hero-overlay-soft)); box-shadow: var(--shadow-soft); }
html[data-theme="eywa"] .compact-hero { padding-block: var(--space-5); }
html[data-theme="eywa"] .eyebrow { color: var(--color-primary-strong); letter-spacing: 0.12em; text-transform: uppercase; }
html[data-theme="eywa"] .lead { max-width: 64ch; color: var(--color-muted); }
/* Veřejná vizitka si tlačítka barví sama: `.google-button` a `.primary-link` mají ve
   styles.css `background: var(--color-primary); color: white`. To sedělo na původní
   tmavší modrou (#2563a8 → 6,12), ale téma primární barvu zesvětlilo, takže bílý text
   spadl na 3,81 a na hoveru dokonce na 1,64. Téma proto musí dodat i barvu textu —
   je to jeho paleta, tedy jeho odpovědnost. Tmavá z --color-bg dává 4,95 a 11,53. */
html[data-theme="eywa"] .google-button,
html[data-theme="eywa"] .primary-link,
html[data-theme="eywa"] .google-button:hover,
html[data-theme="eywa"] .primary-link:hover { color: var(--color-bg); }

html[data-theme="eywa"] .module-card,
html[data-theme="eywa"] .system-card,
html[data-theme="eywa"] .agent-row,
html[data-theme="eywa"] .table-wrap { border-color: var(--color-border); background: var(--color-surface); box-shadow: var(--shadow-soft); color: var(--color-text); }
html[data-theme="eywa"] .module-card[aria-current="true"],
html[data-theme="eywa"] .system-card[aria-current="true"],
html[data-theme="eywa"] .agent-row[aria-current="true"] { box-shadow: inset 3px 0 0 var(--color-primary-strong), var(--glow-active); }

html[data-theme="eywa"] .eywa-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 2.5rem; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-primary); border-radius: var(--radius-sm); background: var(--color-primary); color: var(--color-bg); font: inherit; cursor: pointer; transition: border-color 160ms, background 160ms, box-shadow 160ms; }
html[data-theme="eywa"] .eywa-btn:not(:disabled):hover { border-color: var(--color-primary-strong); box-shadow: var(--glow-active); }
html[data-theme="eywa"] .eywa-btn:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
html[data-theme="eywa"] .eywa-btn--quiet { background: transparent; color: var(--color-primary-strong); }
html[data-theme="eywa"] .eywa-btn--danger { border-color: var(--state-error); background: transparent; color: var(--state-error); }

html[data-theme="eywa"] .eywa-table { width: 100%; border-collapse: collapse; overflow: hidden; background: var(--color-bg); }
html[data-theme="eywa"] .eywa-table th,
html[data-theme="eywa"] .eywa-table td { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--color-border); text-align: left; }
html[data-theme="eywa"] .eywa-table thead { background: var(--color-surface-muted); }
html[data-theme="eywa"] .eywa-table tbody tr:nth-child(even) { background: var(--color-surface); }
html[data-theme="eywa"] .eywa-table tbody tr:nth-child(odd) { background: var(--color-bg); }
html[data-theme="eywa"] .eywa-table .eywa-number { text-align: right; font-variant-numeric: tabular-nums; }

html[data-theme="eywa"] .eywa-status { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-muted); }
html[data-theme="eywa"] .eywa-status::before { width: 8px; height: 8px; border-radius: 50%; background: currentColor; content: ""; }
html[data-theme="eywa"] .eywa-status--ok { color: var(--state-ok); }
html[data-theme="eywa"] .eywa-status--warn { color: var(--state-warn); }
html[data-theme="eywa"] .eywa-status--error { color: var(--state-error); }
html[data-theme="eywa"] .eywa-status .eywa-icon { width: 1rem; height: 1rem; }

html[data-theme="eywa"] .eywa-meter { height: 0.75rem; overflow: hidden; border-radius: var(--radius-sm); background: var(--color-surface-muted); }
html[data-theme="eywa"] .eywa-meter > span { display: block; width: var(--meter-value, 0%); height: 100%; background: linear-gradient(90deg, var(--color-primary), var(--color-primary-strong)); }
html[data-theme="eywa"] .eywa-field { display: grid; gap: var(--space-1); color: var(--color-muted); }
html[data-theme="eywa"] .eywa-field input,
html[data-theme="eywa"] .eywa-field textarea { width: 100%; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-surface-muted); color: var(--color-text); font: inherit; }
html[data-theme="eywa"] .eywa-log { padding: var(--space-3); overflow-x: auto; border-left: 2px solid var(--color-primary); background: var(--color-surface-muted); color: var(--color-muted); font-family: ui-monospace, monospace; font-size: var(--step--1); }
html[data-theme="eywa"] .eywa-tree,
html[data-theme="eywa"] .eywa-tree ul { padding-left: var(--space-4); list-style: none; }
html[data-theme="eywa"] .eywa-tree li { position: relative; padding-block: var(--space-1); }
html[data-theme="eywa"] .eywa-tree li::before { position: absolute; top: 1em; left: calc(-1 * var(--space-3)); width: var(--space-2); height: 1px; background: var(--color-border); content: ""; }
html[data-theme="eywa"] .eywa-empty { display: grid; place-items: center; min-height: 8rem; padding: var(--space-4); border: 1px dashed var(--color-border); border-radius: var(--radius-md); color: var(--color-muted); text-align: center; }
html[data-theme="eywa"] .eywa-empty--loading { border-color: var(--state-info); }
html[data-theme="eywa"] .eywa-empty--error { border-color: var(--state-error); color: var(--state-error); }
html[data-theme="eywa"] .eywa-filament { width: 100%; height: 1px; margin-block: var(--space-5); border: 0; background: var(--filament); }

html[data-theme="eywa"] .eywa-palette { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--space-2); }
html[data-theme="eywa"] .eywa-swatch { display: flex; gap: var(--space-2); align-items: center; padding: var(--space-2); background: var(--color-surface); }
html[data-theme="eywa"] .eywa-swatch::before { width: 2rem; height: 2rem; flex: none; border: 1px solid var(--color-border); border-radius: 50%; background: var(--swatch); content: ""; }
html[data-theme="eywa"] .eywa-icons { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: var(--space-3); }
html[data-theme="eywa"] .eywa-icon-sizes { display: flex; align-items: center; gap: var(--space-2); color: var(--color-primary-strong); }
html[data-theme="eywa"] .eywa-icon {
	flex: none;
	width: 24px;
	height: 24px;
	vertical-align: -0.15em;
	filter: drop-shadow(0 0 1.5px var(--color-primary)) drop-shadow(0 0 6px rgba(68, 132, 213, 0.55));
}
html[data-theme="eywa"] .eywa-icon--lg { width: 48px; height: 48px; }
html[data-theme="eywa"] .eywa-icon use { pointer-events: none; }

/* Záře ikon — rozhodnuto 2026-08-06: A jako základ, C (mihotání) jen pro živé stavy.
   Dělá se `filter: drop-shadow` na vnějším <svg>, takže sprite ani SVG soubory
   zůstávají nedotčené a ikona je vidět i bez tohoto CSS.
   Zahozeno: varianta s tahem v primary a rozsvíceným okrajem — ve 24 px se glyf
   rozplizne. Glyf musí být nejsvětlejší prvek, záře smí být jen okolo.
   Barvy v @keyframes jsou záměrně literály: var() ve složené hodnotě `filter`
   se neinterpoluje spolehlivě a záře by poskakovala. Drž je v souladu
   s --color-primary (#4484d5) a --color-primary-strong (#8ad3fd). */
html[data-theme="eywa"] .eywa-icon--shimmer {
	filter: drop-shadow(0 0 1.5px #4484d5) drop-shadow(0 0 5px rgba(68, 132, 213, 0.5));
}

@media (prefers-reduced-motion: no-preference) {
	html[data-theme="eywa"] .eywa-status--ok::before,
	html[data-theme="eywa"] .eywa-empty--loading { animation: eywa-pulse 1.6s ease-in-out alternate infinite; }
	html[data-theme="eywa"] .eywa-icon--shimmer { animation: eywa-icon-shimmer 3s ease-in-out alternate infinite; }
}

@keyframes eywa-pulse {
	to { box-shadow: var(--glow-active); }
}

@keyframes eywa-icon-shimmer {
	from { filter: drop-shadow(0 0 1px #4484d5) drop-shadow(0 0 4px rgba(68, 132, 213, 0.32)); }
	to { filter: drop-shadow(0 0 2px #4484d5) drop-shadow(0 0 9px rgba(138, 211, 253, 0.62)); }
}
