/* NekoVPN theme "dark" = «Тёмная» (default for regular accounts) — plain black + crimson.
   This file is the BASE: it is always loaded and defines every variable + every image slot (empty here).
   Other themes (themes/<id>/theme.css) override only what they change, under :root[data-theme="<id>"].
   See THEMES.md (repo root) for the slot list, file names and sizes. */
:root, :root[data-theme="dark"] {
  /* NekoVPN tokens: --color-bg #0a090b, --color-fg #f4eeea, --color-muted #a09090, --color-wine #8f2436, --color-wine-soft #d94a5c */
  --bg-0: #0b0b0d;
  --bg-1: #141416;

  /* ---- IMAGE SLOTS. Paths are relative to static/ (where app.css lives): url("themes/<id>/assets/<file>").
     none = empty slot -> the documented fallback is used (app.js sets html[data-slot-*] for filled slots). */
  --slot-bg-main: none;                      /* window background (lots / watch / admin)  -> fallback --scene-plain */
  --slot-bg-settings: none;                  /* background while Settings is open         -> fallback --slot-bg-main */
  --slot-header-art: none;                   /* art behind the title bar (right part)     -> fallback: nothing */
  --slot-login-art: none;                    /* art next to the login card                -> fallback: logo in the card only */
  --slot-petal: none;                        /* petal sprite for the canvas petals        -> fallback: ellipse in --petal */
  --slot-blossom: none;                      /* flower on the power ring (paused state)   -> fallback: nothing */
  --alert-sound: none;

  /* NekoVPN personal art names (sakura themes set them; none = not used). Served by /api/art to admins only. */
  --art-bg-off: none; --art-bg-on: none; --art-bg-settings: none;
  --art-eva-off: none; --art-eva-on: none; --art-eva-settings: none;
  --art-blossom: none; --art-sfx-on: none; --art-sfx-off: none;
  --eva-height: min(640px, calc(100vh - 64px));
  --scene-plain: radial-gradient(ellipse 80% 60% at 70% 0%, rgba(142, 31, 44, .10), transparent 70%), #0b0b0d;
  --scene-filter: none;
  --stage-veil: transparent;                 /* tint over the background image */
  --vignette: none;
  --header-art-opacity: .9;
  --login-art-height: min(560px, 78vh);
  --char-opacity: 1;
  /* character card (left column). Flags are "1" / "0" */
  --char-replaces-stats: 0;                  /* 1 = when the --art-char-* images load, the character card replaces the stats */
  /* personal art (THEMES.md «Personal art»): file names in private/art/<id>/, served to admins only via api/art.
     none = not used. All three char-* set -> the character card (with --char-replaces-stats: 1). */
  --art-char-off: none;                      /* parser off (power off) */
  --art-char-waiting: none;                  /* parser on, empty feed */
  --art-char-lots: none;                     /* parser on, lots in the feed */
  --art-lists: none;                         /* bottom layer behind the watch / users lists */
  --list-art-opacity: 1;
  --list-over-art: var(--glass-nested);      /* list background while --art-lists is shown */
  --list-over-art-blur: 0px;
  --char-overflow: 26px;                     /* how far the character rises above the card's top edge */
  --char-card-bg: var(--glass);
  --char-card-rim: var(--shadow-panel);
  --char-card-sheen: none;                   /* light overlay on the card (gradient) */
  --char-shadow: drop-shadow(0 8px 18px rgba(0, 0, 0, .45));

  /* effects */
  --fx-petals: 0;                            /* 1 = canvas sakura petals + mouse parallax (off with prefers-reduced-motion) */
  --petal: #c62a3a;                          /* petal colour (when --slot-petal is empty) */
  --petal-back-opacity: .36;
  --petal-front-opacity: .7;
  --petal-count: 18;                         /* back + front petals; keep <= 30 (CPU) */

  --glass: rgba(20, 19, 22, .72);            /* opaque-ish cards on plain black */
  --glass-strong: rgba(16, 14, 17, .86);
  --glass-row: rgba(244, 238, 234, .035);
  --glass-row-hover: rgba(244, 238, 234, .065);
  --glass-nested: rgba(244, 238, 234, .045);
  --glass-border: rgba(255, 255, 255, .1);
  --glass-blur: 12px;                        /* VPN backdrop-blur-md */
  --shadow-panel: 0 18px 50px rgba(0, 0, 0, .28), 0 0 0 1px rgba(255, 255, 255, .1);   /* VPN --shadow-panel */
  --shadow-hairline: 0 0 0 1px rgba(255, 255, 255, .14);                               /* VPN --shadow-hairline */
  --shadow-soft: 0 8px 24px rgba(0, 0, 0, .4);
  --divider: rgba(255, 255, 255, .07);

  --text: #f4f2f3;
  --text-2: #a59a9d;                         /* VPN muted #a09090, slightly cooler */
  --text-3: #6f676b;
  --text-on-accent: #ffffff;

  --accent: #8e1f2c;                         /* toggles, primary buttons (VPN wine #8f2436) */
  --accent-hover: #a2263a;
  --accent-hi: #c62a3a;                      /* highlights (VPN wine-soft #d94a5c) */
  --accent-soft: rgba(198, 42, 58, .14);
  --accent-glow: 0 0 10px rgba(198, 42, 58, .55), 0 0 22px rgba(198, 42, 58, .3);

  --toggle-on: #8e1f2c;
  --toggle-off: rgba(244, 238, 234, .15);    /* VPN bg-fg/15 */
  --knob: #f4eeea;                           /* VPN knob bg-fg */
  --knob-off: #f4eeea;

  --input-bg: rgba(10, 9, 11, .72);          /* VPN .tunnel-pill */
  --input-border: rgba(255, 255, 255, .08);
  --input-focus: rgba(198, 42, 58, .6);

  /* dropdown (NekoVPN .tunnel-pill / .tunnel-menu / .tunnel-option) */
  --dd-bg: rgba(10, 9, 11, .72);
  --dd-menu-bg: rgba(14, 13, 16, .94);
  --dd-menu-border: rgba(198, 42, 58, .32);
  --dd-hover-bg: rgba(198, 42, 58, .18);
  --dd-active-bg: rgba(198, 42, 58, .28);
  --dd-active-fg: #e0505f;

  --btn-ghost: rgba(244, 238, 234, .06);
  --btn-ghost-hover: rgba(244, 238, 234, .11);
  --btn-ghost-border: rgba(255, 255, 255, .14);

  --titlebar-icon: #b9b3b5;
  --titlebar-icon-hover: #ffffff;
  --app-name: #ffffff;
  --avatar-bg: linear-gradient(135deg, #2b2629, #171416);
  --avatar-ring: rgba(255, 255, 255, .16);
  --logo-bg: #141114;                        /* round NekoTrade logo: crimson rim + soft glow (glass look) */
  --logo-ring: 0 1px 4px rgba(0, 0, 0, .4);                 /* no rim: same flat round icon as NekoVPN */
  --logo-ring-lg: 0 10px 30px rgba(0, 0, 0, .45), 0 0 26px rgba(198, 42, 58, .22);

  --ring: rgba(244, 238, 234, .28);          /* VPN .ring-outer 5px fg 28% */
  --ring-inner: rgba(244, 238, 234, .16);    /* VPN .ring-inner 2px fg 16% */
  --ring-active: #c62a3a;
  --gleam: radial-gradient(circle, rgba(230, 110, 120, .9) 0%, rgba(198, 42, 58, .45) 42%, transparent 68%);
  --gleam-blend: screen;
  --flower-shadow: drop-shadow(0 1px 2px rgba(0, 0, 0, .4));
  --knob-shadow: 0 1px 2px rgba(0, 0, 0, .35);
  --fresh-border: rgba(198, 42, 58, .55);    /* new lot card */
  --fresh-glow: 0 0 18px rgba(198, 42, 58, .25);
  --page-badge-bg: rgba(198, 42, 58, .14);
  --page-badge-fg: #f4f2f3;
  --price: #f4f2f3;
  --modal-veil: rgba(0, 0, 0, .5);

  --ok: #4fcf7f;
  --warn: #e7a93a;
  --bad: #ff5d63;
  --profit-pos: #5fd896;
  --profit-neg: #ff6b6b;
  --online: #4fcf7f;

  /* rarity words (order of the auction bot's Core/Rarity.cs) */
  --r0: #b9b9be; --r1: #52c873; --r2: #4f93f2; --r3: #b56af2; --r4: #ff5454; --r5: #f2b632; --r6: #ff6fb5;

  --radius-xl: 36px;                         /* VPN panels rounded-xl */
  --radius-lg: 28px;                         /* VPN rounded-lg (nested cards) */
  --radius-md: 16px;                         /* VPN rounded-md (buttons, inputs) */
  --radius-sm: 12px;
  --radius-pill: 999px;
  --radius-win: 14px;                        /* page corners in a browser tab; the Windows shell window is rounded by Windows 11 */

  --font: "M PLUS Rounded 1c", "Segoe UI Variable Text", "Segoe UI", "Noto Sans", system-ui, sans-serif;
  --font-display: "M PLUS Rounded 1c", "Segoe UI", "Noto Sans", sans-serif;
  color-scheme: dark;
}