/*
 * ANSONMAE OS Neumorphic Ember Skin v1.0
 * Inherited from Gr0ve OS operator-queue-sidecar/skin.css.
 * A class-gated adoption of the Old World Grove Master CSS aesthetic.
 * The inherited green channel is intentionally remapped to ANSONMAE ember.
 * The ANSONMAE semantic UI remains sovereign in ansonmae-os.css and index.html.
 */

body.skin-neumorphic {
  --grove-green: #ff8b3d;
  --grove-green-light: #ffb36a;
  --grove-green-dark: #d85c1f;
  --grove-green-deep: #9f3514;
  --grove-teal: #2dd4bf;
  --grove-teal-dark: #0d9488;
  --grove-blue: #4b8fe5;
  --grove-blue-dark: #2563eb;
  --grove-bg: #f5f0e8;
  --grove-bg-secondary: #ede8e0;
  --grove-bg-tertiary: #e5e0d8;
  --grove-bg-dark: #dcd6cc;
  --grove-ink: #1e293b;
  --grove-muted: #4b5563;
  --grove-glow-inner: rgba(255, 190, 120, 0.55);
  --grove-glow-mid: rgba(255, 139, 61, 0.35);
  --grove-glow-outer: rgba(255, 139, 61, 0.18);
  --grove-glow-depth: rgba(216, 92, 31, 0.25);
  --grove-shadow-light: rgba(255, 255, 255, 0.68);
  --grove-shadow-light-soft: rgba(255, 255, 255, 0.5);
  --grove-shadow-light-faint: rgba(255, 255, 255, 0.3);
  --grove-shadow-dark: rgba(180, 170, 155, 0.38);
  --grove-shadow-dark-soft: rgba(180, 170, 155, 0.25);
  --grove-shadow-dark-deep: rgba(160, 148, 130, 0.18);
  --grove-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --grove-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --grove-duration-fast: 0.25s;
  --grove-duration-normal: 0.4s;
  --bg: var(--grove-bg);
  --surface: #fffaf2;
  --surface-soft: var(--grove-bg-secondary);
  --surface-sunken: var(--grove-bg-tertiary);
  --ink: var(--grove-ink);
  --muted: var(--grove-muted);
  --line: rgba(180, 170, 155, 0.42);
  --line-strong: rgba(150, 138, 120, 0.56);
  --approval: var(--grove-green-dark);
  --approval-soft: rgba(255, 139, 61, 0.13);
  --ratify: var(--grove-blue-dark);
  --ratify-soft: rgba(75, 143, 229, 0.14);
  --packet: #6d5d98;
  --packet-soft: rgba(109, 93, 152, 0.14);
  --decision: #a67625;
  --decision-soft: rgba(255, 184, 0, 0.14);
  --decline: #9e4a3a;
  --decline-soft: rgba(158, 74, 58, 0.14);
  --shadow:
    -1px -1px 4px rgba(255, 255, 255, 0.8),
    1px 1px 4px rgba(180, 170, 155, 0.3),
    -3px -3px 10px rgba(255, 255, 255, 0.65),
    3px 3px 10px rgba(180, 170, 155, 0.25),
    -7px -7px 22px rgba(255, 255, 255, 0.5),
    7px 7px 22px rgba(180, 170, 155, 0.2),
    -12px -12px 38px rgba(255, 255, 255, 0.35),
    12px 12px 38px rgba(180, 170, 155, 0.16);
  --shadow-tight:
    -1px -1px 4px rgba(255, 255, 255, 0.78),
    1px 1px 4px rgba(180, 170, 155, 0.28),
    -4px -4px 14px rgba(255, 255, 255, 0.45),
    4px 4px 14px rgba(180, 170, 155, 0.2),
    -8px -8px 24px rgba(255, 255, 255, 0.26),
    8px 8px 24px rgba(160, 148, 130, 0.14);
  --shadow-inset:
    inset 3px 3px 10px rgba(180, 170, 155, 0.35),
    inset -3px -3px 10px rgba(255, 255, 255, 0.5),
    inset 7px 7px 22px rgba(180, 170, 155, 0.25),
    inset -7px -7px 22px rgba(255, 255, 255, 0.38),
    inset 12px 12px 38px rgba(160, 148, 130, 0.18);
  --ring: rgba(255, 139, 61, 0.34);
  --radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(220, 214, 204, 0.74)),
    linear-gradient(180deg, var(--grove-bg), var(--grove-bg-secondary));
}

@keyframes grove-os-edge-breathe {
  0%, 100% {
    box-shadow:
      inset 0 0 18px rgba(255, 139, 61, 0.08),
      inset 0 0 36px rgba(255, 139, 61, 0.04),
      var(--shadow);
  }
  50% {
    box-shadow:
      inset 0 0 34px rgba(255, 139, 61, 0.15),
      inset 0 0 68px rgba(255, 139, 61, 0.08),
      var(--shadow);
  }
}

@keyframes grove-os-signal-pulse {
  0%, 100% {
    filter: drop-shadow(0 0 8px rgba(255, 139, 61, 0.22));
  }
  50% {
    filter: drop-shadow(0 0 16px rgba(255, 139, 61, 0.44));
  }
}

body.skin-neumorphic .app-shell {
  width: min(100%, 1240px);
  padding-bottom: 28px;
}

body.skin-neumorphic .topbar {
  border-bottom: 1px solid rgba(255, 255, 255, 0.42);
  background:
    linear-gradient(180deg, rgba(245, 240, 232, 0.92), rgba(237, 232, 224, 0.82));
  backdrop-filter: blur(16px) saturate(130%);
}

body.skin-neumorphic h1,
body.skin-neumorphic .weave-hero h2,
body.skin-neumorphic .focus-card h2 {
  background: linear-gradient(135deg, var(--grove-green-deep), var(--grove-green), var(--grove-blue));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 2px 8px rgba(255, 139, 61, 0.16));
}

body.skin-neumorphic .topbar-state {
  display: grid;
  gap: 10px;
  justify-items: start;
}

body.skin-neumorphic .workbench-state,
body.skin-neumorphic .layer-switch,
body.skin-neumorphic .view-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

body.skin-neumorphic .system-drawer {
  border-color: rgba(180, 170, 155, 0.32);
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.78), rgba(229, 224, 216, 0.58));
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic .system-drawer summary span:first-child {
  color: #6a3218;
}

body.skin-neumorphic #statusSummary {
  color: #75503a;
}

body.skin-neumorphic .workbench-state span,
body.skin-neumorphic .status-strip span,
body.skin-neumorphic .meta-pill,
body.skin-neumorphic .count-pill,
body.skin-neumorphic .decision-pill,
body.skin-neumorphic .boundary-pill {
  border-color: rgba(180, 170, 155, 0.3);
  background: rgba(255, 250, 242, 0.5);
  box-shadow: none;
}

body.skin-neumorphic a.boundary-pill {
  border-color: rgba(150, 138, 120, 0.48);
  background: linear-gradient(145deg, rgba(255, 250, 242, 0.94), rgba(229, 224, 216, 0.86));
  color: var(--grove-green-deep);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 6px 14px rgba(180, 170, 155, 0.16);
}

body.skin-neumorphic a.boundary-pill:hover {
  border-color: rgba(255, 139, 61, 0.48);
  color: var(--grove-green-deep);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 10px 22px rgba(216, 92, 31, 0.16);
}

body.skin-neumorphic .workbench-state span {
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: #6a3218;
  font-size: 12px;
  font-weight: 780;
}

body.skin-neumorphic .toolbar,
body.skin-neumorphic .queue-card,
body.skin-neumorphic .review-toolbar,
body.skin-neumorphic .review-card,
body.skin-neumorphic .focus-card,
body.skin-neumorphic .home-decision-card,
body.skin-neumorphic .sidecar-panel,
body.skin-neumorphic .intent-panel,
body.skin-neumorphic .weave-hero,
body.skin-neumorphic .weave-map-panel,
body.skin-neumorphic .weave-detail-panel,
body.skin-neumorphic .atom-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 255, 255, 0.5);
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.96), rgba(229, 224, 216, 0.9));
  box-shadow: var(--shadow);
}

body.skin-neumorphic .toolbar::before,
body.skin-neumorphic .review-toolbar::before,
body.skin-neumorphic .focus-card::before,
body.skin-neumorphic .home-decision-card::before,
body.skin-neumorphic .sidecar-panel::before,
body.skin-neumorphic .intent-panel::before,
body.skin-neumorphic .weave-hero::before,
body.skin-neumorphic .weave-detail-panel::before,
body.skin-neumorphic .atom-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow:
    inset 0 0 22px rgba(255, 139, 61, 0.06),
    inset 0 0 44px rgba(45, 212, 191, 0.025);
  pointer-events: none;
}

body.skin-neumorphic .queue-card,
body.skin-neumorphic .review-card,
body.skin-neumorphic .weave-node {
  box-shadow: var(--shadow-tight);
  transition:
    transform var(--grove-duration-fast) var(--grove-spring),
    box-shadow var(--grove-duration-normal) var(--grove-smooth),
    border-color var(--grove-duration-fast) var(--grove-smooth);
}

body.skin-neumorphic .queue-card:hover,
body.skin-neumorphic .review-card:hover,
body.skin-neumorphic .home-decision-card:hover,
body.skin-neumorphic .project-strip-card:hover {
  transform: translateY(-1px);
  box-shadow:
    -1px -1px 5px rgba(255, 255, 255, 0.86),
    1px 1px 5px rgba(180, 170, 155, 0.34),
    -5px -5px 18px rgba(255, 255, 255, 0.56),
    5px 5px 18px rgba(180, 170, 155, 0.24),
    -12px -12px 34px rgba(255, 255, 255, 0.34),
    12px 12px 34px rgba(160, 148, 130, 0.16);
}

body.skin-neumorphic #searchInput,
body.skin-neumorphic #reviewSearchInput,
body.skin-neumorphic .note-field,
body.skin-neumorphic .intent-textarea,
body.skin-neumorphic .intent-field textarea,
body.skin-neumorphic #packetOutput,
body.skin-neumorphic .field-packet,
body.skin-neumorphic .intent-preview,
body.skin-neumorphic .atom-preview,
body.skin-neumorphic .human-metric,
body.skin-neumorphic .human-status,
body.skin-neumorphic .project-strip-card,
body.skin-neumorphic .weave-metrics span {
  border-color: rgba(180, 170, 155, 0.38);
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic #searchInput,
body.skin-neumorphic #reviewSearchInput,
body.skin-neumorphic .note-field,
body.skin-neumorphic .intent-textarea,
body.skin-neumorphic .intent-field textarea,
body.skin-neumorphic .atom-preview,
body.skin-neumorphic .human-metric,
body.skin-neumorphic .human-status,
body.skin-neumorphic .project-strip-card,
body.skin-neumorphic .weave-metrics span {
  background: linear-gradient(145deg, var(--grove-bg-secondary), var(--grove-bg-tertiary));
}

body.skin-neumorphic #packetOutput,
body.skin-neumorphic .field-packet,
body.skin-neumorphic .intent-preview {
  border-color: rgba(255, 139, 61, 0.18);
  background:
    linear-gradient(145deg, #16201d, #0e1715);
  color: #fff7ed;
  box-shadow:
    inset 3px 3px 12px rgba(0, 0, 0, 0.35),
    inset -3px -3px 12px rgba(255, 139, 61, 0.08);
}

body.skin-neumorphic button {
  border-color: rgba(150, 138, 120, 0.5);
  background: linear-gradient(145deg, rgba(255, 250, 242, 0.96), rgba(229, 224, 216, 0.92));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 2px 0 rgba(160, 148, 130, 0.18),
    6px 8px 18px rgba(180, 170, 155, 0.2),
    -5px -5px 14px rgba(255, 255, 255, 0.68);
  transition:
    transform var(--grove-duration-fast) var(--grove-spring),
    box-shadow var(--grove-duration-fast) var(--grove-smooth),
    border-color var(--grove-duration-fast) var(--grove-smooth);
}

body.skin-neumorphic button:hover {
  border-color: rgba(255, 139, 61, 0.45);
  color: var(--grove-green-deep);
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 2px 0 rgba(216, 92, 31, 0.2),
    8px 12px 26px rgba(216, 92, 31, 0.14),
    -7px -7px 18px rgba(255, 255, 255, 0.72);
}

body.skin-neumorphic button:active {
  transform: translateY(0);
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic button:focus-visible,
body.skin-neumorphic input:focus-visible,
body.skin-neumorphic textarea:focus-visible,
body.skin-neumorphic summary:focus-visible {
  outline: 3px solid var(--ring);
  outline-offset: 3px;
}

body.skin-neumorphic .segment.active,
body.skin-neumorphic .view-tab.active,
body.skin-neumorphic .layer-tab.active,
body.skin-neumorphic .choice-button.active,
body.skin-neumorphic .action-button.active,
body.skin-neumorphic .primary-button {
  border-color: rgba(255, 190, 120, 0.55);
  background:
    linear-gradient(135deg, var(--grove-green-light), var(--grove-green-dark) 58%, var(--grove-green-deep));
  color: #fffaf4;
  box-shadow:
    inset 0 2px 6px rgba(255, 190, 120, 0.5),
    0 4px 18px var(--grove-glow-mid),
    0 8px 36px var(--grove-glow-outer),
    0 14px 28px var(--grove-glow-depth);
}

body.skin-neumorphic .view-tab.active,
body.skin-neumorphic .primary-button {
  animation: grove-os-signal-pulse 6s ease-in-out infinite;
}

body.skin-neumorphic .primary-button {
  border-color: rgba(255, 190, 120, 0.62);
}

body.skin-neumorphic .subtle-button {
  background: linear-gradient(145deg, var(--grove-bg), var(--grove-bg-secondary));
}

body.skin-neumorphic .recommendation-band,
body.skin-neumorphic .context-panel,
body.skin-neumorphic .packet-context-summary,
body.skin-neumorphic .packet-raw-details,
body.skin-neumorphic details {
  border-color: rgba(180, 170, 155, 0.32);
}

body.skin-neumorphic .context-panel,
body.skin-neumorphic .packet-context-summary,
body.skin-neumorphic .packet-raw-details {
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.82), rgba(229, 224, 216, 0.72));
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic .queue-card[data-type="approval"] {
  border-left-color: var(--grove-green-dark);
}

body.skin-neumorphic .queue-card[data-type="ratification"] {
  border-left-color: var(--grove-blue-dark);
}

body.skin-neumorphic .queue-card[data-type="packet_execution"] {
  border-left-color: #6d5d98;
}

body.skin-neumorphic .queue-card[data-type="automation_approval"],
body.skin-neumorphic .queue-card[data-type="operator_decision"] {
  border-left-color: #c49a82;
}

body.skin-neumorphic .queue-card[data-operator-decision] {
  box-shadow:
    0 0 0 2px rgba(255, 139, 61, 0.14),
    var(--shadow-tight);
}

body.skin-neumorphic .review-card[data-operator-decision] {
  box-shadow:
    0 0 0 2px rgba(75, 143, 229, 0.14),
    var(--shadow-tight);
}

body.skin-neumorphic .decision-pill[data-kind="approval"],
body.skin-neumorphic .decision-pill[data-kind="approve"],
body.skin-neumorphic .decision-pill[data-kind="accept"] {
  border-color: rgba(255, 139, 61, 0.34);
  background: rgba(255, 139, 61, 0.12);
  color: var(--grove-green-deep);
}

body.skin-neumorphic .decision-pill[data-kind="ratification"],
body.skin-neumorphic .decision-pill[data-kind="ratify"] {
  border-color: rgba(75, 143, 229, 0.34);
  background: rgba(75, 143, 229, 0.12);
  color: #1d4f90;
}

body.skin-neumorphic .claim,
body.skin-neumorphic .source-text {
  color: #35271f;
}

body.skin-neumorphic .source-text,
body.skin-neumorphic .copy-status,
body.skin-neumorphic .search-label,
body.skin-neumorphic .eyebrow,
body.skin-neumorphic .item-id,
body.skin-neumorphic summary {
  color: #75503a;
}

body.skin-neumorphic .evidence-link {
  color: #0d9488;
}

body.skin-neumorphic .empty-state {
  background: rgba(255, 250, 242, 0.62);
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic .weave-map-panel {
  border-color: rgba(255, 255, 255, 0.5);
  background:
    linear-gradient(90deg, rgba(159, 53, 20, 0.08) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(0deg, rgba(13, 148, 136, 0.07) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(145deg, rgba(255, 250, 242, 0.98), rgba(220, 214, 204, 0.94));
  animation: grove-os-edge-breathe 8s ease-in-out infinite;
}

body.skin-neumorphic .weave-lane {
  border-color: rgba(180, 170, 155, 0.26);
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.64), rgba(229, 224, 216, 0.48));
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic .weave-lane-header h3 {
  color: #6a3218;
}

body.skin-neumorphic .weave-band {
  border-color: rgba(180, 170, 155, 0.24);
}

body.skin-neumorphic .weave-edge {
  background: rgba(30, 41, 59, 0.22);
}

body.skin-neumorphic .weave-edge[data-role="authority"] {
  background: rgba(216, 92, 31, 0.52);
}

body.skin-neumorphic .weave-edge[data-role="blocking_gate"] {
  background: rgba(196, 154, 130, 0.58);
}

body.skin-neumorphic .weave-edge[data-role="output_location"] {
  background: rgba(13, 148, 136, 0.5);
}

body.skin-neumorphic .weave-edge[data-role="graph_implication"] {
  background: rgba(75, 143, 229, 0.46);
}

body.skin-neumorphic .weave-node {
  border-color: rgba(255, 255, 255, 0.55);
  background:
    radial-gradient(ellipse 70% 60% at 35% 28%, rgba(255, 255, 255, 0.72), transparent 55%),
    linear-gradient(145deg, var(--grove-bg), var(--grove-bg-tertiary));
}

body.skin-neumorphic .weave-node[data-kind="authority"],
body.skin-neumorphic .weave-node[data-kind="schema"] {
  background:
    radial-gradient(ellipse 70% 60% at 35% 28%, rgba(255, 255, 255, 0.7), transparent 55%),
    linear-gradient(145deg, rgba(255, 179, 106, 0.22), rgba(220, 214, 204, 0.92));
}

body.skin-neumorphic .weave-node[data-kind="surface"],
body.skin-neumorphic .weave-node[data-kind="queue"] {
  background:
    radial-gradient(ellipse 70% 60% at 35% 28%, rgba(255, 255, 255, 0.72), transparent 55%),
    linear-gradient(145deg, rgba(45, 212, 191, 0.16), rgba(229, 224, 216, 0.94));
}

body.skin-neumorphic .weave-node[data-kind="project"] {
  background:
    radial-gradient(ellipse 70% 60% at 35% 28%, rgba(255, 255, 255, 0.72), transparent 55%),
    linear-gradient(145deg, rgba(196, 154, 130, 0.2), rgba(229, 224, 216, 0.94));
}

body.skin-neumorphic .weave-node[data-selected="true"] {
  border-color: rgba(255, 190, 120, 0.7);
  box-shadow:
    inset 0 2px 6px rgba(255, 190, 120, 0.48),
    0 4px 18px rgba(255, 139, 61, 0.35),
    0 8px 36px rgba(255, 139, 61, 0.18),
    var(--shadow-tight);
}

@media (prefers-reduced-motion: reduce) {
  body.skin-neumorphic .view-tab.active,
  body.skin-neumorphic .primary-button,
  body.skin-neumorphic .weave-map-panel {
    animation: none;
  }
}

@media (min-width: 780px) {
  body.skin-neumorphic .topbar-state {
    justify-items: end;
  }
}

/*
 * ANSONMAE OS binding layer.
 * This maps the inherited Gr0ve neumorphic skin onto ANSONMAE cockpit classes.
 */

body.skin-neumorphic {
  --paper: var(--grove-bg);
  --paper-strong: #fffaf2;
  --surface: #fffaf2;
  --surface-muted: var(--grove-bg-secondary);
  --ink-900: #211913;
  --ink-800: #2f261f;
  --ink-700: #45362b;
  --ink-600: #624b3a;
  --ink-500: #75503a;
  --ink-400: #9e8b7c;
  --ink-300: #c9bdae;
  --ink-200: #ded6ca;
  --ink-100: #ede8e0;
  --teal: var(--grove-green-dark);
  --teal-soft: rgba(255, 139, 61, 0.13);
  --green: var(--grove-green-dark);
  --green-soft: rgba(255, 139, 61, 0.13);
  --amber: #b76020;
  --amber-soft: rgba(255, 184, 92, 0.2);
  --line: rgba(180, 170, 155, 0.42);
  --line-strong: rgba(150, 138, 120, 0.56);
  --shadow-soft: var(--shadow);
  background:
    radial-gradient(ellipse 70% 56% at 24% 4%, rgba(255, 139, 61, 0.13), transparent 54%),
    radial-gradient(ellipse 48% 36% at 92% 8%, rgba(75, 143, 229, 0.11), transparent 56%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(220, 214, 204, 0.74)),
    linear-gradient(180deg, var(--grove-bg), var(--grove-bg-secondary));
}

body.skin-neumorphic h1,
body.skin-neumorphic h2 {
  background: linear-gradient(135deg, var(--grove-green-deep), var(--grove-green), var(--grove-blue));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 2px 8px rgba(255, 139, 61, 0.14));
}

body.skin-neumorphic .os-shell {
  background:
    linear-gradient(90deg, rgba(159, 53, 20, 0.045) 1px, transparent 1px) 0 0 / 72px 72px,
    linear-gradient(0deg, rgba(180, 170, 155, 0.12) 1px, transparent 1px) 0 0 / 72px 72px;
}

body.skin-neumorphic .os-rail,
body.skin-neumorphic .os-command {
  border-color: rgba(255, 255, 255, 0.46);
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.84), rgba(229, 224, 216, 0.72));
  box-shadow: var(--shadow-inset);
}

body.skin-neumorphic .brand-sigil,
body.skin-neumorphic .icon-button,
body.skin-neumorphic .nav-link[aria-current="page"],
body.skin-neumorphic .nav-link:hover,
body.skin-neumorphic .rail-note,
body.skin-neumorphic .subpage-nav,
body.skin-neumorphic .subpage-nav a,
body.skin-neumorphic .project-link-grid a,
body.skin-neumorphic .surface-panel,
body.skin-neumorphic .kpi,
body.skin-neumorphic .project-row,
body.skin-neumorphic .task-row,
body.skin-neumorphic .integration-row,
body.skin-neumorphic .gate-row,
body.skin-neumorphic .flow-node,
body.skin-neumorphic .template-tile {
  border-color: rgba(255, 255, 255, 0.5);
  background:
    linear-gradient(145deg, rgba(255, 250, 242, 0.96), rgba(229, 224, 216, 0.9));
  box-shadow: var(--shadow);
}

body.skin-neumorphic .surface-panel,
body.skin-neumorphic .kpi,
body.skin-neumorphic .project-row,
body.skin-neumorphic .task-row,
body.skin-neumorphic .integration-row,
body.skin-neumorphic .gate-row,
body.skin-neumorphic .flow-node,
body.skin-neumorphic .template-tile,
body.skin-neumorphic .subpage-nav a,
body.skin-neumorphic .project-link-grid a {
  position: relative;
  overflow: hidden;
}

body.skin-neumorphic .surface-panel::before,
body.skin-neumorphic .kpi::before,
body.skin-neumorphic .project-row::before,
body.skin-neumorphic .task-row::before,
body.skin-neumorphic .integration-row::before,
body.skin-neumorphic .gate-row::before,
body.skin-neumorphic .flow-node::before,
body.skin-neumorphic .template-tile::before,
body.skin-neumorphic .subpage-nav a::before,
body.skin-neumorphic .project-link-grid a::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow:
    inset 0 0 22px rgba(255, 139, 61, 0.055),
    inset 0 0 44px rgba(45, 212, 191, 0.022);
  pointer-events: none;
}

body.skin-neumorphic .surface-panel > *,
body.skin-neumorphic .kpi > *,
body.skin-neumorphic .project-row > *,
body.skin-neumorphic .task-row > *,
body.skin-neumorphic .integration-row > *,
body.skin-neumorphic .gate-row > *,
body.skin-neumorphic .flow-node > *,
body.skin-neumorphic .template-tile > *,
body.skin-neumorphic .subpage-nav a > *,
body.skin-neumorphic .project-link-grid a > * {
  position: relative;
  z-index: 1;
}

body.skin-neumorphic .status-chip,
body.skin-neumorphic .nav-icon,
body.skin-neumorphic .gate-step,
body.skin-neumorphic .swatch {
  border-color: rgba(180, 170, 155, 0.38);
  box-shadow:
    inset 2px 2px 7px rgba(180, 170, 155, 0.24),
    inset -2px -2px 7px rgba(255, 255, 255, 0.48);
}

body.skin-neumorphic .status-chip {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--state-soft) 76%, #fffaf2), rgba(229, 224, 216, 0.68));
}

body.skin-neumorphic .brand-sigil,
body.skin-neumorphic .kpi-value,
body.skin-neumorphic .project-id {
  color: var(--project-color, var(--grove-green-deep));
  filter: drop-shadow(0 2px 8px rgba(255, 139, 61, 0.12));
}

body.skin-neumorphic .icon-button:hover,
body.skin-neumorphic .nav-link:hover {
  border-color: rgba(255, 139, 61, 0.42);
  color: var(--grove-green-deep);
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    0 2px 0 rgba(216, 92, 31, 0.18),
    8px 12px 26px rgba(216, 92, 31, 0.12),
    -7px -7px 18px rgba(255, 255, 255, 0.72);
}

body.skin-neumorphic .project-row,
body.skin-neumorphic .task-row,
body.skin-neumorphic .integration-row,
body.skin-neumorphic .gate-row,
body.skin-neumorphic .flow-node {
  box-shadow: var(--shadow-tight);
  transition:
    transform var(--grove-duration-fast) var(--grove-spring),
    box-shadow var(--grove-duration-normal) var(--grove-smooth),
    border-color var(--grove-duration-fast) var(--grove-smooth);
}

body.skin-neumorphic .project-row:hover,
body.skin-neumorphic .task-row:hover,
body.skin-neumorphic .integration-row:hover,
body.skin-neumorphic .gate-row:hover,
body.skin-neumorphic .flow-node:hover,
body.skin-neumorphic .template-tile:hover,
body.skin-neumorphic .subpage-nav a:hover,
body.skin-neumorphic .project-link-grid a:hover {
  transform: translateY(-1px);
  box-shadow:
    -1px -1px 5px rgba(255, 255, 255, 0.86),
    1px 1px 5px rgba(180, 170, 155, 0.34),
    -5px -5px 18px rgba(255, 255, 255, 0.56),
    5px 5px 18px rgba(180, 170, 155, 0.24),
    -12px -12px 34px rgba(255, 255, 255, 0.34),
    12px 12px 34px rgba(160, 148, 130, 0.16);
}

body.skin-neumorphic .surface-panel[data-template="cockpit"] {
  animation: grove-os-edge-breathe 8s ease-in-out infinite;
}

body.skin-neumorphic .surface-panel[data-template="ratification"] {
  border-color: rgba(255, 139, 61, 0.28);
}

body.skin-neumorphic .flowline {
  isolation: isolate;
}

body.skin-neumorphic .flow-node {
  min-height: 6rem;
}

body.skin-neumorphic .data-table th,
body.skin-neumorphic .eyebrow,
body.skin-neumorphic .meta,
body.skin-neumorphic .brand-subtitle {
  color: #75503a;
}

body.skin-neumorphic .panel-rule {
  background: rgba(180, 170, 155, 0.36);
}