/*
 * Sacred Geometry Systems Theme
 *
 * Release CSS for Obsidian Community Themes. Source modules remain in styles/
 * for maintainability; this root file is self-contained for marketplace use.
 */





:root {
  
  --sg-obsidian: #03080d;
  --sg-obsidian-soft: #07121a;
  --sg-obsidian-panel: #0b151d;
  --sg-ivory: #f5ead6;
  --sg-ivory-muted: #cdbf9f;
  --sg-gold: #d8a84f;
  --sg-gold-bright: #f2cf82;
  --sg-copper: #b87345;
  --sg-copper-bright: #d28a50;
  --sg-deep-indigo: #12122d;
  --sg-deep-indigo-light: #1b1d42;
  --sg-signal-cyan: #16c7e8;
  --sg-signal-cyan-soft: #66e7ff;
  --sg-orbit-violet: #8f67ff;

  
  --sg-bg: var(--sg-obsidian);
  --sg-bg-soft: var(--sg-obsidian-soft);
  --sg-bg-panel: var(--sg-obsidian-panel);

  
  --sg-glow: var(--sg-gold-bright);
  --sg-pulse: var(--sg-signal-cyan);
  --sg-orbit: var(--sg-orbit-violet);
  --sg-flow: var(--sg-signal-cyan);
  --sg-boundary: var(--sg-copper);
  --sg-card: var(--sg-obsidian-panel);
  --sg-card-muted: color-mix(in srgb, var(--sg-obsidian-panel) 88%, var(--sg-deep-indigo) 12%);
  --sg-card-raised: color-mix(in srgb, var(--sg-obsidian-panel) 96%, var(--sg-ivory) 4%);
  --sg-border: color-mix(in srgb, var(--sg-gold) 42%, transparent);
  --sg-border-cyan: color-mix(in srgb, var(--sg-signal-cyan) 48%, transparent);
  --sg-text: var(--sg-ivory);
  --sg-text-muted: var(--sg-ivory-muted);
  --sg-text-faint: color-mix(in srgb, var(--sg-ivory-muted) 70%, transparent);
  --sg-shadow: rgba(0, 0, 0, 0.42);
  --sg-shadow-strong: rgba(0, 0, 0, 0.68);
  --sg-glow-soft: color-mix(in srgb, var(--sg-gold) 32%, transparent);
  --sg-cyan-glow-soft: color-mix(in srgb, var(--sg-signal-cyan) 28%, transparent);
  --sg-code-bg: color-mix(in srgb, var(--sg-deep-indigo) 72%, var(--sg-bg));
  --sg-code-text: var(--sg-signal-cyan-soft);
  --sg-code-border: var(--sg-border-cyan);
  --sg-selection-bg: color-mix(in srgb, var(--sg-signal-cyan) 34%, transparent);
  --sg-selection-text: var(--sg-ivory);

  
  --sg-ink: var(--sg-text);
  --sg-ink-light: var(--sg-text-muted);
  --sg-ink-lighter: var(--sg-border);
  --sg-teal: var(--sg-signal-cyan);
  --sg-teal-light: var(--sg-signal-cyan-soft);
  --sg-rose: var(--sg-copper);
  --sg-rose-light: var(--sg-copper-bright);
  --sg-parchment: var(--sg-card);
  --sg-parchment-light: var(--sg-card-raised);
  --sg-parchment-dark: var(--sg-obsidian-soft);
  --sg-center-color: var(--sg-gold-bright);

  
  --sg-role-mission: var(--sg-gold-bright);
  --sg-role-core-system: var(--sg-gold);
  --sg-role-agent: var(--sg-signal-cyan);
  --sg-role-resource: color-mix(in srgb, var(--sg-ivory) 42%, var(--sg-gold));
  --sg-role-interaction: var(--sg-signal-cyan-soft);
  --sg-role-knowledge: var(--sg-orbit-violet);
  --sg-role-decision: var(--sg-copper);
  --sg-role-outcome: color-mix(in srgb, var(--sg-gold) 62%, var(--sg-signal-cyan));

  
  --sg-golden-ratio: 1.618;
  --sg-radius-small: 4px;
  --sg-radius-medium: 8px;
  --sg-radius-large: 8px;
  --sg-card-radius: 8px;
  --sg-line-thin: 1px;
  --sg-line-medium: 1.5px;
  --sg-ring-size: 64px;
  --sg-grid-size: 60px;

  
  --sg-font-size-base: 16px;
  --sg-font-size-small: 0.875rem;
  --sg-font-size-large: 1.618rem;

  
  --canvas-color-node: var(--sg-card);
  --canvas-color-node-border: var(--sg-border);
  --canvas-color-node-focused: var(--sg-role-mission);
  --canvas-color-node-hover: var(--sg-role-agent);
  --canvas-color-line: var(--sg-flow);
  --canvas-color-line-highlight: var(--sg-role-outcome);
  --canvas-node-radius: var(--sg-card-radius);
  --canvas-node-padding: 0.75rem;

}

body.theme-light {
  
  --sg-gold: #93631d;
  --sg-gold-bright: #6c4612;
  --sg-copper: #955f3f;
  --sg-copper-bright: #713f29;
  --sg-deep-indigo: #e6e0f2;
  --sg-deep-indigo-light: #d7cee9;
  --sg-signal-cyan: #00778c;
  --sg-signal-cyan-soft: #005f72;
  --sg-orbit-violet: #62509b;

  --sg-bg: #f6eedf;
  --sg-bg-soft: #ede0c9;
  --sg-bg-panel: #fffaf0;

  --sg-glow: var(--sg-gold-bright);
  --sg-pulse: var(--sg-signal-cyan);
  --sg-orbit: var(--sg-orbit-violet);
  --sg-flow: var(--sg-signal-cyan);
  --sg-boundary: var(--sg-copper);
  --sg-card: var(--sg-bg-panel);
  --sg-card-muted: #f1e5cf;
  --sg-card-raised: #fffdf7;
  --sg-border: color-mix(in srgb, var(--sg-gold) 34%, transparent);
  --sg-border-cyan: color-mix(in srgb, var(--sg-signal-cyan) 34%, transparent);
  --sg-text: #211b15;
  --sg-text-muted: #5d5243;
  --sg-text-faint: #877b68;
  --sg-shadow: rgba(70, 50, 22, 0.16);
  --sg-shadow-strong: rgba(70, 50, 22, 0.26);
  --sg-glow-soft: color-mix(in srgb, var(--sg-gold) 18%, transparent);
  --sg-cyan-glow-soft: color-mix(in srgb, var(--sg-signal-cyan) 16%, transparent);
  --sg-code-bg: color-mix(in srgb, var(--sg-bg-panel) 82%, var(--sg-deep-indigo));
  --sg-code-text: var(--sg-signal-cyan-soft);
  --sg-code-border: var(--sg-border-cyan);
  --sg-selection-bg: color-mix(in srgb, var(--sg-signal-cyan) 24%, var(--sg-bg-panel));
  --sg-selection-text: var(--sg-text);

  --sg-ink: var(--sg-text);
  --sg-ink-light: var(--sg-text-muted);
  --sg-ink-lighter: var(--sg-border);
  --sg-teal: var(--sg-signal-cyan);
  --sg-teal-light: var(--sg-signal-cyan-soft);
  --sg-rose: var(--sg-copper);
  --sg-rose-light: var(--sg-copper-bright);
  --sg-parchment: var(--sg-card);
  --sg-parchment-light: var(--sg-card-raised);
  --sg-parchment-dark: var(--sg-bg-soft);
  --sg-center-color: var(--sg-gold-bright);

  color-scheme: light;
}





.markdown-preview-view h1,
.markdown-rendered h1,
.cm-header-1 {
  color: var(--sg-gold-bright);
  font-size: 2rem;
  line-height: 1.16;
  font-weight: 520;
  letter-spacing: 0;
  margin-top: 1.35em;
  margin-bottom: 0.5em;
}

.markdown-preview-view h2,
.markdown-rendered h2,
.cm-header-2 {
  color: var(--sg-gold);
  font-size: 1.45rem;
  line-height: 1.24;
  font-weight: 560;
  letter-spacing: 0;
  margin-top: 1.25em;
  margin-bottom: 0.45em;
}

.markdown-preview-view h3,
.markdown-rendered h3,
.cm-header-3 {
  color: var(--sg-signal-cyan-soft);
  font-size: 1.18rem;
  line-height: 1.3;
  font-weight: 560;
  letter-spacing: 0;
  margin-top: 1.1em;
  margin-bottom: 0.3em;
}

.markdown-preview-view h4,
.markdown-preview-view h5,
.markdown-preview-view h6,
.markdown-rendered h4,
.markdown-rendered h5,
.markdown-rendered h6,
.cm-header-4,
.cm-header-5,
.cm-header-6 {
  color: var(--sg-text);
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: 0;
  margin-top: 1em;
  margin-bottom: 0.25em;
}

.markdown-preview-view p,
.markdown-rendered p,
.cm-line {
  color: var(--sg-text);
  font-size: var(--sg-font-size-base);
  line-height: 1.6;
}

.markdown-preview-view ul,
.markdown-preview-view ol,
.markdown-rendered ul,
.markdown-rendered ol {
  color: var(--sg-text);
}

.markdown-preview-view li::marker,
.markdown-rendered li::marker {
  color: var(--sg-gold);
}

blockquote,
.markdown-preview-view blockquote,
.markdown-rendered blockquote {
  color: var(--sg-text-muted);
  background-color: color-mix(in srgb, var(--sg-card-muted) 76%, transparent);
  border-left: 3px solid var(--sg-signal-cyan);
  border-radius: 0 var(--sg-radius-medium) var(--sg-radius-medium) 0;
  margin: 1rem 0;
  padding: 0.7rem 1rem;
}

hr {
  border: 0;
  border-top: 1px solid var(--sg-border);
}

mark {
  background-color: color-mix(in srgb, var(--sg-gold) 34%, transparent);
  color: var(--sg-selection-text);
  border-radius: var(--sg-radius-small);
  padding: 0 0.2em;
}

table {
  border-color: var(--sg-border);
}

th {
  color: var(--sg-gold-bright);
  background-color: var(--sg-card-muted);
}

td,
th {
  border-color: var(--sg-border);
}





.canvas-wrapper,
.canvas,
.canvas-viewport {
  background-color: var(--sg-bg);
}

.canvas-wrapper {
  background-image:
    linear-gradient(color-mix(in srgb, var(--sg-gold) 7%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--sg-signal-cyan) 5%, transparent) 1px, transparent 1px);
  background-size: 32px 32px;
}

.canvas-controls,
.canvas-card-menu,
.canvas-menu {
  background-color: color-mix(in srgb, var(--sg-card) 88%, var(--sg-bg-soft));
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-radius-medium);
  box-shadow: 0 10px 28px var(--sg-shadow);
}

.canvas-node {
  border-radius: var(--canvas-node-radius);
  background-color: var(--canvas-color-node);
  border: 1px solid var(--canvas-color-node-border);
  box-shadow: 0 12px 30px var(--sg-shadow);
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.canvas-node-container,
.canvas-node-content,
.canvas-node-label {
  border-radius: var(--canvas-node-radius);
}

.canvas-node-content {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--sg-gold) 8%, transparent), transparent 36%),
    var(--sg-card);
  color: var(--sg-text);
}

.canvas-node:hover {
  border-color: var(--canvas-color-node-hover);
  box-shadow:
    0 0 0 1px var(--sg-border-cyan),
    0 14px 34px var(--sg-shadow-strong);
}

.canvas-node.is-focused {
  border-color: var(--canvas-color-node-focused);
  box-shadow:
    0 0 0 1px var(--sg-gold-bright),
    0 0 22px var(--sg-glow-soft),
    0 16px 38px var(--sg-shadow-strong);
}

.canvas-node .canvas-text,
.canvas-node-content,
.canvas-node-label {
  color: var(--sg-text);
  font-size: 0.95rem;
  line-height: 1.45;
}

.canvas-node .canvas-node-label {
  color: var(--sg-gold-bright);
  font-weight: 650;
}

.canvas-edges path,
.canvas-path,
.canvas-edge {
  stroke: var(--canvas-color-line);
  stroke-width: 2px;
  filter: drop-shadow(0 0 6px var(--sg-cyan-glow-soft));
}

.canvas-edges path.is-active,
.canvas-path.is-active,
.canvas-edge.is-active {
  stroke: var(--canvas-color-line-highlight);
  filter: drop-shadow(0 0 8px var(--sg-glow-soft));
}

.canvas-edge.risk,
.canvas-path.risk {
  stroke: var(--sg-boundary);
}

.canvas-edge-label {
  color: var(--sg-text-muted);
  background-color: var(--sg-bg-soft);
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-radius-small);
}

.canvas-edge-handle,
.canvas-node-connection-point {
  background-color: var(--sg-signal-cyan);
  box-shadow: 0 0 10px var(--sg-cyan-glow-soft);
}

.canvas-edge-marker {
  fill: var(--sg-signal-cyan);
}

.canvas-node.node-mission,
.canvas-node.node-core-system,
.canvas-node.node-agent,
.canvas-node.node-resource,
.canvas-node.node-interaction,
.canvas-node.node-knowledge,
.canvas-node.node-decision,
.canvas-node.node-outcome {
  border-width: 1.5px;
}

.canvas-node.node-mission {
  border-color: var(--sg-role-mission);
  box-shadow: 0 0 20px var(--sg-glow-soft), 0 16px 38px var(--sg-shadow);
}

.canvas-node.node-core-system {
  border-color: var(--sg-role-core-system);
  background-color: color-mix(in srgb, var(--sg-role-core-system) 8%, var(--sg-card));
}

.canvas-node.node-agent,
.canvas-node.node-interaction {
  border-color: var(--sg-role-agent);
  box-shadow: 0 0 18px var(--sg-cyan-glow-soft), 0 14px 34px var(--sg-shadow);
}

.canvas-node.node-resource {
  border-color: var(--sg-role-resource);
}

.canvas-node.node-knowledge {
  border-color: var(--sg-role-knowledge);
}

.canvas-node.node-decision {
  border-color: var(--sg-role-decision);
}

.canvas-node.node-outcome {
  border-color: var(--sg-role-outcome);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--sg-role-outcome) 12%, transparent), transparent 44%),
    var(--sg-card);
}

@media (prefers-reduced-motion: no-preference) {
  .canvas-node.is-focused {
    animation: sg-focus-pulse 4s ease-in-out infinite;
  }
}

@media (prefers-reduced-motion: reduce) {
  .canvas-node,
  .canvas-node:hover,
  .canvas-node.is-focused {
    transition: none;
    animation: none;
  }
}

@keyframes sg-focus-pulse {
  0%,
  100% {
    box-shadow:
      0 0 0 1px var(--sg-gold-bright),
      0 0 16px var(--sg-glow-soft),
      0 16px 38px var(--sg-shadow-strong);
  }
  50% {
    box-shadow:
      0 0 0 1px var(--sg-gold-bright),
      0 0 28px var(--sg-glow-soft),
      0 16px 38px var(--sg-shadow-strong);
  }
}





.callout {
  color: var(--sg-text);
  background-color: color-mix(in srgb, var(--sg-card) 86%, var(--sg-card-muted));
  border: 1px solid var(--sg-border);
  border-left: 4px solid var(--sg-gold);
  border-radius: var(--sg-card-radius);
  box-shadow: 0 10px 26px var(--sg-shadow);
}

.callout-title {
  color: var(--sg-gold-bright);
  font-weight: 650;
}

.callout-content {
  color: var(--sg-text);
}

.callout-content > p:last-child {
  margin-bottom: 0;
}

.callout[data-callout="tip"],
.callout[data-callout="success"],
.callout[data-callout="flow"],
.callout[data-callout="agent"],
.callout[data-callout="interaction"] {
  border-left-color: var(--sg-role-agent);
}

.callout[data-callout="tip"] > .callout-title,
.callout[data-callout="success"] > .callout-title,
.callout[data-callout="flow"] > .callout-title,
.callout[data-callout="agent"] > .callout-title,
.callout[data-callout="interaction"] > .callout-title {
  color: var(--sg-signal-cyan-soft);
}

.callout[data-callout="info"],
.callout[data-callout="map"],
.callout[data-callout="mission"],
.callout[data-callout="system"] {
  border-left-color: var(--sg-role-mission);
}

.callout[data-callout="resource"] {
  border-left-color: var(--sg-role-resource);
}

.callout[data-callout="warning"],
.callout[data-callout="decision"] {
  border-left-color: var(--sg-role-decision);
  background-color: color-mix(in srgb, var(--sg-role-decision) 10%, var(--sg-card));
}

.callout[data-callout="warning"] > .callout-title,
.callout[data-callout="decision"] > .callout-title {
  color: var(--sg-copper-bright);
}

.callout[data-callout="danger"],
.callout[data-callout="failure"] {
  border-left-color: var(--sg-copper-bright);
  background-color: color-mix(in srgb, var(--sg-copper) 16%, var(--sg-card));
}

.callout[data-callout="quote"],
.callout[data-callout="knowledge"] {
  border-left-color: var(--sg-role-knowledge);
}

.callout[data-callout="quote"] > .callout-title,
.callout[data-callout="knowledge"] > .callout-title {
  color: color-mix(in srgb, var(--sg-orbit-violet) 74%, var(--sg-text));
}





.graph-view.color-fill,
.graph-view {
  background-color: var(--sg-bg);
}

.graph-view .graph-node {
  fill: var(--graph-node-fill);
  stroke: var(--graph-node-border-color);
  stroke-width: var(--graph-node-stroke-width);
  filter: drop-shadow(0 0 5px var(--sg-glow-soft));
}

.graph-view .graph-node:hover,
.graph-view .graph-node.current,
.graph-view .graph-node.focused {
  fill: var(--graph-node-fill-hover);
  stroke: var(--sg-gold-bright);
}

.graph-view .graph-node.tag {
  fill: var(--graph-node-fill-tag);
  stroke: var(--sg-orbit-violet);
}

.graph-view .graph-line {
  stroke: var(--graph-line-color);
  stroke-width: var(--graph-edge-width);
  opacity: 0.62;
}

.graph-view .graph-line:hover,
.graph-view .graph-line.active {
  stroke: var(--sg-gold);
  opacity: 1;
  filter: drop-shadow(0 0 6px var(--sg-glow-soft));
}

.graph-controls,
.graph-view .setting-item {
  background-color: var(--sg-card);
  border-color: var(--sg-border);
  color: var(--sg-text);
}





.sg-panel {
  background-color: var(--sg-card);
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-card-radius);
  box-shadow: 0 12px 30px var(--sg-shadow);
  color: var(--sg-text);
}

.sg-geometry-frame {
  position: relative;
  border: 1px solid var(--sg-border);
  border-radius: var(--sg-card-radius);
  overflow: hidden;
}

.sg-geometry-frame::before {
  content: "";
  position: absolute;
  inset: 8px;
  pointer-events: none;
  border: 1px solid color-mix(in srgb, var(--sg-gold) 34%, transparent);
  border-radius: var(--sg-radius-medium);
}

.sg-flower-of-life {
  --sg-grid-size: 60px;
  background-image:
    radial-gradient(circle at 25% 25%, color-mix(in srgb, var(--sg-gold) 38%, transparent) 1px, transparent 2px),
    radial-gradient(circle at 75% 25%, color-mix(in srgb, var(--sg-gold) 38%, transparent) 1px, transparent 2px),
    radial-gradient(circle at 25% 75%, color-mix(in srgb, var(--sg-signal-cyan) 28%, transparent) 1px, transparent 2px),
    radial-gradient(circle at 75% 75%, color-mix(in srgb, var(--sg-signal-cyan) 28%, transparent) 1px, transparent 2px);
  background-size: var(--sg-grid-size) var(--sg-grid-size);
}

.sg-rings {
  background-image:
    repeating-radial-gradient(circle, color-mix(in srgb, var(--sg-gold) 28%, transparent) 0 1px, transparent 1px 18px);
}

.sg-spiral {
  background-image: conic-gradient(
    from -90deg,
    color-mix(in srgb, var(--sg-gold) 30%, transparent) 0deg 4deg,
    transparent 4deg 42deg,
    color-mix(in srgb, var(--sg-signal-cyan) 24%, transparent) 42deg 46deg,
    transparent 46deg 90deg,
    color-mix(in srgb, var(--sg-gold) 30%, transparent) 90deg 94deg,
    transparent 94deg 138deg,
    color-mix(in srgb, var(--sg-copper) 30%, transparent) 138deg 142deg,
    transparent 142deg 360deg
  );
}

.sg-circle {
  border-radius: 50%;
  border: 1px solid var(--sg-gold);
  background-color: color-mix(in srgb, var(--sg-gold) 12%, transparent);
  box-shadow: 0 0 14px var(--sg-glow-soft);
}

.sg-live-flow {
  border-color: var(--sg-signal-cyan);
  box-shadow: 0 0 18px var(--sg-cyan-glow-soft);
}

.sg-priority-glow {
  border-color: var(--sg-gold-bright);
  box-shadow: 0 0 20px var(--sg-glow-soft);
}

.sg-boundary {
  border-color: var(--sg-copper);
}

@media (prefers-reduced-motion: no-preference) {
  .sg-pulse {
    animation: sg-pulse 3.6s ease-in-out infinite;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sg-pulse {
    animation: none;
  }
}

@keyframes sg-pulse {
  0%,
  100% {
    box-shadow: 0 0 10px var(--sg-cyan-glow-soft);
  }
  50% {
    box-shadow: 0 0 22px var(--sg-cyan-glow-soft);
  }
}





body {
  color-scheme: dark;
  --background-primary: var(--sg-bg);
  --background-primary-alt: var(--sg-bg-soft);
  --background-secondary: var(--sg-bg-soft);
  --background-secondary-alt: var(--sg-bg-panel);
  --background-modifier-border: var(--sg-border);
  --background-modifier-hover: color-mix(in srgb, var(--sg-signal-cyan) 8%, transparent);
  --background-modifier-active-hover: color-mix(in srgb, var(--sg-gold) 12%, transparent);
  --background-modifier-form-field: var(--sg-card);
  --text-normal: var(--sg-text);
  --text-muted: var(--sg-text-muted);
  --text-faint: var(--sg-text-faint);
  --text-accent: var(--sg-signal-cyan);
  --text-accent-hover: var(--sg-gold-bright);
  --text-on-accent: var(--sg-bg);
  --interactive-normal: var(--sg-card);
  --interactive-hover: color-mix(in srgb, var(--sg-signal-cyan) 12%, var(--sg-card));
  --interactive-accent: var(--sg-signal-cyan);
  --interactive-accent-hover: var(--sg-gold);
  --titlebar-background: var(--sg-bg);
  --titlebar-background-focused: var(--sg-bg);
  --divider-color: var(--sg-border);
  --tab-outline-color: var(--sg-border);
  --radius-s: var(--sg-radius-small);
  --radius-m: var(--sg-radius-medium);
  --radius-l: var(--sg-radius-large);

  --font-interface-theme: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  --font-text-theme: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  --font-monospace-theme: "JetBrains Mono", "Fira Code", Menlo, Consolas, monospace;

  --graph-line-color: var(--sg-flow);
  --graph-node-fill: var(--sg-card-raised);
  --graph-node-fill-hover: var(--sg-role-mission);
  --graph-node-fill-selected: var(--sg-role-outcome);
  --graph-node-fill-tag: var(--sg-role-knowledge);
  --graph-node-stroke-width: 1.5px;
  --graph-node-border-color: var(--sg-border);
  --graph-edge-width: 1px;
  --graph-text: var(--sg-text-muted);

  background-color: var(--sg-bg);
  color: var(--sg-text);
  font-size: var(--sg-font-size-base);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.workspace,
.workspace-split.mod-root,
.workspace-leaf-content,
.markdown-source-view,
.markdown-preview-view {
  background-color: var(--sg-bg);
  color: var(--sg-text);
}

.workspace-leaf-content[data-type="markdown"] {
  background-image:
    linear-gradient(color-mix(in srgb, var(--sg-gold) 7%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--sg-signal-cyan) 5%, transparent) 1px, transparent 1px);
  background-size: 48px 48px;
}

.view-header,
.status-bar,
.side-dock-ribbon,
.workspace-tab-header-container {
  background-color: var(--sg-bg-soft);
  border-color: var(--sg-border);
}

a,
.markdown-preview-view a,
.cm-hmd-internal-link,
.cm-link {
  color: var(--sg-signal-cyan);
  text-decoration: none;
  transition: color 160ms ease, text-shadow 160ms ease;
}

a:hover,
.markdown-preview-view a:hover {
  color: var(--sg-gold-bright);
  text-shadow: 0 0 12px var(--sg-glow-soft);
}

strong,
b {
  color: var(--sg-gold-bright);
  font-weight: 650;
}

em,
i {
  color: var(--sg-text-muted);
}

code,
pre {
  font-family: var(--font-monospace);
  background-color: var(--sg-code-bg);
  color: var(--sg-code-text);
  border: 1px solid var(--sg-code-border);
  border-radius: var(--sg-radius-small);
}

code {
  padding: 0.08rem 0.28rem;
}

pre {
  padding: 0.9rem;
  overflow: auto;
  box-shadow: 0 10px 28px var(--sg-shadow);
}

button,
.clickable-icon,
.modal-button-container button {
  border-radius: var(--sg-radius-small);
}

::selection {
  background-color: var(--sg-selection-bg);
  color: var(--sg-selection-text);
}







body.sgs-reduce-glow {
  --sg-glow-soft: color-mix(in srgb, var(--sg-gold) 14%, transparent);
  --sg-cyan-glow-soft: color-mix(in srgb, var(--sg-signal-cyan) 12%, transparent);
  --sg-shadow: rgba(0, 0, 0, 0.32);
  --sg-shadow-strong: rgba(0, 0, 0, 0.48);
}

body.theme-light.sgs-reduce-glow {
  --sg-glow-soft: color-mix(in srgb, var(--sg-gold) 10%, transparent);
  --sg-cyan-glow-soft: color-mix(in srgb, var(--sg-signal-cyan) 9%, transparent);
  --sg-shadow: rgba(70, 50, 22, 0.10);
  --sg-shadow-strong: rgba(70, 50, 22, 0.16);
}

body.sgs-reduce-glow .canvas-node,
body.sgs-reduce-glow .callout,
body.sgs-reduce-glow pre {
  box-shadow: 0 8px 20px var(--sg-shadow);
}

body.sgs-disable-geometry-texture .workspace-leaf-content[data-type="markdown"],
body.sgs-disable-geometry-texture .canvas-wrapper {
  background-image: none;
}

body.sgs-strong-focus-boundaries .canvas-node.is-focused {
  box-shadow:
    0 0 0 2px var(--sg-role-mission),
    0 0 0 4px color-mix(in srgb, var(--sg-role-mission) 24%, transparent),
    0 16px 38px var(--sg-shadow-strong);
}

body.sgs-strong-focus-boundaries a:focus-visible,
body.sgs-strong-focus-boundaries button:focus-visible,
body.sgs-strong-focus-boundaries .clickable-icon:focus-visible,
body.sgs-strong-focus-boundaries input:focus-visible,
body.sgs-strong-focus-boundaries textarea:focus-visible {
  outline: 2px solid var(--sg-role-agent);
  outline-offset: 2px;
}

body.sgs-strong-focus-boundaries .canvas-edges path.is-active,
body.sgs-strong-focus-boundaries .canvas-path.is-active,
body.sgs-strong-focus-boundaries .canvas-edge.is-active {
  stroke-width: 3px;
}
