760 lines
18 KiB
CSS
760 lines
18 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
color-scheme: light;
|
|
background: oklch(94.5% 0.012 250);
|
|
--canvas-map: oklch(94.5% 0.012 250);
|
|
--canvas-map-grid: rgba(37, 99, 235, 0.06);
|
|
--acrylic-navigation: rgba(242, 248, 252, 0.74);
|
|
--acrylic-panel: rgba(232, 241, 249, 0.58);
|
|
--acrylic-control: rgba(249, 251, 255, 0.84);
|
|
--acrylic-panel-blur: 22px;
|
|
--acrylic-control-blur: 18px;
|
|
--acrylic-backdrop-saturation: 1.2;
|
|
--acrylic-exclusion: rgba(255, 255, 255, 0.05);
|
|
--acrylic-luminosity: rgba(255, 255, 255, 0.22);
|
|
--acrylic-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.06'/%3E%3C/svg%3E");
|
|
--acrylic-border: rgba(255, 255, 255, 0.58);
|
|
--acrylic-outline: rgba(71, 85, 105, 0.18);
|
|
--acrylic-highlight: rgba(255, 255, 255, 0.82);
|
|
--acrylic-shadow: 0 14px 36px rgba(15, 23, 42, 0.14);
|
|
--surface-dock: oklch(97% 0.006 250);
|
|
--surface-control: rgba(252, 253, 255, 0.96);
|
|
--surface-well: rgba(232, 240, 248, 0.2);
|
|
--surface-reading: rgba(255, 255, 255, 0.985);
|
|
--glass-transient: rgba(248, 252, 255, 0.88);
|
|
--surface-border: oklch(86.5% 0.012 250);
|
|
--surface-divider: oklch(90.5% 0.009 250);
|
|
--surface-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
|
|
--dock-shadow: 8px 0 24px rgba(15, 23, 42, 0.07);
|
|
--radius-icon: 8px;
|
|
--radius-control: 12px;
|
|
--radius-panel: 16px;
|
|
--radius-pill: 9999px;
|
|
--action-blue: #2563eb;
|
|
--action-blue-hover: #1d4ed8;
|
|
--action-blue-soft: #dbeafe;
|
|
--ink: #0f172a;
|
|
--ink-secondary: #334155;
|
|
--ink-muted: #64748b;
|
|
--border-soft: var(--surface-divider);
|
|
--border-strong: var(--surface-border);
|
|
--tone-info: oklch(95% 0.035 250);
|
|
--tone-normal: oklch(95% 0.04 175);
|
|
--tone-warning: oklch(95% 0.05 70);
|
|
--tone-danger: oklch(95% 0.045 25);
|
|
--tone-agent: oklch(95% 0.035 290);
|
|
--scrim-soft: rgba(15, 23, 42, 0.2);
|
|
--scrim-focus: rgba(15, 23, 42, 0.48);
|
|
--background: 210 40% 98%;
|
|
--foreground: 222 47% 11%;
|
|
--card: 0 0% 100%;
|
|
--card-foreground: 222 47% 11%;
|
|
--popover: 0 0% 100%;
|
|
--popover-foreground: 222 47% 11%;
|
|
--primary: 221 83% 53%;
|
|
--primary-foreground: 210 40% 98%;
|
|
--secondary: 214 32% 91%;
|
|
--secondary-foreground: 222 47% 11%;
|
|
--muted: 210 40% 96%;
|
|
--muted-foreground: 215 16% 47%;
|
|
--accent: 210 40% 96%;
|
|
--accent-foreground: 222 47% 11%;
|
|
--destructive: 0 84% 60%;
|
|
--destructive-foreground: 210 40% 98%;
|
|
--border: 214 32% 91%;
|
|
--input: 214 32% 91%;
|
|
--ring: 221 83% 53%;
|
|
--radius: 0.5rem;
|
|
}
|
|
|
|
[data-basemap-tone="light"] {
|
|
--acrylic-navigation: rgba(242, 248, 252, 0.68);
|
|
--acrylic-panel: rgba(232, 241, 249, 0.7);
|
|
--acrylic-control: rgba(249, 251, 255, 0.78);
|
|
--acrylic-panel-blur: 24px;
|
|
--acrylic-control-blur: 20px;
|
|
--acrylic-backdrop-saturation: 1.22;
|
|
--acrylic-exclusion: rgba(255, 255, 255, 0.04);
|
|
--acrylic-luminosity: rgba(255, 255, 255, 0.18);
|
|
--surface-control: rgba(252, 253, 255, 0.95);
|
|
--surface-well: rgba(232, 240, 248, 0.34);
|
|
--surface-reading: rgba(255, 255, 255, 0.97);
|
|
--glass-transient: rgba(238, 247, 253, 0.56);
|
|
}
|
|
|
|
[data-basemap-tone="satellite"] {
|
|
--acrylic-navigation: rgba(242, 248, 252, 0.82);
|
|
--acrylic-panel: rgba(232, 241, 249, 0.7);
|
|
--acrylic-control: rgba(250, 252, 255, 0.9);
|
|
--acrylic-panel-blur: 20px;
|
|
--acrylic-control-blur: 16px;
|
|
--acrylic-backdrop-saturation: 1.1;
|
|
--acrylic-exclusion: rgba(255, 255, 255, 0.06);
|
|
--acrylic-luminosity: rgba(255, 255, 255, 0.24);
|
|
--surface-control: rgba(252, 253, 255, 0.98);
|
|
--surface-well: rgba(232, 240, 248, 0.28);
|
|
--surface-reading: rgba(255, 255, 255, 0.99);
|
|
--glass-transient: rgba(238, 247, 253, 0.72);
|
|
--acrylic-outline: rgba(71, 85, 105, 0.24);
|
|
--acrylic-shadow: 0 14px 38px rgba(15, 23, 42, 0.2);
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
margin: 0;
|
|
}
|
|
|
|
body {
|
|
font-family:
|
|
-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
|
|
"PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
|
|
color: var(--ink);
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
button,
|
|
input {
|
|
font: inherit;
|
|
}
|
|
|
|
button:focus-visible,
|
|
input:focus-visible {
|
|
outline: 2px solid #0f172a;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.map-grid {
|
|
background:
|
|
linear-gradient(rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.08)),
|
|
linear-gradient(90deg, var(--canvas-map-grid) 1px, transparent 1px),
|
|
linear-gradient(var(--canvas-map-grid) 1px, transparent 1px),
|
|
var(--canvas-map);
|
|
background-size:
|
|
auto,
|
|
68px 68px,
|
|
68px 68px,
|
|
auto;
|
|
}
|
|
|
|
.acrylic-navigation,
|
|
.acrylic-panel,
|
|
.acrylic-control,
|
|
.surface-dock,
|
|
.surface-control,
|
|
.surface-well,
|
|
.surface-reading,
|
|
.glass-transient,
|
|
.material-tone-info,
|
|
.material-tone-normal,
|
|
.material-tone-warning,
|
|
.material-tone-danger,
|
|
.material-tone-agent {
|
|
border-color: var(--surface-border);
|
|
background-clip: padding-box;
|
|
}
|
|
|
|
.acrylic-navigation,
|
|
.acrylic-panel,
|
|
.acrylic-control,
|
|
.glass-transient {
|
|
border-color: var(--acrylic-border);
|
|
background-image:
|
|
linear-gradient(var(--acrylic-exclusion), var(--acrylic-exclusion)),
|
|
linear-gradient(var(--acrylic-luminosity), var(--acrylic-luminosity)),
|
|
var(--acrylic-noise);
|
|
background-blend-mode: exclusion, luminosity, soft-light;
|
|
box-shadow:
|
|
inset 0 1px 0 var(--acrylic-highlight),
|
|
0 0 0 1px var(--acrylic-outline),
|
|
var(--acrylic-shadow);
|
|
}
|
|
|
|
.acrylic-navigation {
|
|
background-color: var(--acrylic-navigation);
|
|
box-shadow:
|
|
inset 0 1px 0 var(--acrylic-highlight),
|
|
0 1px 0 var(--acrylic-outline),
|
|
0 8px 24px rgba(15, 23, 42, 0.08);
|
|
backdrop-filter: blur(var(--acrylic-panel-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
-webkit-backdrop-filter: blur(var(--acrylic-panel-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
}
|
|
|
|
.acrylic-panel {
|
|
background-color: var(--acrylic-panel);
|
|
backdrop-filter: blur(var(--acrylic-panel-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
-webkit-backdrop-filter: blur(var(--acrylic-panel-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
}
|
|
|
|
.acrylic-control {
|
|
background-color: var(--acrylic-control);
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255, 255, 255, 0.86),
|
|
0 0 0 1px rgba(59, 130, 246, 0.14),
|
|
0 14px 34px rgba(15, 23, 42, 0.13);
|
|
backdrop-filter: blur(var(--acrylic-control-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
-webkit-backdrop-filter: blur(var(--acrylic-control-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
}
|
|
|
|
.surface-dock { background-color: var(--surface-dock); }
|
|
.surface-control { background-color: var(--surface-control); }
|
|
.surface-well { background-color: var(--surface-well); }
|
|
.surface-reading { background-color: var(--surface-reading); }
|
|
|
|
.glass-transient {
|
|
background-color: var(--glass-transient);
|
|
box-shadow:
|
|
inset 0 1px 0 var(--acrylic-highlight),
|
|
0 0 0 1px var(--acrylic-outline),
|
|
0 10px 28px rgba(15, 23, 42, 0.14);
|
|
backdrop-filter: blur(var(--acrylic-control-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
-webkit-backdrop-filter: blur(var(--acrylic-control-blur)) saturate(var(--acrylic-backdrop-saturation));
|
|
}
|
|
|
|
.material-tone-info {
|
|
background-color: var(--tone-info);
|
|
box-shadow: inset 0 1px 0 rgba(147, 197, 253, 0.42);
|
|
}
|
|
|
|
.material-tone-normal {
|
|
background-color: var(--tone-normal);
|
|
box-shadow: inset 0 1px 0 rgba(94, 234, 212, 0.4);
|
|
}
|
|
|
|
.material-tone-warning {
|
|
background-color: var(--tone-warning);
|
|
box-shadow: inset 0 1px 0 rgba(253, 186, 116, 0.46);
|
|
}
|
|
|
|
.material-tone-danger {
|
|
background-color: var(--tone-danger);
|
|
box-shadow: inset 0 1px 0 rgba(252, 165, 165, 0.48);
|
|
}
|
|
|
|
.material-tone-agent {
|
|
background-color: var(--tone-agent);
|
|
box-shadow: inset 0 1px 0 rgba(196, 181, 253, 0.42);
|
|
}
|
|
|
|
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
|
|
.acrylic-navigation,
|
|
.acrylic-panel,
|
|
.acrylic-control,
|
|
.glass-transient {
|
|
background-color: rgba(250, 252, 255, 0.98);
|
|
background-image: none;
|
|
backdrop-filter: none;
|
|
-webkit-backdrop-filter: none;
|
|
}
|
|
}
|
|
|
|
@media (prefers-reduced-transparency: reduce) {
|
|
.acrylic-navigation,
|
|
.acrylic-panel,
|
|
.acrylic-control,
|
|
.glass-transient {
|
|
background-color: rgba(250, 252, 255, 0.98);
|
|
background-image: none;
|
|
backdrop-filter: none;
|
|
-webkit-backdrop-filter: none;
|
|
}
|
|
|
|
.surface-well,
|
|
.surface-control,
|
|
.surface-reading {
|
|
background-color: rgba(255, 255, 255, 0.98);
|
|
background-image: none;
|
|
}
|
|
|
|
.material-tone-info {
|
|
background-color: #eff6ff;
|
|
}
|
|
|
|
.material-tone-normal {
|
|
background-color: #f0fdfa;
|
|
}
|
|
|
|
.material-tone-warning {
|
|
background-color: #fff7ed;
|
|
}
|
|
|
|
.material-tone-danger {
|
|
background-color: #fef2f2;
|
|
}
|
|
|
|
.material-tone-agent {
|
|
background-color: #f5f3ff;
|
|
}
|
|
}
|
|
|
|
@media (forced-colors: active) {
|
|
.acrylic-navigation,
|
|
.acrylic-panel,
|
|
.acrylic-control,
|
|
.glass-transient,
|
|
.surface-dock,
|
|
.surface-control,
|
|
.surface-well,
|
|
.surface-reading,
|
|
.material-tone-info,
|
|
.material-tone-normal,
|
|
.material-tone-warning,
|
|
.material-tone-danger,
|
|
.material-tone-agent {
|
|
forced-color-adjust: none;
|
|
border-color: CanvasText;
|
|
background-color: Canvas;
|
|
background-image: none;
|
|
box-shadow: none;
|
|
color: CanvasText;
|
|
backdrop-filter: none;
|
|
-webkit-backdrop-filter: none;
|
|
}
|
|
}
|
|
|
|
.agent-panel-shell {
|
|
border-color: var(--acrylic-border);
|
|
}
|
|
|
|
.agent-panel-band {
|
|
background: var(--surface-control);
|
|
}
|
|
|
|
.agent-panel-conversation {
|
|
background: var(--surface-well);
|
|
}
|
|
|
|
.agent-panel-message {
|
|
border: 1px solid var(--surface-divider);
|
|
background: var(--surface-reading);
|
|
}
|
|
|
|
.agent-streaming-response {
|
|
display: block;
|
|
--sd-animation: agent-stream-token-in;
|
|
--sd-duration: 260ms;
|
|
--sd-easing: cubic-bezier(0.16, 1, 0.3, 1);
|
|
}
|
|
|
|
.agent-chart-line {
|
|
animation: agent-chart-line-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
transform-origin: center;
|
|
will-change: opacity, transform;
|
|
}
|
|
|
|
.agent-chart-point,
|
|
.agent-chart-bar {
|
|
animation: agent-chart-mark-in 180ms cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
transform-box: fill-box;
|
|
transform-origin: center bottom;
|
|
will-change: opacity, transform;
|
|
}
|
|
|
|
.agent-panel-nested {
|
|
border: 1px solid var(--surface-divider);
|
|
background: var(--surface-control);
|
|
}
|
|
|
|
.agent-panel-control {
|
|
border: 1px solid rgba(100, 116, 139, 0.16);
|
|
background: var(--surface-reading);
|
|
}
|
|
|
|
.agent-ready-orbit,
|
|
.agent-ready-core {
|
|
transform-box: fill-box;
|
|
transform-origin: center;
|
|
}
|
|
|
|
.agent-ready-orbit {
|
|
animation: agent-ready-orbit 9s linear infinite;
|
|
}
|
|
|
|
.agent-ready-core {
|
|
animation: agent-ready-core 2.8s ease-in-out infinite;
|
|
}
|
|
|
|
.agent-panel-icon-button {
|
|
border: 1px solid var(--surface-divider);
|
|
background: var(--surface-control);
|
|
box-shadow: none;
|
|
}
|
|
|
|
.agent-panel-icon-button:hover {
|
|
border-color: rgba(37, 99, 235, 0.26);
|
|
background: rgba(239, 246, 255, 0.94);
|
|
color: #1d4ed8;
|
|
}
|
|
|
|
.agent-panel-primary-icon,
|
|
.agent-panel-primary-action {
|
|
border: 1px solid rgba(37, 99, 235, 0.24);
|
|
background: #2563eb;
|
|
color: #ffffff;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.agent-panel-primary-icon:hover,
|
|
.agent-panel-primary-action:hover {
|
|
border-color: rgba(29, 78, 216, 0.34);
|
|
background: #1d4ed8;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.agent-panel-primary-icon:disabled,
|
|
.agent-panel-primary-action:disabled {
|
|
background: #93c5fd;
|
|
color: rgba(255, 255, 255, 0.86);
|
|
}
|
|
|
|
.scheduled-feed-scroll,
|
|
.scheduled-feed-detail-scroll,
|
|
.agent-conversation-scroll {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: rgba(100, 116, 139, 0.26) transparent;
|
|
scrollbar-gutter: stable;
|
|
overscroll-behavior: contain;
|
|
}
|
|
|
|
.scheduled-feed-scroll::-webkit-scrollbar,
|
|
.scheduled-feed-detail-scroll::-webkit-scrollbar,
|
|
.agent-conversation-scroll::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
|
|
.scheduled-feed-scroll::-webkit-scrollbar-track,
|
|
.scheduled-feed-detail-scroll::-webkit-scrollbar-track,
|
|
.agent-conversation-scroll::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
border-radius: 9999px;
|
|
}
|
|
|
|
.scheduled-feed-scroll::-webkit-scrollbar-thumb,
|
|
.scheduled-feed-detail-scroll::-webkit-scrollbar-thumb,
|
|
.agent-conversation-scroll::-webkit-scrollbar-thumb {
|
|
background: rgba(100, 116, 139, 0.24);
|
|
border-radius: 9999px;
|
|
}
|
|
|
|
.scheduled-feed-scroll:hover::-webkit-scrollbar-thumb,
|
|
.scheduled-feed-detail-scroll:hover::-webkit-scrollbar-thumb,
|
|
.agent-conversation-scroll:hover::-webkit-scrollbar-thumb {
|
|
background: rgba(100, 116, 139, 0.36);
|
|
}
|
|
|
|
.scheduled-feed-panel-shell {
|
|
transition:
|
|
width 180ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
max-height 180ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
opacity 150ms ease-out;
|
|
}
|
|
|
|
.scheduled-feed-detail-enter {
|
|
animation: scheduled-feed-detail-show 140ms ease-out 180ms both;
|
|
will-change: opacity;
|
|
}
|
|
|
|
.scheduled-feed-layout {
|
|
grid-template-columns: 0 minmax(0, 1fr);
|
|
column-gap: 0;
|
|
transition:
|
|
grid-template-columns 180ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
column-gap 180ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
will-change: grid-template-columns;
|
|
}
|
|
|
|
.scheduled-feed-layout-expanded {
|
|
grid-template-columns: minmax(0, 1fr) 432px;
|
|
column-gap: 0.75rem;
|
|
}
|
|
|
|
.scheduled-feed-layout-collapsed {
|
|
grid-template-columns: 0 minmax(0, 1fr);
|
|
column-gap: 0;
|
|
}
|
|
|
|
.scheduled-feed-shell-enter {
|
|
animation:
|
|
scheduled-feed-shell-show 170ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
agent-panel-fade 140ms ease-out;
|
|
transform-origin: top right;
|
|
}
|
|
|
|
.scheduled-feed-shell-exit {
|
|
animation:
|
|
scheduled-feed-shell-hide 170ms cubic-bezier(0.5, 0, 0.2, 1) forwards,
|
|
agent-panel-dim 140ms ease-in forwards;
|
|
pointer-events: none;
|
|
transform-origin: top right;
|
|
}
|
|
|
|
.agent-panel-confirmation {
|
|
border: 1px solid rgba(253, 186, 116, 0.46);
|
|
background: rgba(255, 247, 237, 0.82);
|
|
}
|
|
|
|
.agent-panel-enter {
|
|
animation:
|
|
agent-panel-reveal 170ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
agent-panel-fade 150ms ease-out;
|
|
transform-origin: left top;
|
|
will-change: opacity, transform;
|
|
}
|
|
|
|
.agent-panel-collapse {
|
|
animation:
|
|
agent-panel-dismiss 170ms cubic-bezier(0.5, 0, 0.2, 1) forwards,
|
|
agent-panel-dim 150ms ease-in forwards;
|
|
pointer-events: none;
|
|
transform-origin: left top;
|
|
will-change: opacity, transform;
|
|
}
|
|
|
|
.agent-rail-enter {
|
|
animation:
|
|
agent-rail-shell 170ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
agent-panel-fade 130ms ease-out;
|
|
transform-origin: left top;
|
|
will-change: opacity, transform;
|
|
}
|
|
|
|
.agent-rail-item {
|
|
animation: agent-rail-item 180ms cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
}
|
|
|
|
.agent-rail-item:nth-child(2) {
|
|
animation-delay: 24ms;
|
|
}
|
|
|
|
.agent-rail-item:nth-child(3) {
|
|
animation-delay: 42ms;
|
|
}
|
|
|
|
.agent-rail-item:nth-child(4) {
|
|
animation-delay: 58ms;
|
|
}
|
|
|
|
@keyframes agent-panel-reveal {
|
|
from {
|
|
transform: translateX(-8px) scale(0.985);
|
|
}
|
|
|
|
to {
|
|
transform: translateX(0) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-panel-fade {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes agent-panel-dim {
|
|
from {
|
|
opacity: 1;
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes agent-panel-dismiss {
|
|
from {
|
|
transform: translateX(0) scale(1);
|
|
}
|
|
|
|
to {
|
|
transform: translateX(-8px) scale(0.985);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-rail-shell {
|
|
from {
|
|
transform: translateX(-5px) scale(0.94);
|
|
}
|
|
|
|
to {
|
|
transform: translateX(0) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-rail-item {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(-3px) scale(0.92);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-stream-token-in {
|
|
from {
|
|
opacity: 0;
|
|
filter: blur(0.75px);
|
|
transform: translateY(2px);
|
|
}
|
|
|
|
60% {
|
|
opacity: 0.88;
|
|
filter: blur(0);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
filter: blur(0);
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-chart-line-in {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(3px);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-chart-mark-in {
|
|
from {
|
|
opacity: 0;
|
|
transform: translateY(4px) scaleY(0.75);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: translateY(0) scaleY(1);
|
|
}
|
|
}
|
|
|
|
@keyframes scheduled-feed-detail-show {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes scheduled-feed-shell-show {
|
|
from {
|
|
transform: translateX(10px) translateY(-4px) scale(0.985);
|
|
}
|
|
|
|
to {
|
|
transform: translateX(0) translateY(0) scale(1);
|
|
}
|
|
}
|
|
|
|
@keyframes scheduled-feed-shell-hide {
|
|
from {
|
|
transform: translateX(0) translateY(0) scale(1);
|
|
}
|
|
|
|
to {
|
|
transform: translateX(10px) translateY(-4px) scale(0.985);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-ready-orbit {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-ready-core {
|
|
0%,
|
|
100% {
|
|
opacity: 0.72;
|
|
transform: scale(0.94);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
transform: scale(1.04);
|
|
}
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.agent-panel-enter,
|
|
.agent-panel-collapse,
|
|
.agent-rail-enter,
|
|
.agent-rail-item,
|
|
.scheduled-feed-shell-enter,
|
|
.scheduled-feed-shell-exit,
|
|
.scheduled-feed-detail-enter {
|
|
animation: none;
|
|
clip-path: none;
|
|
transform: none;
|
|
}
|
|
|
|
.scheduled-feed-panel-shell {
|
|
transition: none;
|
|
}
|
|
|
|
.scheduled-feed-layout {
|
|
transition: none;
|
|
}
|
|
|
|
.agent-streaming-response [data-sd-animate] {
|
|
animation: none;
|
|
filter: none;
|
|
opacity: 1;
|
|
transform: none;
|
|
}
|
|
|
|
.agent-chart-line,
|
|
.agent-chart-point,
|
|
.agent-chart-bar {
|
|
animation: none;
|
|
opacity: 1;
|
|
transform: none;
|
|
}
|
|
|
|
.agent-ready-orbit,
|
|
.agent-ready-core {
|
|
animation: none;
|
|
opacity: 1;
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.maplibregl-ctrl-group {
|
|
border: 1px solid var(--surface-border) !important;
|
|
border-radius: var(--radius-control) !important;
|
|
box-shadow: var(--surface-shadow) !important;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.maplibregl-ctrl button {
|
|
width: 34px !important;
|
|
height: 34px !important;
|
|
}
|
|
|
|
.maplibregl-ctrl-attrib {
|
|
border-radius: 8px 0 0 0 !important;
|
|
color: #475569 !important;
|
|
}
|