/* DeployCircle — Design-Grundwerte (0.18.3): das Glas-Design der Circle-Produktreihe. Übernommen aus RemoteCircle (rc-tokens.css, Stand 1.21), damit beide Programme als Geschwister erkennbar sind: dieselben Flächen, Kanten, Schatten, dieselbe Welle. EINZIGE Stelle für die Farben des Rahmens — dc-shell.css (Seitenleiste, Kopf-, Statusleiste, Karten, Menüs, Dialoge) verwendet AUSSCHLIESSLICH diese Variablen. Klassen am : (keine) = Hell · .dc-dark = Glas (Verlauf-„Wallpaper" hinter halbtransparenten, weichgezeichneten Scheiben). Die Werte von .dc-dark sind RemoteCircles „.rc-dark.rc-glass" bei der Vorgabe 50 % Durchsicht. Bewusst NICHT übernommen: die echte Fenster-Durchsicht und das gezeichnete Milchglas der RemoteCircle-Console — beides braucht ein eigenes Fenster, DeployCircle läuft im Browser (bzw. in der Console als WebView2) und malt das Glas selbst. Ändert sich hier etwas, gehört der Wert in RemoteCircle genauso geändert (und umgekehrt). */ :root { --dc-radius-lg: 18px; --dc-radius-md: 12px; --dc-radius-sm: 8px; --dc-accent: #2F6BFF; --dc-accent-hover: #4A7EFF; --dc-accent-contrast: #FFFFFF; --dc-accent-soft: rgba(47, 107, 255, .12); --dc-success: #22B35E; --dc-danger: #EF4459; --dc-warning: #F29D1B; /* Warn-TEXT: --dc-warning erreicht als Schrift nur ~2,2:1 auf Weiß — Punkte/Flächen behalten --dc-warning, Beschriftungen nehmen diesen Wert. */ --dc-warning-text: #B45309; /* Hell */ --dc-app-bg: #EEF2F8; --dc-tint: transparent; --dc-panel-bg: rgba(255, 255, 255, .78); --dc-panel-border: rgba(15, 23, 42, .08); --dc-panel-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 12px 32px rgba(15, 23, 42, .08); --dc-panel-blur: 18px; --dc-card-bg: rgba(255, 255, 255, .86); --dc-card-bg-hover: #FFFFFF; --dc-card-border: rgba(15, 23, 42, .08); --dc-text: #0F172A; --dc-text-muted: #475569; --dc-text-faint: #64748B; --dc-pill-bg: rgba(15, 23, 42, .05); --dc-pill-border: rgba(15, 23, 42, .08); --dc-pill-active-bg: #FFFFFF; --dc-pill-active-text: #0F172A; --dc-input-bg: rgba(255, 255, 255, .9); --dc-input-border: rgba(15, 23, 42, .12); --dc-row-hover: rgba(47, 107, 255, .05); --dc-row-divider: rgba(15, 23, 42, .07); --dc-group-bg: rgba(15, 23, 42, .03); --dc-icon-tile-blue: linear-gradient(145deg, #4F8BFF, #2F6BFF); /* Menüs/Popover/Dialoge — und DECKEND, wo kein Weichzeichner wirkt (Transparenz reduziert). */ --dc-popover-bg: rgba(255, 255, 255, .94); --dc-popover-solid: #FFFFFF; /* Feststehende Köpfe (PC-Kopfzeile) über scrollendem Inhalt: fast deckend, sonst schiene er durch. */ --dc-sticky-bg: rgba(248, 250, 255, .94); /* Tiefe der Schrift (Wunsch 28.09.2026: „dem Text etwas Tiefe geben"): ein ganz feiner Schatten unter Überschriften, Kennzahlen und Titeln — Schrift liegt damit sichtbar AUF der Scheibe statt in ihr. Hell nur ein Hauch (dort trägt der Kontrast), auf Glas deutlich. */ --dc-text-depth: 0 1px 1px rgba(15, 23, 42, .08); --dc-text-depth-strong: 0 1px 2px rgba(15, 23, 42, .12); /* Welle unten links in der Seitenleiste — Farben je Design, Aufbau/Animation in dc-shell.css (.dc-wave…). Von hinten nach vorn: Dunst · Band hinten · Band Mitte · Band vorn (trägt den Kundennamen) · Signal. */ --dc-wave-haze-1: rgba(0, 184, 212, .12); --dc-wave-haze-2: rgba(47, 107, 255, .10); --dc-wave-back-top: rgba(92, 116, 255, .18); --dc-wave-back-bottom: rgba(92, 116, 255, 0); --dc-wave-back-line: rgba(92, 116, 255, .32); --dc-wave-back-glow: rgba(92, 116, 255, .12); --dc-wave-mid-a: rgba(47, 107, 255, .10); --dc-wave-mid-b: rgba(0, 184, 212, .18); --dc-wave-mid-top: rgba(0, 184, 212, .26); --dc-wave-mid-bottom: rgba(47, 107, 255, .04); --dc-wave-mid-line: rgba(0, 146, 196, .44); --dc-wave-mid-echo: rgba(0, 146, 196, .16); --dc-wave-mid-glow: rgba(0, 184, 212, .14); --dc-wave-front-a: rgba(47, 107, 255, .93); --dc-wave-front-b: rgba(30, 124, 240, .92); --dc-wave-front-lift: rgba(255, 255, 255, .12); --dc-wave-front-deep: rgba(22, 52, 170, .52); --dc-wave-front-inner: rgba(255, 255, 255, .30); --dc-wave-edge: rgba(255, 255, 255, .72); --dc-wave-signal-core: #FFFFFF; --dc-wave-signal-glow: #22D3EE; --dc-wave-signal-bloom: .32; /* Name auf dem vorderen Band: Weiß auf Blau (≥ 4,5:1 in beiden Designs). */ --dc-wave-text: #FFFFFF; --dc-wave-text-shadow: 0 1px 2px rgba(10, 30, 90, .40); } /* Glas — RemoteCircles „.rc-dark" mit den Werten von „.rc-dark.rc-glass" darüber (Stufe 50 %). */ .dc-dark { --dc-app-bg: #16263F; --dc-tint: transparent; --dc-panel-bg: rgba(255, 255, 255, .10); --dc-panel-border: rgba(255, 255, 255, .16); --dc-panel-shadow: 0 1px 1px rgba(255, 255, 255, .10) inset, 0 18px 48px rgba(0, 0, 0, .28); --dc-panel-blur: 28px; --dc-card-bg: rgba(255, 255, 255, .10); --dc-card-bg-hover: rgba(255, 255, 255, .15); --dc-card-border: rgba(255, 255, 255, .18); --dc-text: #FFFFFF; --dc-text-muted: rgba(255, 255, 255, .78); --dc-text-faint: rgba(255, 255, 255, .66); --dc-warning-text: #FBBF24; --dc-pill-bg: rgba(255, 255, 255, .10); --dc-pill-border: rgba(255, 255, 255, .18); --dc-pill-active-bg: rgba(255, 255, 255, .92); --dc-pill-active-text: #0F172A; --dc-input-bg: rgba(255, 255, 255, .10); --dc-input-border: rgba(255, 255, 255, .22); --dc-row-hover: rgba(255, 255, 255, .07); --dc-row-divider: rgba(255, 255, 255, .10); --dc-group-bg: rgba(255, 255, 255, .04); /* Menüs/Dialoge liegen über beliebigem Inhalt — deutlich dunkler getönt als die Panels, sonst wäre weiße Schrift über hellen Stellen schwer lesbar. */ --dc-popover-bg: rgba(24, 38, 64, .72); --dc-popover-solid: rgb(24, 38, 64); --dc-sticky-bg: rgba(30, 48, 78, .92); --dc-text-depth: 0 1px 2px rgba(0, 10, 40, .35); --dc-text-depth-strong: 0 2px 6px rgba(0, 10, 40, .45), 0 1px 1px rgba(0, 10, 40, .30); --dc-wave-haze-1: rgba(160, 235, 255, .20); --dc-wave-haze-2: rgba(190, 200, 255, .16); --dc-wave-back-top: rgba(255, 255, 255, .22); --dc-wave-back-bottom: rgba(255, 255, 255, 0); --dc-wave-back-line: rgba(255, 255, 255, .34); --dc-wave-back-glow: rgba(210, 220, 255, .34); --dc-wave-mid-a: rgba(140, 180, 255, .12); --dc-wave-mid-b: rgba(150, 235, 255, .18); --dc-wave-mid-top: rgba(170, 235, 255, .30); --dc-wave-mid-bottom: rgba(120, 170, 255, .08); --dc-wave-mid-line: rgba(255, 255, 255, .56); --dc-wave-mid-echo: rgba(255, 255, 255, .18); --dc-wave-mid-glow: rgba(170, 240, 255, .40); --dc-wave-front-a: rgba(64, 114, 238, .76); --dc-wave-front-b: rgba(52, 150, 232, .72); --dc-wave-front-lift: rgba(255, 255, 255, .12); --dc-wave-front-deep: rgba(12, 28, 92, .66); --dc-wave-front-inner: rgba(255, 255, 255, .36); --dc-wave-edge: rgba(255, 255, 255, .66); --dc-wave-signal-core: #FFFFFF; --dc-wave-signal-glow: #9BEFFF; --dc-wave-signal-bloom: .60; --dc-wave-text: #FFFFFF; --dc-wave-text-shadow: 0 1px 3px rgba(0, 10, 40, .60); /* Das Verlaufs-„Wallpaper" hinter allem — wortgleich RemoteCircles „.rc-glass body". Mit Struktur, damit der Weichzeichner der Scheiben etwas zeigt. */ --dc-glass-wall: radial-gradient(1250px 840px at 12% 2%, rgba(64, 128, 205, .55), transparent 58%), radial-gradient(1050px 900px at 90% 12%, rgba(22, 162, 182, .38), transparent 55%), radial-gradient(1180px 800px at 50% 114%, rgba(128, 86, 212, .42), transparent 60%), linear-gradient(158deg, #091a2c 0%, #123244 52%, #0d2740 100%); }