/* shadcn/ui's design language, applied over the existing markup.
 *
 * Not the React components — the parts that make shadcn look the way it does:
 * one token set instead of scattered hex values, a single radius scale, muted
 * borders, and a visible focus ring on everything interactive.
 *
 * This file loads AFTER each page's own <style> block, so it wins on ties.
 * Colour, border and radius declarations carry !important because most
 * controls in these pages are styled inline; layout properties (flex, width,
 * margin, padding) are deliberately left alone so nothing moves. */

:root {
  --background: #09090b;          /* zinc-950 */
  --foreground: #fafafa;
  --card: #111113;
  --card-hover: #17171a;
  --popover: #111113;
  --muted: #1c1c1f;
  --muted-foreground: #a1a1aa;    /* zinc-400 */
  --subtle-foreground: #71717a;   /* zinc-500 */
  --border: #27272a;              /* zinc-800 */
  --input: #27272a;
  --ring: #6366f1;
  --primary: #6366f1;             /* the app's indigo, kept as the brand */
  --primary-hover: #5457e5;
  --primary-foreground: #ffffff;
  --secondary: #1c1c1f;
  --secondary-hover: #26262a;
  --secondary-foreground: #e4e4e7;
  --accent-bg: #1e1b3a;
  --accent-border: #383172;
  --accent-foreground: #e0e0f8;
  --destructive: #7f1d1d;
  --destructive-bg: #2a1215;
  --destructive-foreground: #fecaca;
  --success: #166534;
  --radius: 0.5rem;
}

/* ---------- base ---------- */

body {
  background: var(--background) !important;
  color: var(--foreground) !important;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  -webkit-font-smoothing: antialiased;
}

h1 { color: var(--foreground) !important; letter-spacing: -0.02em !important; }

.card {
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  border-radius: calc(var(--radius) + 4px) !important;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.25);
}
.card h2 { color: var(--muted-foreground) !important; }

label { color: var(--muted-foreground) !important; }

/* ---------- form controls ---------- */

input[type="text"], input[type="number"], input[type="password"], select, textarea, input[type="file"] {
  background: var(--background) !important;
  border: 1px solid var(--input) !important;
  border-radius: var(--radius) !important;
  color: var(--foreground) !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input[type="text"]:focus, input[type="number"]:focus, input[type="password"]:focus,
select:focus, textarea:focus, input[type="file"]:focus {
  border-color: var(--ring) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ring) 25%, transparent) !important;
  outline: none !important;
}
input::placeholder, textarea::placeholder { color: var(--subtle-foreground) !important; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--primary); }
input[type="range"] { accent-color: var(--primary); }

/* ---------- buttons ---------- */
/* Colour only: whatever sizing the markup already sets is respected. */

button, .btn {
  border-radius: var(--radius) !important;
  font-weight: 500;
  transition: background-color .15s ease, border-color .15s ease, opacity .15s ease;
}
button:focus-visible, .btn:focus-visible, a:focus-visible, select:focus-visible {
  outline: 2px solid var(--ring) !important;
  outline-offset: 2px !important;
}
button:disabled, .btn:disabled { opacity: .5 !important; cursor: not-allowed !important; }

.btn-primary {
  background: var(--primary) !important;
  border: 1px solid var(--primary) !important;
  color: var(--primary-foreground) !important;
}
.btn-primary:hover:not(:disabled) { background: var(--primary-hover) !important; }

.btn-secondary {
  background: var(--secondary) !important;
  border: 1px solid var(--border) !important;
  color: var(--secondary-foreground) !important;
}
.btn-secondary:hover:not(:disabled) { background: var(--secondary-hover) !important; }

.btn-accent {
  background: var(--accent-bg) !important;
  border: 1px solid var(--accent-border) !important;
  color: var(--accent-foreground) !important;
}
.btn-accent:hover:not(:disabled) { background: #262151 !important; }

.btn-danger {
  background: var(--destructive-bg) !important;
  border: 1px solid var(--destructive) !important;
  color: var(--destructive-foreground) !important;
}
.btn-danger:hover:not(:disabled) { background: #3a1a1e !important; }

/* ---------- tabs (the mode cards) ---------- */

.mode-btn {
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  border-radius: calc(var(--radius) + 2px) !important;
  color: var(--muted-foreground) !important;
  transition: background-color .15s ease, border-color .15s ease;
}
.mode-btn:hover { background: var(--card-hover) !important; border-color: #3f3f46 !important; }
.mode-btn.active {
  background: var(--accent-bg) !important;
  border-color: var(--primary) !important;
  color: var(--foreground) !important;
}
.mode-desc { color: var(--subtle-foreground) !important; }

.sub-btn {
  background: var(--secondary) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--muted-foreground) !important;
}
.sub-btn.active {
  background: var(--accent-bg) !important;
  border-color: var(--primary) !important;
  color: var(--foreground) !important;
}

/* ---------- surfaces inside cards ---------- */

.panel {
  background: var(--muted) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}

details {
  border-radius: var(--radius) !important;
  border-color: var(--border) !important;
}
summary { color: var(--secondary-foreground) !important; }
summary::marker { color: var(--subtle-foreground); }

table { font-variant-numeric: tabular-nums; }
th { color: var(--muted-foreground) !important; font-weight: 500 !important; }
td, th { border-color: var(--border) !important; }

audio { border-radius: var(--radius); }
video { border-radius: var(--radius) !important; }
img { border-radius: calc(var(--radius) - 2px); }

a { color: var(--primary); }

/* ---------- scrollbars ---------- */

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #2f2f35; border-radius: 99px; border: 2px solid var(--background); }
::-webkit-scrollbar-thumb:hover { background: #3f3f46; }

/* ---------- reading at a distance ----------
 *
 * The column is 780px because that is a comfortable measure for a paragraph.
 * On a wide desktop the column is right and everything inside it is too small:
 * the same text, further away, with nothing around it for scale. Sizes here are
 * in rem, so moving the root size moves the lot — labels, hints, logs and the
 * transcript together — and the column widens a little to keep pace. */
@media (min-width: 1500px) {
  html { font-size: 17px; }
  .container { max-width: 860px; }
}
@media (min-width: 2000px) {
  html { font-size: 18px; }
  .container { max-width: 920px; }
}
@media (min-width: 2600px) {
  html { font-size: 19px; }
  .container { max-width: 1000px; }
}

/* ---------- the tabs as a sidebar ----------
 *
 * Six tabs in a row across the top of a very wide screen is a lot of empty
 * space either side of a column of work. Past 1400px the row leaves the flow
 * and stands down the left instead: always in view, always in the same place,
 * and each tab reads as a line rather than a tile. Below that it stays where it
 * was, because there is no room beside the column.
 *
 * It is positioned against the middle of the window rather than the left edge,
 * so it sits beside the column at any width instead of drifting off towards the
 * corner of a very wide monitor. Each step below pairs a sidebar width with the
 * column width from the block above: half the column, plus the sidebar, plus
 * the gap between them. */
@media (min-width: 1400px) {
  body:not(.home) #tabBar {
    position: fixed;
    left: calc(50% - 390px - 240px - 28px);   /* column 780 */
    top: 84px;
    width: 240px;
    max-width: 240px;
    max-height: calc(100vh - 108px);
    overflow-y: auto;
    margin-bottom: 0;
    z-index: 5;
  }
  body:not(.home) #tabBar .mode-toggle {
    grid-template-columns: 1fr !important;   /* the row spec is set inline */
    gap: 6px;
  }
  body:not(.home) #tabBar .mode-btn {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 10px;
    align-items: center;
    text-align: left;
    padding: 10px 12px;
  }
  body:not(.home) #tabBar .mode-icon {
    grid-row: 1 / 3;
    font-size: 1.2rem;
    margin-bottom: 0;
  }
  body:not(.home) #tabBar .mode-desc { grid-column: 2; margin-top: 1px; }
}

@media (min-width: 1500px) { body:not(.home) #tabBar { left: calc(50% - 430px - 240px - 28px); } }   /* column 860 */
@media (min-width: 2000px) {
  body:not(.home) #tabBar { left: calc(50% - 460px - 272px - 32px); width: 272px; max-width: 272px; top: 92px; }
}
@media (min-width: 2600px) { body:not(.home) #tabBar { left: calc(50% - 500px - 272px - 32px); } }   /* column 1000 */

/* ---------- the start page ----------
 *
 * Opening the app with a tool already chosen means guessing which one someone
 * wants. It opens on the tools instead: six cards in the middle of the page and
 * nothing else. Picking one switches to the working view, where the same
 * buttons become the sidebar above, so there is one list of tools and not two.
 * "All tools" in the corner, or the title, comes back here. */
body.home > .container { display: none !important; }
body.home #homeLink { display: none; }
body:not(.home) #homeLink { display: inline-block; }

body.home #tabBar {
  position: static;
  width: 100%;
  max-width: 900px;
  margin: 8px auto 0;
}
body.home #tabBar .mode-toggle {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 14px;
}
body.home #tabBar .mode-btn {
  padding: 30px 20px;
  border-radius: calc(var(--radius) + 4px) !important;
}
body.home #tabBar .mode-icon { font-size: 2rem; margin-bottom: 12px; }
body.home #tabBar .mode-desc { font-size: 0.86rem; margin-top: 4px; }

/* On a big screen the cards can afford to be cards. */
@media (min-width: 2000px) {
  body.home #tabBar { max-width: 1120px; }
  body.home #tabBar .mode-toggle { grid-template-columns: repeat(3, 1fr) !important; gap: 18px; }
  body.home #tabBar .mode-btn { padding: 40px 24px; }
  body.home #tabBar .mode-icon { font-size: 2.4rem; margin-bottom: 14px; }
}

/* ---------- light mode ----------
 *
 * The same design in daylight: white cards on a zinc page, each with a firm
 * edge and a soft shadow so it stands off the page — a dark theme separates
 * surfaces by shade, a light one needs the edge and the lift. The brand indigo
 * goes a shade deeper so links and focus rings keep their contrast on white.
 * Chosen with the switch in the header and remembered per browser; the pages
 * set data-theme on <html> before first paint, so there is no dark flash.
 *
 * Most of the interface draws its colours from the tokens, so redefining them
 * is most of the work. The rest is colour written straight into the pages —
 * inline styles, script-built HTML, and the pages' own style blocks — which no
 * token reaches. That is remapped below, value by value: the dark palette is
 * small and each value has one job, so each has one light counterpart. White
 * text is left alone on purpose: nearly all of it sits on a coloured button or
 * badge. */
:root { color-scheme: dark; }
:root[data-theme="light"] {
  color-scheme: light;
  --background: #f4f4f5;          /* zinc-100: the page, so white cards stand off it */
  --foreground: #09090b;
  --card: #ffffff;
  --card-hover: #fafafa;
  --popover: #ffffff;
  --muted: #f4f4f5;
  --muted-foreground: #52525b;    /* zinc-600 */
  --subtle-foreground: #63636e;   /* 5.6:1 on white */
  --border: #dedee3;
  --input: #d4d4d8;               /* zinc-300: inputs need a visible edge */
  --ring: #4f46e5;
  --primary: #4f46e5;             /* indigo-600: 6.3:1 on white */
  --primary-hover: #4338ca;
  --primary-foreground: #ffffff;
  --secondary: #ffffff;
  --secondary-hover: #f4f4f5;
  --secondary-foreground: #18181b;
  --accent-bg: #eef2ff;           /* indigo-50 */
  --accent-border: #c7d2fe;
  --accent-foreground: #3730a3;
  --destructive: #fca5a5;
  --destructive-bg: #fef2f2;
  --destructive-foreground: #991b1b;
  --lift: 0 1px 2px rgb(24 24 27 / 0.06), 0 2px 8px rgb(24 24 27 / 0.06);
  --lift-hover: 0 2px 4px rgb(24 24 27 / 0.08), 0 8px 20px rgb(24 24 27 / 0.08);
}

/* Edges and lift. */
:root[data-theme="light"] .card { box-shadow: var(--lift) !important; }
:root[data-theme="light"] .mode-btn { box-shadow: var(--lift); transition: box-shadow .15s ease, border-color .15s ease, background-color .15s ease; }
:root[data-theme="light"] .mode-btn:hover { border-color: #c4c4cc !important; box-shadow: var(--lift-hover); }
:root[data-theme="light"] .mode-btn.active { border-color: var(--primary) !important; }
:root[data-theme="light"] .btn-secondary,
:root[data-theme="light"] #authBar button { box-shadow: 0 1px 2px rgb(24 24 27 / 0.06); }
:root[data-theme="light"] input[type="text"], :root[data-theme="light"] input[type="number"],
:root[data-theme="light"] input[type="password"], :root[data-theme="light"] select,
:root[data-theme="light"] textarea { background: #ffffff !important; }

:root[data-theme="light"] .btn-accent:hover:not(:disabled) { background: #e0e7ff !important; }
:root[data-theme="light"] .btn-danger:hover:not(:disabled) { background: #fee2e2 !important; }
:root[data-theme="light"] * { scrollbar-color: #c4c4cc transparent !important; }
:root[data-theme="light"] ::-webkit-scrollbar-thumb { background: #c4c4cc; border-color: transparent; }
:root[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #a1a1aa; }

:root[data-theme="light"] #authBar button { background: #ffffff !important; border-color: #dedee3 !important; color: #27272a !important; }
:root[data-theme="light"] #authBar button:hover { border-color: #6366f1 !important; color: #09090b !important; }
:root[data-theme="light"] .user-info { color: #52525b !important; }
:root[data-theme="light"] .vo-w:hover { background: #e4e4e7 !important; }
:root[data-theme="light"] .vo-w.vo-active { background: #4f46e5 !important; color: #ffffff !important; }
:root[data-theme="light"] .vo-w.vo-picked { background: #e0e7ff !important; color: #1e1b4b !important; }
:root[data-theme="light"] #voTranscript { color: #27272a !important; }

#themeToggle { font-variant-emoji: text; }

/* The pages' own style blocks, rule by rule (components already drawn from
 * the tokens are left to them). */
:root[data-theme="light"] .slider-value { color: #18181b !important;}
:root[data-theme="light"] .toggle { color: #27272a !important;}
:root[data-theme="light"] #log { background: #f4f4f5 !important; border-color: #e4e4e7 !important; color: #3f3f46 !important;}
:root[data-theme="light"] #loginOverlay { background: #f4f4f5 !important;}
:root[data-theme="light"] .mode-btn.locked:hover,
:root[data-theme="light"] .sub-btn.locked:hover { border-color: #e4e4e7 !important; color: #52525b !important;}
:root[data-theme="light"] .input-preview { border-color: #e4e4e7 !important; background: #f4f4f5 !important;}
:root[data-theme="light"] .input-preview-copy { background: #ffffff !important; color: #18181b !important; border-color: #e4e4e7 !important;}
:root[data-theme="light"] .input-preview-copy:hover { background: #f4f4f5 !important;}
:root[data-theme="light"] .btn-sm { color: #4338ca !important;}
:root[data-theme="light"] .step-indicator { color: #63636e !important; background: #ffffff !important; border-color: #e4e4e7 !important;}
:root[data-theme="light"] .step-indicator.completed { color: #15803d !important;}
:root[data-theme="light"] .scene-card { background: #f4f4f5 !important; border-color: #e4e4e7 !important;}
:root[data-theme="light"] .scene-card .scene-header { color: #4f46e5 !important;}
:root[data-theme="light"] .scene-card .scene-meta { color: #52525b !important;}
:root[data-theme="light"] .hint { color: #63636e !important;}
:root[data-theme="light"] .avatar-tile { background: #f4f4f5 !important; border-color: #e4e4e7 !important;}
:root[data-theme="light"] .avatar-thumb { background: #ffffff !important; color: #4f46e5 !important;}
:root[data-theme="light"] .avatar-name { color: #18181b !important;}
:root[data-theme="light"] .avatar-sub { color: #63636e !important;}
:root[data-theme="light"] .avatar-edit { color: #3f3f46 !important;}
:root[data-theme="light"] .shot-badge.presenter { color: #4338ca !important;}
:root[data-theme="light"] .shot-badge.pip { color: #b45309 !important;}
:root[data-theme="light"] .shot-badge.broll { color: #63636e !important;}
:root[data-theme="light"] .cost-estimate { color: #63636e !important;}
:root[data-theme="light"] .cost-estimate .est-total { color: #18181b !important;}
:root[data-theme="light"] .cost-estimate .est-note { color: #4f46e5 !important;}
:root[data-theme="light"] .log-box { background: #f4f4f5 !important; border-color: #e4e4e7 !important; color: #3f3f46 !important;}
:root[data-theme="light"] .char-count { color: #52525b !important;}
:root[data-theme="light"] .char-count.over { color: #dc2626 !important;}
:root[data-theme="light"] #authBar .back-link { color: #52525b !important;}
:root[data-theme="light"] #authBar .back-link:hover { color: #27272a !important;}

/* Inline styles and script-built HTML, value by value. Each dark value has
 * one light counterpart, so a new hard-coded colour needs one new rule in its
 * group. */
/* backgrounds */
:root[data-theme="light"] [style*="background:#0f0f13" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #0f0f13" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(15, 15, 19)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#0f0f13" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #0f0f13" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(15, 15, 19)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #f4f4f5 !important; }
:root[data-theme="light"] [style*="background:#12121a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #12121a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(18, 18, 26)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#12121a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #12121a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(18, 18, 26)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fafafa !important; }
:root[data-theme="light"] [style*="background:#1a1a24" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #1a1a24" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(26, 26, 36)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#1a1a24" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #1a1a24" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(26, 26, 36)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #ffffff !important; }
:root[data-theme="light"] [style*="background:#1e1e28" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #1e1e28" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(30, 30, 40)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#1e1e28" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #1e1e28" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(30, 30, 40)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #f4f4f5 !important; }
:root[data-theme="light"] [style*="background:#1e1e3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #1e1e3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(30, 30, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#1e1e3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #1e1e3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(30, 30, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #eef2ff !important; }
:root[data-theme="light"] [style*="background:#1a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #1a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(26, 26, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#1a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #1a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(26, 26, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #eef2ff !important; }
:root[data-theme="light"] [style*="background:#2a1a1a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #2a1a1a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(42, 26, 26)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#2a1a1a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #2a1a1a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(42, 26, 26)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fef2f2 !important; }
:root[data-theme="light"] [style*="background:#2a2a38" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #2a2a38" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(42, 42, 56)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#2a2a38" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #2a2a38" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(42, 42, 56)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #e4e4e7 !important; }
:root[data-theme="light"] [style*="background:#3a3a50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #3a3a50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(58, 58, 80)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#3a3a50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #3a3a50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(58, 58, 80)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #d4d4d8 !important; }
:root[data-theme="light"] [style*="background:#444458" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #444458" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(68, 68, 88)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#444458" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #444458" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(68, 68, 88)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #71717a !important; }
:root[data-theme="light"] [style*="background:#5b5bf0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #5b5bf0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(91, 91, 240)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#5b5bf0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #5b5bf0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(91, 91, 240)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #4f46e5 !important; }
:root[data-theme="light"] [style*="background:#0c0c10" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #0c0c10" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(12, 12, 16)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#0c0c10" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #0c0c10" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(12, 12, 16)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #f4f4f5 !important; }
:root[data-theme="light"] [style*="background:#12121c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #12121c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(18, 18, 28)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#12121c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #12121c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(18, 18, 28)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fafafa !important; }
:root[data-theme="light"] [style*="background:#12122a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #12122a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(18, 18, 42)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#12122a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #12122a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(18, 18, 42)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #eef2ff !important; }
:root[data-theme="light"] [style*="background:#12331f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #12331f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(18, 51, 31)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#12331f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #12331f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(18, 51, 31)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #f0fdf4 !important; }
:root[data-theme="light"] [style*="background:#15151c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #15151c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(21, 21, 28)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#15151c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #15151c" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(21, 21, 28)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fafafa !important; }
:root[data-theme="light"] [style*="background:#23234a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #23234a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(35, 35, 74)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#23234a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #23234a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(35, 35, 74)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #e0e7ff !important; }
:root[data-theme="light"] [style*="background:#24243a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #24243a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(36, 36, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#24243a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #24243a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(36, 36, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #e4e4e7 !important; }
:root[data-theme="light"] [style*="background:#2a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #2a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(42, 26, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#2a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #2a1a3a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(42, 26, 58)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #f5f3ff !important; }
:root[data-theme="light"] [style*="background:#2a2a55" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #2a2a55" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(42, 42, 85)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#2a2a55" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #2a2a55" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(42, 42, 85)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #e0e7ff !important; }
:root[data-theme="light"] [style*="background:#2a2a5a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #2a2a5a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(42, 42, 90)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#2a2a5a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #2a2a5a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(42, 42, 90)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #e0e7ff !important; }
:root[data-theme="light"] [style*="background:#3a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #3a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(58, 32, 32)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#3a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #3a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(58, 32, 32)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fee2e2 !important; }
:root[data-theme="light"] [style*="background:#5a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: #5a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background: rgb(90, 32, 32)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color:#5a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: #5a2020" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="background-color: rgb(90, 32, 32)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { background: #fecaca !important; }
:root[data-theme="light"] [style*="color:#e8e8ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #e8e8ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(232, 232, 255)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #1e1b4b !important; }
/* borders */
:root[data-theme="light"] [style*="#2a2a38" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(42, 42, 56)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #dedee3 !important; }
:root[data-theme="light"] [style*="#1e1e28" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(30, 30, 40)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #e4e4e7 !important; }
:root[data-theme="light"] [style*="#23232f" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(35, 35, 47)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #dedee3 !important; }
:root[data-theme="light"] [style*="#3a3a5c" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(58, 58, 92)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #c7d2fe !important; }
:root[data-theme="light"] [style*="#6b2b2b" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(107, 43, 43)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #fca5a5 !important; }
:root[data-theme="light"] [style*="#5b5bf0" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(91, 91, 240)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #4f46e5 !important; }
:root[data-theme="light"] [style*="#8b8bf7" i][style*="border" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="rgb(139, 139, 247)"][style*="border"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { border-color: #6366f1 !important; }
/* text — "color:" also matches inside border-color and background-color; the text palette is used for neither */
:root[data-theme="light"] [style*="color:#e0e0e8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #e0e0e8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(224, 224, 232)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #18181b !important; }
:root[data-theme="light"] [style*="color:#e0e0f8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #e0e0f8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(224, 224, 248)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #3730a3 !important; }
:root[data-theme="light"] [style*="color:#c0c0d8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #c0c0d8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(192, 192, 216)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #27272a !important; }
:root[data-theme="light"] [style*="color:#c8c8dd" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #c8c8dd" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(200, 200, 221)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #27272a !important; }
:root[data-theme="light"] [style*="color:#c0c0e8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #c0c0e8" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(192, 192, 232)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #27272a !important; }
:root[data-theme="light"] [style*="color:#ccc" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #ccc" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(204, 204, 204)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #3f3f46 !important; }
:root[data-theme="light"] [style*="color:#a6a6c2" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #a6a6c2" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(166, 166, 194)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #52525b !important; }
:root[data-theme="light"] [style*="color:#a0a0c0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #a0a0c0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(160, 160, 192)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #3f3f46 !important; }
:root[data-theme="light"] [style*="color:#9494b0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #9494b0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(148, 148, 176)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #63636e !important; }
:root[data-theme="light"] [style*="color:#9090b0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #9090b0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(144, 144, 176)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #63636e !important; }
:root[data-theme="light"] [style*="color:#9a9ab0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #9a9ab0" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(154, 154, 176)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #63636e !important; }
:root[data-theme="light"] [style*="color:#8a8a9a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8a8a9a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(138, 138, 154)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #63636e !important; }
:root[data-theme="light"] [style*="color:#8888cc" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8888cc" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(136, 136, 204)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4f46e5 !important; }
:root[data-theme="light"] [style*="color:#6b6b88" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #6b6b88" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(107, 107, 136)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #63636e !important; }
:root[data-theme="light"] [style*="color:#55556e" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #55556e" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(85, 85, 110)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #a1a1aa !important; }
:root[data-theme="light"] [style*="color:#8b8bf7" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8b8bf7" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(139, 139, 247)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4f46e5 !important; }
:root[data-theme="light"] [style*="color:#9b9bff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #9b9bff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(155, 155, 255)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4338ca !important; }
:root[data-theme="light"] [style*="color:#b8b8ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #b8b8ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(184, 184, 255)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4338ca !important; }
:root[data-theme="light"] [style*="color:#d0d0ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #d0d0ff" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(208, 208, 255)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4338ca !important; }
:root[data-theme="light"] [style*="color:#8888ee" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8888ee" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(136, 136, 238)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #4338ca !important; }
:root[data-theme="light"] [style*="color:#56c5f5" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #56c5f5" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(86, 197, 245)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #0369a1 !important; }
:root[data-theme="light"] [style*="color:#ffd7d7" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #ffd7d7" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(255, 215, 215)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #991b1b !important; }
:root[data-theme="light"] [style*="color:#ffb4b4" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #ffb4b4" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(255, 180, 180)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #b91c1c !important; }
:root[data-theme="light"] [style*="color:#e57373" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #e57373" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(229, 115, 115)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #dc2626 !important; }
:root[data-theme="light"] [style*="color:#ff8080" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #ff8080" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(255, 128, 128)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #dc2626 !important; }
:root[data-theme="light"] [style*="color:#f44" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #f44" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(255, 68, 68)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #dc2626 !important; }
:root[data-theme="light"] [style*="color:#f28b82" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #f28b82" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(242, 139, 130)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #b91c1c !important; }
:root[data-theme="light"] [style*="color:#f5b041" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #f5b041" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(245, 176, 65)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #b45309 !important; }
:root[data-theme="light"] [style*="color:#f59e0b" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #f59e0b" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(245, 158, 11)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #b45309 !important; }
:root[data-theme="light"] [style*="color:#b7791f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #b7791f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(183, 121, 31)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #92400e !important; }
:root[data-theme="light"] [style*="color:#4caf50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #4caf50" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(76, 175, 80)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #15803d !important; }
:root[data-theme="light"] [style*="color:#22c55e" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #22c55e" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(34, 197, 94)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #15803d !important; }
:root[data-theme="light"] [style*="color:#5fd38a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #5fd38a" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(95, 211, 138)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #15803d !important; }
:root[data-theme="light"] [style*="color:#8fd694" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8fd694" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(143, 214, 148)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #15803d !important; }
:root[data-theme="light"] [style*="color:#8fbc8f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: #8fbc8f" i]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn),
:root[data-theme="light"] [style*="color: rgb(143, 188, 143)"]:not(.btn):not(.card):not(.panel):not(.mode-btn):not(.sub-btn) { color: #15803d !important; }