/* Nomada Analytics — front-end dashboard styles.
   Self-contained, theme-agnostic, light + dark aware. */

/* ---------------------------------------------------------------- Themes
   --nm-page  = backdrop behind panels   --nm-panel = card surface
   --nm-bg    = recessed surface (inputs) --nm-elev  = surface shadow
   Default block = polished Light. Each theme below redefines the full set. */
.nomada-app, .nomada-auth, .nomada-embed {
	--nm-page: #f4f5fb;
	--nm-bg: #eef0f8;
	--nm-panel: #ffffff;
	--nm-ink: #1b2233;
	--nm-muted: #6b7488;
	--nm-line: #e6e8f1;
	--nm-brand: #5b5bf0;
	--nm-brand-ink: #ffffff;
	--nm-bar: rgba(91, 91, 240, 0.10);
	--nm-c2: #f59e0b;
	--nm-c3: #10b981;
	--nm-up: #16a34a;
	--nm-down: #dc2626;
	--nm-elev: 0 1px 2px rgba(20, 28, 56, 0.04), 0 2px 8px rgba(20, 28, 56, 0.05);
	--nm-radius: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--nm-ink);
	-webkit-font-smoothing: antialiased;
	box-sizing: border-box;
}
.nomada-app *, .nomada-auth *, .nomada-embed * { box-sizing: border-box; }

/* Themed scrollbars — match the active palette instead of the OS default. */
.nomada-app, .nomada-auth, .nomada-embed { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--nm-muted) 45%, transparent) transparent; }
.nomada-app ::-webkit-scrollbar, .nomada-auth ::-webkit-scrollbar, .nomada-embed ::-webkit-scrollbar { width: 10px; height: 10px; }
.nomada-app ::-webkit-scrollbar-track, .nomada-auth ::-webkit-scrollbar-track, .nomada-embed ::-webkit-scrollbar-track { background: transparent; }
.nomada-app ::-webkit-scrollbar-thumb, .nomada-auth ::-webkit-scrollbar-thumb, .nomada-embed ::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--nm-muted) 42%, transparent); border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
.nomada-app ::-webkit-scrollbar-thumb:hover, .nomada-auth ::-webkit-scrollbar-thumb:hover, .nomada-embed ::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--nm-brand) 60%, var(--nm-muted)); background-clip: padding-box; }
.nomada-app ::-webkit-scrollbar-corner, .nomada-auth ::-webkit-scrollbar-corner, .nomada-embed ::-webkit-scrollbar-corner { background: transparent; }

/* Auto-follow the OS to dark only when the user hasn't picked a theme at all. */
@media (prefers-color-scheme: dark) {
	html:not([data-theme]) .nomada-app,
	html:not([data-theme]) .nomada-auth,
	html:not([data-theme]) .nomada-embed {
		--nm-page: #0a0f1c;
		--nm-bg: #0e1626;
		--nm-panel: #131c2e;
		--nm-ink: #e6e9f0;
		--nm-muted: #94a3b8;
		--nm-line: #202c44;
		--nm-brand: #818cf8;
		--nm-brand-ink: #0b1120;
		--nm-bar: rgba(129, 140, 248, 0.22);
	--nm-c2: #f59e0b;
	--nm-c3: #34d399;
		--nm-up: #22c55e;
		--nm-down: #f87171;
		--nm-elev: 0 1px 3px rgba(0, 0, 0, 0.35);
	}
}

/* Dark — refined slate */
html[data-theme="dark"] .nomada-app,
html[data-theme="dark"] .nomada-auth,
html[data-theme="dark"] .nomada-embed {
	--nm-page: #0a0f1c;
	--nm-bg: #0e1626;
	--nm-panel: #131c2e;
	--nm-ink: #e6e9f0;
	--nm-muted: #94a3b8;
	--nm-line: #202c44;
	--nm-brand: #818cf8;
	--nm-brand-ink: #0b1120;
	--nm-bar: rgba(129, 140, 248, 0.22);
	--nm-c2: #f59e0b;
	--nm-c3: #34d399;
	--nm-up: #22c55e;
	--nm-down: #f87171;
	--nm-elev: 0 1px 3px rgba(0, 0, 0, 0.35);
}

/* Sepia — warm, paper-like, brown tones (an easy-on-the-eyes middle ground) */
html[data-theme="sepia"] .nomada-app,
html[data-theme="sepia"] .nomada-auth,
html[data-theme="sepia"] .nomada-embed {
	--nm-page: #ece3d4;
	--nm-bg: #e7dcc9;
	--nm-panel: #f7f0e3;
	--nm-ink: #3a2e22;
	--nm-muted: #8c7a64;
	--nm-line: #ddcfb8;
	--nm-brand: #a66a33;
	--nm-brand-ink: #fdf7ee;
	--nm-bar: rgba(166, 106, 51, 0.15);
	--nm-c2: #c98a2b;
	--nm-c3: #5c7f3a;
	--nm-up: #5c7f3a;
	--nm-down: #b5462f;
	--nm-elev: 0 1px 2px rgba(80, 55, 30, 0.06), 0 2px 8px rgba(80, 55, 30, 0.06);
}

/* Neon — futuristic deep-space dark with cyan accents */
html[data-theme="neon"] .nomada-app,
html[data-theme="neon"] .nomada-auth,
html[data-theme="neon"] .nomada-embed {
	--nm-page: #060814;
	--nm-bg: #0b1022;
	--nm-panel: #0e1530;
	--nm-ink: #e8f0ff;
	--nm-muted: #8090b8;
	--nm-line: #1b2750;
	--nm-brand: #22d3ee;
	--nm-brand-ink: #04121a;
	--nm-bar: rgba(34, 211, 238, 0.16);
	--nm-c2: #f472b6;
	--nm-c3: #a855f7;
	--nm-up: #34d399;
	--nm-down: #fb7185;
	--nm-elev: 0 0 0 1px rgba(34, 211, 238, 0.06), 0 10px 30px rgba(0, 0, 0, 0.45);
}

/* Graphite — monochrome black & gray */
html[data-theme="graphite"] .nomada-app,
html[data-theme="graphite"] .nomada-auth,
html[data-theme="graphite"] .nomada-embed {
	--nm-page: #0c0c0d;
	--nm-bg: #161618;
	--nm-panel: #1c1c1f;
	--nm-ink: #ececee;
	--nm-muted: #9b9ba1;
	--nm-line: #2b2b2e;
	--nm-brand: #c7c7cc;
	--nm-brand-ink: #1a1a1c;
	--nm-bar: rgba(199, 199, 204, 0.14);
	--nm-c2: #a1a1a6;
	--nm-c3: #6b6b70;
	--nm-up: #d4d4d8;
	--nm-down: #76767b;
	--nm-elev: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* Cyberpunk — magenta + cyan neon */
html[data-theme="cyberpunk"] .nomada-app,
html[data-theme="cyberpunk"] .nomada-auth,
html[data-theme="cyberpunk"] .nomada-embed {
	--nm-page: #0a0612;
	--nm-bg: #120a20;
	--nm-panel: #170c29;
	--nm-ink: #f6e9ff;
	--nm-muted: #b58fd8;
	--nm-line: #341851;
	--nm-brand: #ff2bd6;
	--nm-brand-ink: #1a0018;
	--nm-bar: rgba(255, 43, 214, 0.16);
	--nm-c2: #19e6ff;
	--nm-c3: #a855f7;
	--nm-up: #19e6ff;
	--nm-down: #ff3b6b;
	--nm-elev: 0 0 0 1px rgba(255, 43, 214, 0.08), 0 10px 30px rgba(0, 0, 0, 0.5);
}

/* Sakura — soft pinks and creams */
html[data-theme="sakura"] .nomada-app,
html[data-theme="sakura"] .nomada-auth,
html[data-theme="sakura"] .nomada-embed {
	--nm-page: #fdf2f5;
	--nm-bg: #fbe7ee;
	--nm-panel: #fffafc;
	--nm-ink: #4a2c39;
	--nm-muted: #a9788a;
	--nm-line: #f4d6e0;
	--nm-brand: #e0608c;
	--nm-brand-ink: #fff5f8;
	--nm-bar: rgba(224, 96, 140, 0.13);
	--nm-c2: #f4a6c2;
	--nm-c3: #7bbf8e;
	--nm-up: #6aa67a;
	--nm-down: #d4596b;
	--nm-elev: 0 1px 2px rgba(150, 80, 100, 0.06), 0 2px 8px rgba(150, 80, 100, 0.07);
}

/* Forest — dark green with emerald accents */
html[data-theme="forest"] .nomada-app,
html[data-theme="forest"] .nomada-auth,
html[data-theme="forest"] .nomada-embed {
	--nm-page: #07140e;
	--nm-bg: #0a1b13;
	--nm-panel: #0e2419;
	--nm-ink: #def3e8;
	--nm-muted: #84a896;
	--nm-line: #173c2b;
	--nm-brand: #34d399;
	--nm-brand-ink: #04130c;
	--nm-bar: rgba(52, 211, 153, 0.16);
	--nm-c2: #4ade80;
	--nm-c3: #2dd4bf;
	--nm-up: #4ade80;
	--nm-down: #f87171;
	--nm-elev: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* Tokyo Night — dark blue-purple */
html[data-theme="tokyo"] .nomada-app,
html[data-theme="tokyo"] .nomada-auth,
html[data-theme="tokyo"] .nomada-embed {
	--nm-page: #16161e;
	--nm-bg: #1a1b26;
	--nm-panel: #222433;
	--nm-ink: #c0caf5;
	--nm-muted: #828bb8;
	--nm-line: #2c2f44;
	--nm-brand: #7aa2f7;
	--nm-brand-ink: #0b1020;
	--nm-bar: rgba(122, 162, 247, 0.18);
	--nm-c2: #bb9af7;
	--nm-c3: #7dcfff;
	--nm-up: #9ece6a;
	--nm-down: #f7768e;
	--nm-elev: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* Gold — black with gold highlights */
html[data-theme="gold"] .nomada-app,
html[data-theme="gold"] .nomada-auth,
html[data-theme="gold"] .nomada-embed {
	--nm-page: #0b0a07;
	--nm-bg: #14120b;
	--nm-panel: #1a1810;
	--nm-ink: #f3ecd9;
	--nm-muted: #b3a279;
	--nm-line: #2c2716;
	--nm-brand: #e3b341;
	--nm-brand-ink: #1a1407;
	--nm-bar: rgba(227, 179, 65, 0.16);
	--nm-c2: #f0c75e;
	--nm-c3: #b08d57;
	--nm-up: #9bc24a;
	--nm-down: #d9663f;
	--nm-elev: 0 0 0 1px rgba(227, 179, 65, 0.06), 0 10px 30px rgba(0, 0, 0, 0.5);
}

.nomada-logo { color: var(--nm-brand); font-size: 1.25em; }

/* ----------------------------------------------------------------- Auth */

.nomada-auth {
	display: flex; align-items: center; justify-content: center;
	min-height: 100vh; padding: 32px 16px; background: var(--nm-page);
}
.nomada-auth__card {
	width: 100%; max-width: 380px; background: var(--nm-panel);
	border: 1px solid var(--nm-line); border-radius: 16px;
	padding: 28px; box-shadow: 0 10px 40px rgba(2, 6, 23, 0.08);
}
.nomada-auth__brand { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 18px; margin-bottom: 20px; }
.nomada-tabs { display: flex; gap: 4px; background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 10px; padding: 4px; margin-bottom: 18px; }
.nomada-tab { flex: 1; border: 0; background: transparent; padding: 8px; border-radius: 8px; font: inherit; color: var(--nm-muted); cursor: pointer; }
.nomada-tab.is-active { background: var(--nm-panel); color: var(--nm-ink); box-shadow: 0 1px 3px rgba(0,0,0,0.08); font-weight: 600; }
.nomada-form.is-hidden { display: none; }
.nomada-field { display: block; margin-bottom: 14px; }
.nomada-field > span { display: block; font-size: 13px; color: var(--nm-muted); margin-bottom: 6px; }
.nomada-field input, .nomada-field select {
	width: 100%; padding: 10px 12px; border: 1px solid var(--nm-line);
	border-radius: 9px; background: var(--nm-bg); color: var(--nm-ink); font: inherit;
}
.nomada-field input:focus, .nomada-field select:focus { outline: 2px solid var(--nm-brand); outline-offset: 1px; }
.nomada-field small { color: var(--nm-muted); font-size: 12px; }
.nomada-check { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--nm-muted); margin-bottom: 14px; }
.nomada-auth__alt, .nomada-auth__legal { text-align: center; font-size: 12px; color: var(--nm-muted); margin: 12px 0 0; }
.nomada-auth__alt a { color: var(--nm-brand); text-decoration: none; }

/* ----------------------------------------------------------- Buttons */

.nomada-btn { font: inherit; font-weight: 600; border-radius: 9px; padding: 10px 16px; cursor: pointer; border: 1px solid transparent; text-decoration: none; }
.nomada-btn:hover { text-decoration: none; }
.nomada-btn--primary { background: var(--nm-brand); color: var(--nm-brand-ink); width: 100%; }
.nomada-btn--primary:hover { filter: brightness(1.05); }
.nomada-btn--ghost { background: var(--nm-panel); border-color: var(--nm-line); color: var(--nm-ink); padding: 9px 14px; width: auto; font-weight: 600; }
.nomada-btn--ghost:hover { background: var(--nm-bar); border-color: var(--nm-brand); }

/* ------------------------------------------------------------- Notices */

.nomada-notice { padding: 10px 14px; border-radius: 9px; font-size: 14px; margin-bottom: 16px; }
.nomada-notice--error { background: rgba(220,38,38,0.1); color: var(--nm-down); }
.nomada-notice--success { background: rgba(22,163,74,0.1); color: var(--nm-up); }

/* ----------------------------------------------------------------- App */

.nomada-app { width: 100%; max-width: none; margin: 0; padding: 8px 28px 48px; background: var(--nm-page); min-height: 100vh; }
.nomada-embed { padding: 0; background: var(--nm-page); }

/* Soft elevation on the main surfaces, theme-aware (subtle in light, glow-ish in neon). */
.nomada-tcard, .nomada-card, .nomada-panel, .nomada-site-row { box-shadow: var(--nm-elev); }
.nomada-app__top { display: flex; align-items: center; gap: 14px; padding: 14px 18px; margin-bottom: 22px; flex-wrap: wrap; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); }
.nomada-app__brand { font-weight: 700; font-size: 17px; display: flex; align-items: center; gap: 8px; color: var(--nm-ink); text-decoration: none; }
.nomada-app__brand:hover { color: var(--nm-brand); }
.nomada-app__site-switch { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.nomada-app__site-switch select { padding: 9px 12px; border: 1px solid var(--nm-line); border-radius: 9px; background: var(--nm-bg); color: var(--nm-ink); font: inherit; font-weight: 600; cursor: pointer; }
.nomada-app__user { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--nm-ink); font-weight: 600; margin-left: auto; }
.nomada-inline-form { display: inline; }

/* Controls */
.nomada-controls { margin-bottom: 18px; }
.nomada-period { display: flex; flex-wrap: wrap; gap: 6px; }
.nomada-pill { border: 1px solid var(--nm-line); background: var(--nm-panel); color: var(--nm-muted); padding: 7px 12px; border-radius: 999px; font: inherit; font-size: 13px; cursor: pointer; }
.nomada-pill.is-active { background: var(--nm-brand); color: var(--nm-brand-ink); border-color: var(--nm-brand); }

.nomada-daterange { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: -4px 0 18px; padding: 12px 14px; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); }
.nomada-daterange[hidden] { display: none; } /* author display:flex would otherwise beat the UA [hidden] rule */
.nomada-daterange label { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--nm-muted); }
.nomada-daterange input[type="date"] { font: inherit; font-size: 13px; padding: 6px 9px; border: 1px solid var(--nm-line); border-radius: 8px; background: var(--nm-bg); color: var(--nm-ink); color-scheme: light dark; }
.nomada-daterange .nomada-btn { width: auto; padding: 7px 16px; box-shadow: none; }

/* Cards */
.nomada-cards { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-bottom: 18px; }
.nomada-card { text-align: left; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 14px; cursor: pointer; font: inherit; color: inherit; position: relative; }
.nomada-card--static { cursor: default; }
.nomada-card.is-active { border-color: var(--nm-brand); box-shadow: inset 0 -3px 0 var(--nm-brand); }
.nomada-card__label { display: block; font-size: 12px; color: var(--nm-muted); margin-bottom: 6px; }
.nomada-card__value { display: block; font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.nomada-delta { font-size: 12px; font-weight: 600; }
.nomada-delta.up { color: var(--nm-up); }
.nomada-delta.down { color: var(--nm-down); }
.nomada-delta.flat { color: var(--nm-muted); }

/* Settings: site-icon row with refresh */
.nomada-iconrow { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.nomada-iconrow__img { width: 46px; height: 46px; border-radius: 11px; border: 1px solid var(--nm-line); background: var(--nm-bg); object-fit: contain; padding: 4px; flex: 0 0 auto; }
.nomada-iconrow__meta { display: flex; flex-direction: column; gap: 6px; }
.nomada-iconrow__label { font-size: 12px; color: var(--nm-muted); }
.nomada-iconrow .nomada-btn { width: auto; padding: 6px 12px; font-size: 13px; }

/* Chart */
.nomada-chart-wrap { position: relative; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 12px; margin-bottom: 18px; }
.nomada-chart-types { position: absolute; top: 10px; right: 12px; z-index: 1; display: flex; gap: 2px; background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 8px; padding: 2px; }
.nomada-ctype { display: inline-grid; place-items: center; width: 28px; height: 24px; border: 0; background: transparent; color: var(--nm-muted); border-radius: 6px; cursor: pointer; }
.nomada-ctype:hover { color: var(--nm-ink); }
.nomada-ctype.is-active { background: var(--nm-brand); color: var(--nm-brand-ink); }
.nomada-ctype svg { display: block; }
.nomada-tip { position: fixed; pointer-events: none; background: var(--nm-ink); color: var(--nm-bg); font-size: 12px; padding: 7px 10px; border-radius: 7px; z-index: 9999; line-height: 1.3; }
.nomada-tip-row { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 11px; font-variant-numeric: tabular-nums; }
.nomada-tip-row i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; flex: 0 0 auto; }
.nomada-cdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }

/* Grid of panels — auto-fits more columns as the viewport widens */
.nomada-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.nomada-panel { background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 16px; }
.nomada-panel__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.nomada-panel__head h3 { margin: 0; font-size: 14px; font-weight: 700; }
.nomada-panel__col { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--nm-muted); }
.nomada-panel__tabs { display: flex; gap: 4px; margin-bottom: 8px; flex-wrap: wrap; }
.nomada-subtab { border: 0; background: transparent; color: var(--nm-muted); font: inherit; font-size: 12px; padding: 4px 8px; border-radius: 7px; cursor: pointer; }
.nomada-subtab.is-active { background: var(--nm-bar); color: var(--nm-ink); font-weight: 600; }

/* Bar rows */
.nomada-list { list-style: none; margin: 0; padding: 0; }
.nomada-row { position: relative; display: flex; align-items: center; padding: 7px 8px; font-size: 13px; border-radius: 7px; overflow: hidden; }
.nomada-row__bar { position: absolute; left: 0; top: 0; bottom: 0; background: var(--nm-bar); border-radius: 7px; z-index: 0; }
.nomada-row__name { position: relative; z-index: 1; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-row__val { position: relative; z-index: 1; font-variant-numeric: tabular-nums; color: var(--nm-muted); font-weight: 600; }
.nomada-row__cr { position: relative; z-index: 1; font-variant-numeric: tabular-nums; color: var(--nm-muted); font-size: 12px; font-weight: 600; margin-right: 12px; opacity: .85; }
.nomada-row--ev { cursor: pointer; }
.nomada-row--ev:hover .nomada-row__name { color: var(--nm-brand); }
.nomada-props-body { max-height: 62vh; overflow-y: auto; margin-top: 4px; }
.nomada-props-group { margin-bottom: 18px; }
.nomada-props-group:last-child { margin-bottom: 0; }
.nomada-props-group h4 { margin: 0 0 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--nm-muted); }
.nomada-flag { margin-right: 4px; }
.nomada-fava { width: 16px; height: 16px; border-radius: 3px; object-fit: contain; vertical-align: -3px; margin-right: 7px; }
.nomada-ico { display: inline-flex; vertical-align: -2px; margin-right: 7px; color: var(--nm-muted); }
.nomada-ico svg { display: block; }
.nomada-empty-mini { color: var(--nm-muted); font-size: 13px; padding: 16px 8px; text-align: center; }

/* Empty / loading */
.nomada-empty { text-align: center; padding: 60px 20px; }
.nomada-empty h2 { margin: 0 0 8px; }
.nomada-empty p { color: var(--nm-muted); max-width: 440px; margin: 0 auto 20px; }
.nomada-dash.is-loading { opacity: 0.5; transition: opacity .2s; }

/* Modals */
.nomada-modal { position: fixed; inset: 0; background: rgba(2,6,23,0.5); display: flex; align-items: center; justify-content: center; z-index: 9998; padding: 16px; }
.nomada-modal[hidden] { display: none; }
.nomada-modal__box { background: var(--nm-panel); border-radius: 16px; padding: 24px; width: 100%; max-width: 460px; position: relative; border: 1px solid var(--nm-line); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28); }
/* The settings modal holds more (snippet, icon, timezone, share) — give it room. */
#nomada-settings-modal .nomada-modal__box { max-width: 600px; padding: 28px; }
.nomada-modal__box--wide { max-width: 640px; }

/* Embeddable-widgets builder */
.nomada-wdg { display: flex; flex-direction: column; gap: 16px; margin-top: 10px; }
.nomada-wdg__types { align-self: flex-start; flex-wrap: wrap; }
.nomada-wdg__opts { display: flex; flex-wrap: wrap; gap: 14px; }
.nomada-wdg__opts label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--nm-muted); font-weight: 600; }
.nomada-wdg__opts select { font: inherit; font-size: 13px; padding: 7px 9px; border: 1px solid var(--nm-line); border-radius: 8px; background: var(--nm-bg); color: var(--nm-ink); }
.nomada-wdg__preview { background: var(--nm-bg); border: 1px dashed var(--nm-line); border-radius: var(--nm-radius); padding: 18px; display: flex; flex-direction: column; gap: 12px; align-items: center; }
.nomada-wdg__plabel { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--nm-muted); align-self: flex-start; }
.nomada-wdg__stage { min-height: 58px; display: flex; align-items: center; justify-content: center; }
.nomada-wdg__note { font-size: 13px; color: var(--nm-down); margin: 0; }

/* Share view — site list left, selected-site config right */
.nomada-share-view { display: grid; grid-template-columns: minmax(300px, 440px) minmax(0, 1fr); gap: 8px 36px; align-items: start; max-width: 1180px; }
.nomada-share-view > h2 { grid-column: 1 / -1; margin: 0 0 12px; font-size: 20px; }
.nomada-share-list { grid-column: 1; display: flex; flex-direction: column; gap: 8px; }
.nomada-share-config { grid-column: 2; position: sticky; top: 12px; }
.nomada-share-sel { margin: 0 0 12px; font-size: 17px; font-weight: 700; }
@media (max-width: 920px) {
	.nomada-share-view { grid-template-columns: 1fr; }
	.nomada-share-config { grid-column: 1; position: static; margin-top: 20px; }
	.nomada-share-list { margin-bottom: 4px; }
}
.nomada-share-row { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); cursor: pointer; box-shadow: var(--nm-elev); transition: border-color .1s ease; }
.nomada-share-row:hover { border-color: var(--nm-brand); }
.nomada-share-row.is-selected { border-color: var(--nm-brand); box-shadow: inset 0 0 0 1px var(--nm-brand), var(--nm-elev); }
.nomada-share-row .nomada-fava { width: 22px; height: 22px; border-radius: 6px; flex: 0 0 auto; margin: 0; }
.nomada-share-row__id { display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.25; }
.nomada-share-row__id b { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-share-row__id small { color: var(--nm-muted); font-size: 12px; }
.nomada-pubtoggle { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 13px; font-weight: 600; padding: 6px 13px; border-radius: 999px; border: 1px solid var(--nm-line); background: var(--nm-bg); color: var(--nm-muted); cursor: pointer; }
.nomada-pubdot { width: 8px; height: 8px; border-radius: 50%; background: var(--nm-muted); }
.nomada-pubtoggle.is-on { color: var(--nm-up); border-color: rgba(22, 163, 74, 0.4); background: rgba(22, 163, 74, 0.10); }
.nomada-pubtoggle.is-on .nomada-pubdot { background: var(--nm-up); }
.nomada-pubtoggle[disabled] { opacity: .5; cursor: default; }
.nomada-share-card { background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 20px; margin-bottom: 18px; box-shadow: var(--nm-elev); }
.nomada-share-card h3 { margin: 0 0 4px; font-size: 16px; }
.nomada-share-card > .nomada-muted { margin: 6px 0 12px; font-size: 13px; }
.nomada-share-card .nomada-share__row { margin-top: 6px; }
.nomada-settings-hint { font-size: 13px; margin: 4px 0 0; }
.nomada-vis-h { margin: 14px 0 8px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--nm-muted); }
.nomada-vis-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px 16px; }
.nomada-vis-item { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.nomada-vis-item input { width: 16px; height: 16px; accent-color: var(--nm-brand); cursor: pointer; }
.nomada-modal__close { position: absolute; top: 12px; right: 14px; border: 0; background: transparent; font-size: 22px; cursor: pointer; color: var(--nm-muted); line-height: 1; }
.nomada-modal__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--nm-line); }
.nomada-modal__danger { display: flex; gap: 8px; margin-right: auto; }
.nomada-modal__confirm { display: flex; gap: 8px; }
.nomada-modal__actions .nomada-btn { width: auto; padding: 9px 16px; }
@media (max-width: 480px) {
	.nomada-modal__danger, .nomada-modal__confirm { width: 100%; }
	.nomada-modal__confirm { order: 1; justify-content: flex-end; }
	.nomada-modal__danger { order: 2; }
	.nomada-modal__confirm .nomada-btn { flex: 1; }
}
.nomada-snippet { background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 9px; padding: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; white-space: pre-wrap; word-break: break-all; margin: 12px 0; }
.nomada-form-error { color: var(--nm-down); font-size: 13px; margin: 8px 0 0; }

/* Header nav (Sites / Account) */
.nomada-app__nav { display: flex; gap: 4px; }
.nomada-navbtn { border: 1px solid transparent; background: transparent; color: var(--nm-muted); font: inherit; font-weight: 600; padding: 8px 14px; border-radius: 9px; cursor: pointer; }
.nomada-navbtn:hover { background: var(--nm-bar); color: var(--nm-ink); }
.nomada-navbtn.is-active { background: var(--nm-brand); color: var(--nm-brand-ink); }

.nomada-view { display: block; }
.nomada-loading { padding: 48px; text-align: center; color: var(--nm-muted); }

/* Overview: header + window toggle */
.nomada-ov-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.nomada-ov-head h2 { margin: 0; font-size: 20px; }
.nomada-wintoggle { display: flex; gap: 6px; }

/* Overview: cross-site totals */
.nomada-ov-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 22px; }
.nomada-tcard { background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.nomada-tcard .l { font-size: 12px; color: var(--nm-muted); }
.nomada-tcard .v { font-size: 26px; font-weight: 700; letter-spacing: -0.02em; }

/* Overview: site cards */
.nomada-ov-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.nomada-sitecard { text-align: left; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 16px; cursor: pointer; font: inherit; color: inherit; display: flex; flex-direction: column; gap: 14px; transition: transform .1s ease, box-shadow .1s ease, border-color .1s ease; }
.nomada-sitecard:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(2,6,23,0.12); border-color: var(--nm-brand); }
.nomada-sitecard__top { display: flex; align-items: center; gap: 10px; }
.nomada-avatar { position: relative; overflow: hidden; width: 34px; height: 34px; border-radius: 9px; background: var(--nm-bar); color: var(--nm-brand); display: grid; place-items: center; font-weight: 700; font-size: 15px; flex: 0 0 auto; }
.nomada-avatar__l { transition: opacity .15s ease; }
.nomada-avatar .nomada-fav { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6px; opacity: 0; transition: opacity .15s ease; }
.nomada-avatar.is-loaded .nomada-fav { opacity: 1; }
.nomada-avatar.is-loaded .nomada-avatar__l { opacity: 0; }
.nomada-sitecard__id { display: flex; flex-direction: column; min-width: 0; }
.nomada-sitecard__name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-sitecard__domain { font-size: 12px; color: var(--nm-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-tagpub { margin-left: auto; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; color: var(--nm-brand); background: var(--nm-bar); padding: 3px 7px; border-radius: 999px; flex: 0 0 auto; }
.nomada-sitecard__stats { display: flex; gap: 24px; }
.nomada-sitecard__stats .v { font-size: 22px; font-weight: 700; display: block; line-height: 1.2; }
.nomada-sitecard__stats .l { font-size: 12px; color: var(--nm-muted); }
.nomada-sitecard--add { align-items: center; justify-content: center; flex-direction: row; color: var(--nm-muted); font-weight: 600; border-style: dashed; min-height: 120px; }
.nomada-sitecard--add:hover { color: var(--nm-brand); transform: none; box-shadow: none; }
.nomada-sitecard--add span { font-size: 18px; margin-right: 4px; }

/* Overview: controls + horizontal site list */
.nomada-ov-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.nomada-sortsel { padding: 8px 12px; border: 1px solid var(--nm-line); border-radius: 9px; background: var(--nm-panel); color: var(--nm-ink); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.nomada-ov-hint { font-size: 12px; color: var(--nm-muted); margin: -10px 0 12px; }
.nomada-add-site-btn { width: auto; padding: 8px 16px; font-size: 14px; box-shadow: none; }
.nomada-ov-title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.nomada-ov-title h2 { margin: 0; font-size: 20px; }
.nomada-ov-count { font-size: 13px; font-weight: 600; color: var(--nm-muted); background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 999px; padding: 4px 12px; }
.nomada-tcard__online { display: inline-flex; align-items: center; gap: 7px; }
.nomada-tcard__online.is-active { color: var(--nm-ink); }
.nomada-tcard__online.is-active .nomada-live__dot { background: var(--nm-up); animation: nomada-pulse 1.8s infinite; }

.nomada-site-list { display: flex; flex-direction: column; gap: 10px; }
.nomada-site-row { display: flex; align-items: center; gap: 14px; background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 13px 18px; cursor: pointer; transition: border-color .1s ease, box-shadow .1s ease, opacity .1s ease; }
.nomada-site-row:hover { border-color: var(--nm-brand); box-shadow: 0 8px 22px rgba(2,6,23,0.10); }
.nomada-site-row .nomada-avatar { width: 32px; height: 32px; flex: 0 0 auto; }
.nomada-site-row__id { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.nomada-site-row__name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-site-row__domain { font-size: 12px; color: var(--nm-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-site-row__online { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--nm-muted); flex: 0 0 auto; }
.nomada-site-row__online.is-active { color: var(--nm-ink); }
.nomada-site-row__online.is-active .nomada-live__dot { background: var(--nm-up); animation: nomada-pulse 1.8s infinite; }
.nomada-site-row__m { flex: 0 0 auto; width: 96px; text-align: right; }
.nomada-site-row__m b { display: block; font-size: 18px; font-weight: 700; line-height: 1.15; }
.nomada-site-row__m small { font-size: 11px; color: var(--nm-muted); }
.nomada-drag { flex: 0 0 auto; color: var(--nm-muted); cursor: grab; font-size: 15px; line-height: 1; letter-spacing: -3px; user-select: none; }
.nomada-site-row.is-dragging { opacity: .45; }
.nomada-site-row.is-dragover { border-color: var(--nm-brand); box-shadow: inset 0 0 0 2px var(--nm-brand); }
/* The extra per-site metrics (views/visit, bounce, duration) drop off first when the
   row runs short on width, leaving the two headline numbers. */
@media (max-width: 1024px) {
	.nomada-site-row__m { width: 84px; }
}
@media (max-width: 900px) {
	.nomada-site-row__m--ext { display: none; }
}
@media (max-width: 620px) {
	.nomada-site-row__online { display: none; }
	.nomada-site-row__m { width: 66px; }
	.nomada-add-site-btn { order: 4; }
}

/* Single-site header */
.nomada-sitehead { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.nomada-sitehead__title { margin-right: auto; }
.nomada-sitehead__title h2 { margin: 0; font-size: 20px; }
.nomada-sitehead__title span { color: var(--nm-muted); font-size: 13px; }
.nomada-sitehead__url { color: var(--nm-muted); font-size: 13px; text-decoration: none; }
.nomada-sitehead__url:hover { color: var(--nm-brand); }
.nomada-site.is-loading { opacity: .5; transition: opacity .2s; }

/* Account screen */
.nomada-account { max-width: 480px; }
.nomada-account h2 { margin: 0 0 18px; font-size: 20px; }
.nomada-hr { border: 0; border-top: 1px solid var(--nm-line); margin: 18px 0; }
.nomada-muted { color: var(--nm-muted); font-size: 13px; }
.nomada-account__actions { margin-top: 16px; }
.nomada-account__actions .nomada-btn { width: auto; }
.nomada-form-msg { margin-top: 12px; font-size: 14px; }
.nomada-form-msg.is-success { color: var(--nm-up); }
.nomada-form-msg.is-error { color: var(--nm-down); }

/* Password strength meter */
.nomada-pw { margin-top: 8px; }
.nomada-pw__bar { height: 5px; border-radius: 999px; background: var(--nm-line); overflow: hidden; margin-bottom: 8px; }
.nomada-pw__bar span { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--nm-down); transition: width .2s ease, background .2s ease; }
.nomada-pw__bar span.is-weak { background: var(--nm-down); }
.nomada-pw__bar span.is-mid { background: #f59e0b; }
.nomada-pw__bar span.is-strong { background: var(--nm-up); }
.nomada-pw__reqs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.nomada-pw__reqs li { font-size: 12px; color: var(--nm-muted); position: relative; padding-left: 18px; }
.nomada-pw__reqs li::before { content: "○"; position: absolute; left: 0; }
.nomada-pw__reqs li.is-ok { color: var(--nm-up); }
.nomada-pw__reqs li.is-ok::before { content: "✓"; }

/* Real-time current visitors */
.nomada-live { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--nm-muted); font-weight: 600; background: transparent; border: 1px solid var(--nm-line); border-radius: 999px; padding: 6px 12px; cursor: pointer; font-family: inherit; }
.nomada-live:hover { background: var(--nm-bar); }
.nomada-live b { font-weight: 700; color: var(--nm-ink); }
.nomada-live__caret { font-size: 9px; opacity: .7; transition: transform .15s ease; }
.nomada-live.is-open .nomada-live__caret { transform: rotate(180deg); }

/* Realtime panel — active pages + locations */
.nomada-rt { background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius); padding: 16px; margin-bottom: 18px; }
.nomada-rt__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.nomada-rt__col h4 { margin: 0 0 8px; font-size: 13px; font-weight: 700; }
@media (max-width: 600px) { .nomada-rt__cols { grid-template-columns: 1fr; gap: 16px; } }
.nomada-live__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--nm-muted); flex: 0 0 auto; }
.nomada-live.is-active .nomada-live__dot { background: var(--nm-up); animation: nomada-pulse 1.8s infinite; }
@keyframes nomada-pulse {
	0% { box-shadow: 0 0 0 0 rgba(22,163,74,0.5); }
	70% { box-shadow: 0 0 0 7px rgba(22,163,74,0); }
	100% { box-shadow: 0 0 0 0 rgba(22,163,74,0); }
}

/* Get-snippet button + settings install block */
.nomada-snippet-btn { white-space: nowrap; }
.nomada-snippet-block { margin-bottom: 16px; }

/* Label on the left, small Copy button on the right — above the snippet box. */
.nomada-snippet-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.nomada-snippet-head > span { font-size: 13px; color: var(--nm-muted); }
.nomada-snippet-block .nomada-snippet { margin: 0; }
.nomada-snippet-copy { flex: 0 0 auto; padding: 4px 12px; font: inherit; font-size: 12px; font-weight: 600; line-height: 1.4; border: 1px solid var(--nm-line); border-radius: 7px; background: var(--nm-panel); color: var(--nm-muted); cursor: pointer; }
.nomada-snippet-copy:hover { color: var(--nm-ink); border-color: var(--nm-brand); }

/* Settings (gear) button */
.nomada-iconbtn { width: 38px; height: 38px; border: 1px solid var(--nm-line); background: var(--nm-panel); color: var(--nm-ink); border-radius: 9px; cursor: pointer; font-size: 16px; line-height: 1; }
.nomada-iconbtn:hover { background: var(--nm-bar); border-color: var(--nm-brand); }

/* Segmentation filter chips */
.nomada-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.nomada-filters:empty { display: none; }
.nomada-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--nm-bar); color: var(--nm-ink); border-radius: 999px; padding: 5px 6px 5px 13px; font-size: 13px; font-weight: 600; }
.nomada-chip button { border: 0; background: transparent; color: var(--nm-muted); cursor: pointer; font-size: 16px; line-height: 1; width: 20px; height: 20px; border-radius: 50%; }
.nomada-chip button:hover { background: rgba(127,127,127,0.2); color: var(--nm-ink); }
.nomada-chip-clear { border: 1px solid var(--nm-line); background: transparent; color: var(--nm-muted); border-radius: 999px; padding: 5px 13px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.nomada-chip-clear:hover { color: var(--nm-ink); border-color: var(--nm-brand); }

/* Clickable breakdown rows */
.nomada-row--click { cursor: pointer; }
.nomada-row--click:hover .nomada-row__name { color: var(--nm-brand); }

/* Active filter: a clear, distinct highlight + a ✕ that removes it on click. */
.nomada-row.is-filtered { box-shadow: inset 2px 0 0 var(--nm-brand); }
.nomada-row.is-filtered .nomada-row__bar { background: rgba(99, 102, 241, 0.32); }
.nomada-row.is-filtered .nomada-row__name { font-weight: 700; color: var(--nm-ink); }
.nomada-row__x { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; margin-left: 8px; border-radius: 50%; background: var(--nm-brand); color: var(--nm-brand-ink); font-size: 9px; line-height: 1; flex: 0 0 auto; }
.nomada-row--click.is-filtered:hover .nomada-row__name { color: var(--nm-ink); }
.nomada-row--click.is-filtered:hover .nomada-row__x { background: var(--nm-down); }

/* Danger button + settings share */
.nomada-btn--danger { background: transparent; border-color: var(--nm-line); color: var(--nm-down); width: auto; }
.nomada-btn--danger:hover { background: rgba(220,38,38,0.1); border-color: var(--nm-down); }
.nomada-btn--warn { background: var(--nm-panel); border-color: var(--nm-line); color: #d97706; width: auto; }
.nomada-btn--warn:hover { background: rgba(217,119,6,0.12); border-color: #d97706; color: #d97706; }
.nomada-spacer { flex: 1; }
.nomada-share { margin: 4px 0 14px; }
.nomada-share > span { display: block; font-size: 13px; color: var(--nm-muted); margin-bottom: 6px; }
.nomada-share__row { display: flex; gap: 8px; }
.nomada-share__row input { flex: 1; padding: 9px 12px; border: 1px solid var(--nm-line); border-radius: 9px; background: var(--nm-bg); color: var(--nm-ink); font: inherit; font-size: 13px; }

/* Custom screen */
.nomada-custom { max-width: 600px; }
.nomada-custom h2 { margin: 0 0 22px; font-size: 20px; }
.nomada-custom-block { margin-bottom: 30px; }
.nomada-custom-block h3 { margin: 0 0 4px; font-size: 15px; }
.nomada-custom-block .nomada-muted { margin: 0 0 12px; font-size: 13px; }
.nomada-seg { display: inline-flex; gap: 4px; background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 10px; padding: 4px; }
.nomada-segbtn { display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent; color: var(--nm-muted); font: inherit; font-weight: 600; padding: 8px 16px; border-radius: 8px; cursor: pointer; }
.nomada-segbtn svg { display: block; }
.nomada-segbtn.is-active { background: var(--nm-brand); color: var(--nm-brand-ink); }

/* Theme picker — visual swatch cards */
.nomada-themes { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; max-width: 560px; }
.nomada-themecard { display: flex; flex-direction: column; gap: 8px; padding: 8px; border: 1px solid var(--nm-line); border-radius: 12px; background: var(--nm-panel); color: var(--nm-ink); cursor: pointer; font: inherit; transition: border-color .12s ease, transform .12s ease; }
.nomada-themecard:hover { transform: translateY(-2px); border-color: var(--nm-brand); }
.nomada-themecard.is-active { border-color: var(--nm-brand); box-shadow: inset 0 0 0 2px var(--nm-brand); }
.nomada-themecard__sw { height: 42px; border-radius: 8px; display: flex; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid rgba(127, 127, 127, 0.18); }
.nomada-themecard__sw i { width: 11px; height: 11px; border-radius: 50%; display: block; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05); }
.nomada-themecard__label { font-size: 12px; font-weight: 600; text-align: center; }
.nomada-sw--light { background: #ffffff; }
.nomada-sw--light i:nth-child(1) { background: #5b5bf0; } .nomada-sw--light i:nth-child(2) { background: #f59e0b; } .nomada-sw--light i:nth-child(3) { background: #10b981; }
.nomada-sw--sepia { background: #f7f0e3; }
.nomada-sw--sepia i:nth-child(1) { background: #a66a33; } .nomada-sw--sepia i:nth-child(2) { background: #c98a2b; } .nomada-sw--sepia i:nth-child(3) { background: #5c7f3a; }
.nomada-sw--dark { background: #131c2e; }
.nomada-sw--dark i:nth-child(1) { background: #818cf8; } .nomada-sw--dark i:nth-child(2) { background: #f59e0b; } .nomada-sw--dark i:nth-child(3) { background: #34d399; }
.nomada-sw--neon { background: #0e1530; }
.nomada-sw--neon i:nth-child(1) { background: #22d3ee; } .nomada-sw--neon i:nth-child(2) { background: #f472b6; } .nomada-sw--neon i:nth-child(3) { background: #a855f7; }
.nomada-sw--graphite { background: #1c1c1f; }
.nomada-sw--graphite i:nth-child(1) { background: #e4e4e7; } .nomada-sw--graphite i:nth-child(2) { background: #a1a1a6; } .nomada-sw--graphite i:nth-child(3) { background: #6b6b70; }
.nomada-sw--cyberpunk { background: #170c29; }
.nomada-sw--cyberpunk i:nth-child(1) { background: #ff2bd6; } .nomada-sw--cyberpunk i:nth-child(2) { background: #19e6ff; } .nomada-sw--cyberpunk i:nth-child(3) { background: #a855f7; }
.nomada-sw--sakura { background: #fffafc; }
.nomada-sw--sakura i:nth-child(1) { background: #e0608c; } .nomada-sw--sakura i:nth-child(2) { background: #f4a6c2; } .nomada-sw--sakura i:nth-child(3) { background: #7bbf8e; }
.nomada-sw--forest { background: #0e2419; }
.nomada-sw--forest i:nth-child(1) { background: #34d399; } .nomada-sw--forest i:nth-child(2) { background: #4ade80; } .nomada-sw--forest i:nth-child(3) { background: #2dd4bf; }
.nomada-sw--tokyo { background: #222433; }
.nomada-sw--tokyo i:nth-child(1) { background: #7aa2f7; } .nomada-sw--tokyo i:nth-child(2) { background: #bb9af7; } .nomada-sw--tokyo i:nth-child(3) { background: #7dcfff; }
.nomada-sw--gold { background: #1a1810; }
.nomada-sw--gold i:nth-child(1) { background: #e3b341; } .nomada-sw--gold i:nth-child(2) { background: #f0c75e; } .nomada-sw--gold i:nth-child(3) { background: #b08d57; }
@media (max-width: 520px) { .nomada-themes { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); } }
.nomada-excl-list { border-top: 1px solid var(--nm-line); }
.nomada-excl-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--nm-line); }
.nomada-excl-row__id { display: flex; align-items: center; gap: 4px; min-width: 0; }
.nomada-excl-row__id .nomada-fava { width: 20px; height: 20px; border-radius: 5px; margin-right: 6px; }
.nomada-excl-row__txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.nomada-excl-row__txt b { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nomada-excl-row__txt small { color: var(--nm-muted); font-size: 12px; }
.nomada-excl-row__act { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.nomada-excl__btn { width: auto; padding: 7px 14px; box-shadow: none; }
.nomada-excl__status { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--nm-up); }
.nomada-excl__check { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(22,163,74,0.16); font-size: 11px; }

/* Exclude-my-visits */
.nomada-exclude { margin: 4px 0 14px; }
.nomada-exclude > span { display: block; font-size: 13px; color: var(--nm-muted); margin-bottom: 6px; }
.nomada-exclude__row { display: flex; gap: 8px; }
.nomada-exclude__row .nomada-btn { text-decoration: none; }

/* Public dashboard chrome */
.nomada-public__tag { font-size: 13px; color: var(--nm-muted); font-weight: 600; text-decoration: none; }
.nomada-public__tag:hover { color: var(--nm-ink); }

/* Public dashboard — slim full-width sign-up banner at the bottom */
.nomada-pubcta { display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; margin: 36px -28px -48px; padding: 18px 28px; border-top: 1px solid var(--nm-line); background: linear-gradient(90deg, rgba(99, 102, 241, 0.14), rgba(99, 102, 241, 0.03)); }
.nomada-pubcta__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nomada-pubcta__text strong { font-size: 15px; font-weight: 700; }
.nomada-pubcta__text span { font-size: 13px; color: var(--nm-muted); }
.nomada-pubcta__btn { width: auto; padding: 10px 22px; flex: 0 0 auto; box-shadow: none; }
@media (max-width: 520px) {
	.nomada-pubcta { margin: 28px -14px -40px; padding: 16px 14px; }
}

/* Responsive */
@media (max-width: 1100px) {
	.nomada-cards { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
	.nomada-cards { grid-template-columns: repeat(3, 1fr); }
	.nomada-ov-totals { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
	.nomada-app { padding: 8px 14px 40px; }
	.nomada-cards { grid-template-columns: 1fr 1fr; }
	.nomada-app__site-switch { margin-left: 0; width: 100%; }
	.nomada-ov-totals { grid-template-columns: 1fr 1fr; }
	.nomada-app__nav { order: 3; width: 100%; }
}

/* ───────────────────────────── Alerts view ───────────────────────────── */
.nomada-alerts-top { margin-bottom: 20px; }
.nomada-alerts-top h2 { margin: 0 0 4px; }
.nomada-alerts-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.nomada-alert-card {
	background: var(--nm-panel); border: 1px solid var(--nm-line); border-radius: var(--nm-radius);
	box-shadow: var(--nm-elev); padding: 18px; display: flex; flex-direction: column; gap: 14px;
}
.nomada-alert-head { display: flex; align-items: center; gap: 10px; }
.nomada-alert-head .nomada-fava { width: 22px; height: 22px; border-radius: 5px; flex: none; }
.nomada-alert-id { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.nomada-alert-id b { color: var(--nm-ink); font-size: .98rem; }
.nomada-alert-id small { color: var(--nm-muted); font-size: .8rem; }

/* Toggle switches */
.nomada-alert-toggles { display: flex; flex-direction: column; gap: 6px; }
.nomada-switch-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; cursor: pointer; }
.nomada-switch-txt { flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.nomada-switch-txt b { color: var(--nm-ink); font-weight: 600; font-size: .9rem; }
.nomada-switch-txt small { color: var(--nm-muted); font-size: .78rem; }
.nomada-switch { position: relative; flex: none; width: 40px; height: 23px; }
.nomada-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.nomada-switch-ui { position: absolute; inset: 0; background: var(--nm-bg); border: 1px solid var(--nm-line); border-radius: 999px; transition: background .15s ease, border-color .15s ease; }
.nomada-switch-ui::after { content: ""; position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s ease; }
.nomada-switch input:checked + .nomada-switch-ui { background: var(--nm-brand); border-color: var(--nm-brand); }
.nomada-switch input:checked + .nomada-switch-ui::after { transform: translateX(17px); }

/* Custom rules */
.nomada-alert-rules { border-top: 1px solid var(--nm-line); padding-top: 12px; }
.nomada-alert-subhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.nomada-alert-subhead span { font-weight: 600; font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--nm-muted); }
.nomada-alert-rulelist { display: flex; flex-direction: column; gap: 8px; }
.nomada-alert-empty { font-size: .85rem; margin: 0; }
.nomada-alert-rule { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nomada-alert-rule select,
.nomada-alert-rule input[type="number"] {
	background: var(--nm-bg); border: 1px solid var(--nm-line); color: var(--nm-ink);
	border-radius: 8px; padding: 7px 9px; font-size: .85rem; font-family: inherit;
}
.nomada-alert-rule .nomada-ar-threshold { width: 84px; }
.nomada-ar-per { color: var(--nm-muted); font-size: .82rem; }
.nomada-ar-en { display: inline-flex; align-items: center; gap: 5px; color: var(--nm-muted); font-size: .82rem; margin-left: auto; cursor: pointer; }
.nomada-ar-remove {
	background: none; border: none; color: var(--nm-muted); font-size: 1.3rem; line-height: 1;
	cursor: pointer; padding: 0 4px; border-radius: 6px;
}
.nomada-ar-remove:hover { color: var(--nm-down); }

.nomada-alert-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--nm-line); padding-top: 14px; margin-top: 2px; }
.nomada-alert-save-wrap { display: flex; align-items: center; gap: 12px; }
.nomada-alert-msg { margin: 0; font-size: .82rem; }

@media (max-width: 760px) {
	.nomada-alerts-grid { grid-template-columns: 1fr; }
	.nomada-ar-en { margin-left: 0; }
}

/* Export row (site settings modal) */
.nomada-export { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 6px 0 2px; }
.nomada-export__label { font-weight: 600; color: var(--nm-ink); font-size: 14px; }
.nomada-export__btns { display: flex; gap: 8px; }
.nomada-export__btns .nomada-btn { padding: 6px 14px; }

/* Two fields side by side (site settings modal) */
.nomada-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.nomada-field-row .nomada-field { margin: 0; }
@media (max-width: 520px) { .nomada-field-row { grid-template-columns: 1fr; } }

/* Keyboard focus ring for clickable rows (a11y) */
.nomada-site-row:focus-visible,
.nomada-row--click:focus-visible,
.nomada-row--ev:focus-visible { outline: 2px solid var(--nm-brand); outline-offset: 2px; border-radius: 8px; }

/* "View all" panel footer + full-breakdown modal */
.nomada-expand { display: inline-grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid var(--nm-line); background: transparent; color: var(--nm-muted); border-radius: 8px; cursor: pointer; transition: color .12s ease, border-color .12s ease; }
.nomada-expand:hover { color: var(--nm-brand); border-color: var(--nm-brand); }
.nomada-expand:focus-visible { outline: 2px solid var(--nm-brand); outline-offset: 2px; }
.nomada-breakdown-body { max-height: 68vh; overflow-y: auto; margin-top: 8px; }
.nomada-breakdown-body .nomada-list { margin: 0; }

/* ─────────── Visualizations: world map + week/hour heat map ─────────── */
/* Two equal halves; each card fills its half. */
.nomada-viz { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; margin: 30px 0 18px; padding-top: 22px; border-top: 1px solid var(--nm-line); align-items: stretch; }
.nomada-viz .nomada-panel { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
@media (max-width: 900px) { .nomada-viz { grid-template-columns: 1fr; } }

/* World map card — per-country choropleth */
.nomada-map-wrap { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 0; padding: 6px; background: var(--nm-bg); border-radius: 12px; }
.nomada-map { width: 100%; height: auto; max-height: 360px; display: block; }
.nomada-cy { stroke: var(--nm-line); stroke-width: 0.6px; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: stroke .12s ease; }
.nomada-cy[data-on="1"] { stroke: color-mix(in srgb, var(--nm-brand) 55%, var(--nm-line)); }
.nomada-cy:hover { stroke: var(--nm-brand); stroke-width: 1px; }

/* Legend (shared by both cards) */
.nomada-legend { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 11px; color: var(--nm-muted); }
.nomada-legend__bar { width: 130px; height: 8px; border-radius: 5px; background: linear-gradient(90deg, color-mix(in srgb, var(--nm-muted) 34%, var(--nm-bg)), var(--nm-brand)); }
.nomada-legend__cells { display: inline-flex; gap: 3px; }
.nomada-legend__cells i { width: 13px; height: 13px; border-radius: 3px; background: color-mix(in srgb, var(--nm-brand) calc(var(--s) * 100%), var(--nm-bg)); }

/* Heat map — hours across the top, weekdays down the rows */
.nomada-heat-card .nomada-heat { flex: 1; justify-content: center; }
.nomada-heat { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.nomada-heat__row { display: grid; grid-template-columns: 34px 1fr; gap: 8px; align-items: center; }
.nomada-heat__day { font-size: 11px; font-weight: 600; color: var(--nm-muted); text-align: right; white-space: nowrap; }
.nomada-heat__cells { display: grid; grid-template-columns: repeat(24, 1fr); gap: 3px; }
.nomada-heat__hlabel { font-size: 9px; color: var(--nm-muted); text-align: center; line-height: 1; }
.nomada-heat__cell { aspect-ratio: 1; border-radius: 3px; background: color-mix(in srgb, var(--nm-brand) calc(var(--i, 0) * 100%), var(--nm-bg)); outline: 1px solid transparent; transition: outline-color .12s ease; }
.nomada-heat__cell:hover { outline-color: var(--nm-brand); }

/* Expanded viz modal */
.nomada-modal__box--viz { max-width: 1040px; }
.nomada-viz-modal-body .nomada-map-wrap { background: var(--nm-bg); border-radius: 12px; padding: 8px; }
.nomada-viz-modal-body .nomada-map { max-height: 64vh; }
.nomada-viz-modal-body .nomada-heat { margin: 6px 0 16px; }
.nomada-viz-modal-body .nomada-heat__row { grid-template-columns: 44px 1fr; gap: 10px; }
.nomada-viz-modal-body .nomada-heat__day { font-size: 12px; }
.nomada-viz-modal-body .nomada-heat__hlabel { font-size: 10px; }
.nomada-viz-modal-body .nomada-legend { margin-top: 10px; }