/* generated from src/styles/phase70-tokens.css */
:root {
  color-scheme: dark;
  --font-ui:
    "HarmonyOS Sans SC",
    "MiSans",
    "PingFang SC",
    "Microsoft YaHei UI",
    "Noto Sans SC",
    "Noto Sans CJK SC",
    "Noto Sans",
    "Segoe UI",
    "SF Pro Text",
    "Helvetica Neue",
    sans-serif;
  --font-numeric:
    "JetBrains Mono",
    "SF Mono",
    "Roboto Mono",
    "DIN Alternate",
    monospace;
  --kf-bg: #070a0d;
  --kf-surface-0: #0b0f13;
  --kf-surface-1: #11161c;
  --kf-surface-2: #171e25;
  --kf-surface-3: #202832;
  --kf-border-soft: #252d36;
  --kf-border: #303a45;
  --kf-border-strong: #42505e;
  --kf-text-strong: #eef3f8;
  --kf-text: #d9e0e8;
  --kf-text-muted: #9aa6b2;
  --kf-text-faint: #65717d;
  --kf-action: #2f8cff;
  --kf-action-hover: #5aa6ff;
  --kf-success: #34c896;
  --kf-warning: #d7a84a;
  --kf-danger: #e36b6b;
  --phase70-font-family: var(--font-ui);
  --phase70-font-mono: var(--font-numeric);
  --phase70-font-size-page-title: 20px;
  --phase70-line-height-page-title: 28px;
  --phase70-font-size-section-title: 15px;
  --phase70-line-height-section-title: 22px;
  --phase70-font-size-card-title: 13px;
  --phase70-line-height-card-title: 20px;
  --phase70-font-size-body: 13px;
  --phase70-line-height-body: 20px;
  --phase70-font-size-meta: 12px;
  --phase70-line-height-meta: 18px;
  --phase70-font-size-micro: 11px;
  --phase70-line-height-micro: 16px;
  --phase70-font-size-metric: 18px;
  --phase70-line-height-metric: 22px;
  --phase70-font-size-kpi: 22px;
  --phase70-line-height-kpi: 24px;
  --phase70-font-weight-regular: 500;
  --phase70-font-weight-strong: 700;
  --phase70-space-1: 4px;
  --phase70-space-2: 8px;
  --phase70-space-3: 12px;
  --phase70-space-4: 16px;
  --phase70-space-5: 20px;
  --phase70-space-6: 24px;
  --phase70-space-7: 32px;
  --phase70-bg-canvas: var(--kf-bg);
  --phase70-bg-page: var(--kf-bg);
  --phase70-bg-surface: var(--kf-surface-0);
  --phase70-bg-surface-2: var(--kf-surface-1);
  --phase70-bg-surface-3: var(--kf-surface-2);
  --phase70-bg-elevated: var(--kf-surface-1);
  --phase70-border-subtle: var(--kf-border-soft);
  --phase70-border-default: var(--kf-border);
  --phase70-border-strong: var(--kf-border-strong);
  --phase70-divider: var(--kf-border-soft);
  --phase70-text-primary: var(--kf-text-strong);
  --phase70-text-body: var(--kf-text);
  --phase70-text-secondary: var(--kf-text-muted);
  --phase70-text-muted: var(--kf-text-faint);
  --phase70-text-disabled: #424a55;
  --phase70-accent: var(--kf-action);
  --phase70-accent-strong: var(--kf-action-hover);
  --phase70-accent-ink: #061110;
  --phase70-accent-ink-muted: rgba(6, 17, 16, 0.72);
  --phase70-accent-muted: rgba(110, 231, 216, 0.12);
  --phase70-accent-border: rgba(110, 231, 216, 0.42);
  --phase70-success: var(--kf-success);
  --phase70-success-bg: rgba(53, 212, 154, 0.12);
  --phase70-warning: var(--kf-warning);
  --phase70-warning-bg: rgba(245, 184, 75, 0.12);
  --phase70-danger: var(--kf-danger);
  --phase70-danger-bg: rgba(255, 107, 107, 0.12);
  --phase70-info: #75b8ff;
  --phase70-info-bg: rgba(117, 184, 255, 0.12);
  --phase70-overlay-backdrop: rgba(0, 0, 0, 0.62);
  --phase70-surface-veil: rgba(7, 8, 9, 0.96);
  --phase70-modal-padding: var(--phase70-space-5);
  --phase70-modal-gap: var(--phase70-space-4);
  --phase70-modal-header-gap: var(--phase70-space-3);
  --phase70-modal-body-gap: var(--phase70-space-4);
  --phase70-shadow-float: 0 10px 28px rgba(0, 0, 0, 0.34);
  --phase70-shadow-overlay: 0 22px 56px rgba(0, 0, 0, 0.48);
  --phase70-shadow-selection: 0 0 0 1px var(--phase70-accent-muted);
  --phase70-radius-xs: 4px;
  --phase70-radius-sm: 6px;
  --phase70-radius-md: 8px;
  --phase70-radius-lg: 10px;
  --phase70-radius-pill: 999px;
  --phase70-shadow-none: none;
  --phase70-shadow-hairline: 0 0 0 1px rgba(255, 255, 255, 0.04);
  --phase70-danger-border: rgba(255, 107, 107, 0.26);
  --phase70-success-border: rgba(53, 212, 154, 0.28);

  --phase70-kind-document-fg: #9fd4ff;
  --phase70-kind-document-bg: rgba(117, 184, 255, 0.12);
  --phase70-kind-image-fg: #f0bc72;
  --phase70-kind-image-bg: rgba(245, 184, 75, 0.12);
  --phase70-kind-video-fg: #c4a3ff;
  --phase70-kind-video-bg: rgba(160, 120, 255, 0.14);
  --phase70-kind-audio-fg: #63d9b0;
  --phase70-kind-audio-bg: rgba(53, 212, 154, 0.14);

  --phase55-bg: var(--phase70-bg-page);
  --phase55-surface: rgba(13, 15, 18, 0.96);
  --phase55-surface-solid: var(--phase70-bg-surface);
  --phase55-elevated: rgba(16, 19, 24, 0.98);
  --phase55-subtle: var(--phase70-bg-surface-2);
  --phase55-emphasis: var(--phase70-bg-surface-3);
  --phase55-border: var(--phase70-border-subtle);
  --phase55-border-strong: var(--phase70-border-strong);
  --phase55-divider: var(--phase70-divider);
  --phase55-text: var(--phase70-text-primary);
  --phase55-body: var(--phase70-text-body);
  --phase55-muted: var(--phase70-text-secondary);
  --phase55-weak: var(--phase70-text-muted);
  --phase55-brand: var(--phase70-accent);
  --phase55-brand-strong: var(--phase70-accent-strong);
  --phase55-brand-soft: var(--phase70-accent-muted);
  --phase55-accent-border: var(--phase70-accent-border);
  --phase55-danger: var(--phase70-danger);
  --phase55-danger-bg: var(--phase70-danger-bg);
  --phase55-danger-border-subtle: rgba(255, 107, 107, 0.24);
  --phase55-overlay-shadow: var(--phase70-shadow-overlay);
  --phase55-float-shadow: var(--phase70-shadow-float);
  --phase55-overlay-inset-shadow: inset 0 0 0 1px var(--phase55-border), var(--phase55-overlay-shadow);
  --phase55-ghost-inset-shadow: inset 0 0 0 1px var(--phase55-ghost-border);
  --phase55-float-surface: rgba(18, 21, 26, 0.96);
  --phase55-overlay-surface: rgba(16, 19, 24, 0.98);
  --phase55-ghost-surface: rgba(255, 255, 255, 0.04);
  --phase55-ghost-surface-strong: rgba(255, 255, 255, 0.08);
  --phase55-ghost-border: rgba(255, 255, 255, 0.08);
  --phase55-ghost-border-strong: rgba(255, 255, 255, 0.12);
  --phase55-ghost-border-active: rgba(255, 255, 255, 0.18);
  --phase55-ghost-surface-active: rgba(255, 255, 255, 0.1);
  --phase55-ghost-surface-soft: rgba(255, 255, 255, 0.055);
  --phase55-ghost-surface-soft-2: rgba(255, 255, 255, 0.045);
  --phase55-ghost-surface-dim: rgba(255, 255, 255, 0.06);
  --phase55-ghost-surface-chip: rgba(255, 255, 255, 0.07);
  --phase55-text-strong: rgba(248, 250, 252, 0.94);
  --phase55-text-bright: rgba(255, 255, 255, 0.92);
  --phase55-text-soft: rgba(255, 255, 255, 0.88);
  --phase55-text-dim: rgba(255, 255, 255, 0.8);
  --phase55-text-faint: rgba(255, 255, 255, 0.78);
  --phase55-text-fainter: rgba(255, 255, 255, 0.7);
  --phase55-text-subtle: rgba(255, 255, 255, 0.62);
  --phase55-text-weaker: rgba(255, 255, 255, 0.48);
  --phase55-text-weakest: rgba(255, 255, 255, 0.46);
  --phase55-text-anchor: rgba(255, 255, 255, 0.34);
  --phase55-text-icon-muted: rgba(100, 116, 139, 0.28);
  --phase55-provider-image-active: rgba(96, 165, 250, 0.18);
  --phase55-provider-audio-active: rgba(247, 178, 103, 0.18);
  --phase55-provider-video-active: rgba(94, 225, 161, 0.16);
  --phase55-shell-veil: var(--phase70-surface-veil);
  --phase55-edge-default: rgba(141, 150, 165, 0.46);
  --phase55-edge-active: rgba(110, 231, 216, 0.64);
  --phase55-selection-fill: rgba(110, 231, 216, 0.08);
  --phase55-selection-stroke: rgba(110, 231, 216, 0.28);
  --phase55-minimap-mask: rgba(95, 104, 118, 0.18);
  --phase55-minimap-stroke: rgba(110, 231, 216, 0.24);
  --phase55-minimap-node: #303744;
  --phase55-group-radius: var(--phase70-radius-md);
  --phase55-pill-radius: var(--phase70-radius-pill);
  --phase55-selection-ring-size: 1px;
  --phase55-media-frame-ring-size: 2px;
  --phase55-handle-ring-size: 4px;
  --phase55-handle-ring-size-hover: 7px;
  --phase55-card-expanded-ring: 0 0 0 1px var(--phase55-brand-soft);
  --phase55-handle-color: rgba(110, 231, 216, 0.92);
  --phase55-handle-border: rgba(110, 231, 216, 0.32);
  --phase55-handle-ring: rgba(110, 231, 216, 0.14);
  --phase55-group-surface: rgba(255, 255, 255, 0.01);
  --phase55-group-selected-surface: rgba(110, 231, 216, 0.04);
  --phase55-group-color-red: #ff5c5c;
  --phase55-group-color-orange: #ff9c38;
  --phase55-group-color-yellow: #ffdb5c;
  --phase55-group-color-green: #5ed68e;
  --phase55-group-color-cyan: #48d3dc;
  --phase55-group-color-blue: #5a9cff;
  --phase55-group-color-purple: #aa7eff;
}

body {
  font-family: var(--phase70-font-family);
  color: var(--phase70-text-primary);
  background: var(--phase70-bg-page);
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  border-radius: var(--phase70-radius-sm);
  background: var(--phase70-bg-surface-2);
  color: var(--phase70-text-primary);
  border: 1px solid var(--phase70-border-default);
}

button:hover {
  background: var(--phase70-bg-surface-3);
  border-color: var(--phase70-border-strong);
}

input,
textarea,
select {
  border: 1px solid var(--phase70-border-default);
  border-radius: var(--phase70-radius-sm);
  background: var(--phase70-bg-surface);
  color: var(--phase70-text-primary);
}

label {
  color: var(--phase70-text-secondary);
}