/* Modern component compatibility for the restored August Nacre material system.
   Post-August components inherit the same pearl/glass language without changing workflow behavior. */

body[data-seelo-theme="nacre"] .workflow-rail,
body[data-seelo-theme="nacre"] .inventory-category,
body[data-seelo-theme="nacre"] .ops-pulse-card,
body[data-seelo-theme="nacre"] .settings-section,
body[data-seelo-theme="nacre"] .settings-card,
body[data-seelo-theme="nacre"] .sm-panel,
body[data-seelo-theme="nacre"] .sm-record,
body[data-seelo-theme="nacre"] .truth-panel,
body[data-seelo-theme="nacre"] .truth-card,
body[data-seelo-theme="nacre"] .cost-hub-card,
body[data-seelo-theme="nacre"] .cost-feature,
body[data-seelo-theme="nacre"] .cost-workbench-card,
body[data-seelo-theme="nacre"] .engine-tool-hero,
body[data-seelo-theme="nacre"] .cost-browse-card,
body[data-seelo-theme="nacre"] .integration-card{
  background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,255,255,.22))!important;
  border-color:rgba(77,67,86,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.54),inset 0 -1px 0 rgba(255,255,255,.10),0 16px 42px rgba(72,64,78,.075)!important;
  backdrop-filter:blur(17px) saturate(116%)!important;
  -webkit-backdrop-filter:blur(17px) saturate(116%)!important;
}

body[data-seelo-theme="nacre"] .workflow-rail{background:rgba(255,255,255,.16)!important}
body[data-seelo-theme="nacre"] .workflow-item,
body[data-seelo-theme="nacre"] .workflow-item.primary{
  background:linear-gradient(180deg,color-mix(in srgb,var(--flow,var(--accent)) 8%,rgba(255,255,255,.24)),rgba(255,255,255,.10))!important;
}
body[data-seelo-theme="nacre"] .workflow-item:hover{
  background:linear-gradient(180deg,color-mix(in srgb,var(--flow,var(--accent)) 15%,rgba(255,255,255,.31)),rgba(255,255,255,.14))!important;
}
body[data-seelo-theme="nacre"] .inventory-category:hover,
body[data-seelo-theme="nacre"] .settings-card:hover,
body[data-seelo-theme="nacre"] .cost-feature:hover{
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 18%,rgba(255,255,255,.62)),rgba(255,255,255,.28))!important;
  border-color:color-mix(in srgb,var(--accent) 28%,var(--border))!important;
}

body[data-seelo-theme="nacre"] .truth-panel,
body[data-seelo-theme="nacre"] .truth-card{border-radius:20px!important}
body[data-seelo-theme="nacre"] .truth-stat{
  background:rgba(255,255,255,.34)!important;
  border-color:var(--border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42)!important;
}
body[data-seelo-theme="nacre"] .truth-row{background:rgba(255,255,255,.08)!important}

/* Nacre canvas. */
body[data-seelo-theme="nacre"] .main{
  background:linear-gradient(180deg,rgba(250,248,250,.17),rgba(241,239,243,.05))!important;
  backdrop-filter:blur(4px)!important;
  -webkit-backdrop-filter:blur(4px)!important;
}

/* Restore the richer Friday-era navigator: violet graphite glass, pearl bloom, and tiny cold spark points. */
body[data-seelo-theme="nacre"] .side{
  position:relative!important;
  isolation:isolate!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-gutter:stable;
  padding-bottom:44px!important;
  background:
    linear-gradient(180deg,rgba(67,61,74,.98) 0%,rgba(48,43,55,.985) 42%,rgba(43,38,49,.995) 100%)!important;
  border-right:1px solid rgba(255,255,255,.095)!important;
  box-shadow:14px 0 42px rgba(54,46,60,.13),inset -1px 0 0 rgba(255,255,255,.035)!important;
}
body[data-seelo-theme="nacre"] .side::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  inset:-10% -38% -14% -28%!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse 34% 18% at 70% 5%,rgba(230,240,244,.21),transparent 70%),
    radial-gradient(ellipse 28% 23% at 12% 32%,rgba(190,168,204,.17),transparent 72%),
    radial-gradient(ellipse 36% 18% at 86% 72%,rgba(179,211,221,.10),transparent 74%),
    linear-gradient(118deg,transparent 15%,rgba(255,255,255,.055) 30%,rgba(201,224,231,.075) 39%,transparent 51%,rgba(214,190,220,.05) 66%,transparent 78%)!important;
  filter:blur(1.8px) saturate(120%)!important;
  transform:rotate(-5deg)!important;
  opacity:.92!important;
}
body[data-seelo-theme="nacre"] .side::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 22% 13%,rgba(255,255,255,.30) 0 1px,transparent 1.5px),
    radial-gradient(circle at 76% 23%,rgba(204,231,240,.24) 0 1px,transparent 1.5px),
    radial-gradient(circle at 47% 39%,rgba(255,255,255,.16) 0 1px,transparent 1.4px),
    radial-gradient(circle at 84% 58%,rgba(211,188,220,.20) 0 1px,transparent 1.5px),
    radial-gradient(circle at 30% 74%,rgba(222,239,244,.19) 0 1px,transparent 1.5px),
    linear-gradient(90deg,rgba(255,255,255,.035),transparent 14%,transparent 84%,rgba(255,255,255,.018))!important;
  background-size:58px 67px,72px 83px,91px 77px,104px 96px,126px 111px,auto!important;
  mix-blend-mode:screen!important;
  opacity:.64!important;
}
body[data-seelo-theme="nacre"] .side>*{position:relative!important;z-index:1!important}
body[data-seelo-theme="nacre"] .side>.brand{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:0 1px 18px rgba(222,236,242,.11)!important;
}

/* Nav controls should feel like glass lenses, not gray rectangles. */
body[data-seelo-theme="nacre"] .nav button,
body[data-seelo-theme="nacre"] .nav .nav-external{
  position:relative!important;
  display:block!important;
  width:100%!important;
  text-align:left!important;
  text-decoration:none!important;
  overflow:hidden!important;
  padding:9px 11px!important;
  margin:2px 0!important;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(255,255,255,.006))!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
  color:rgba(250,248,252,.84)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  font:inherit!important;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease!important;
}
body[data-seelo-theme="nacre"] .nav button::after,
body[data-seelo-theme="nacre"] .nav .nav-external::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:-42%!important;
  top:-105%!important;
  width:48%!important;
  height:300%!important;
  pointer-events:none!important;
  transform:rotate(18deg)!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),rgba(203,229,237,.08),transparent)!important;
  transition:left .42s ease!important;
  opacity:.62!important;
}
body[data-seelo-theme="nacre"] .nav button:hover,
body[data-seelo-theme="nacre"] .nav .nav-external:hover{
  color:#fff!important;
  background:linear-gradient(135deg,rgba(255,255,255,.095),rgba(182,209,219,.035) 58%,rgba(194,172,205,.035))!important;
  border-color:rgba(245,248,252,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 8px 22px rgba(23,18,28,.10)!important;
}
body[data-seelo-theme="nacre"] .nav button:hover::after,
body[data-seelo-theme="nacre"] .nav .nav-external:hover::after{left:106%!important}
body[data-seelo-theme="nacre"] .nav button.active{
  color:#fff!important;
  background:
    radial-gradient(ellipse 64% 95% at 18% 8%,rgba(255,255,255,.13),transparent 68%),
    linear-gradient(135deg,rgba(255,255,255,.13),rgba(189,209,219,.055) 48%,rgba(193,168,207,.07) 100%)!important;
  border-color:rgba(246,248,252,.16)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(255,255,255,.035),
    0 9px 26px rgba(25,19,30,.14),
    0 0 18px rgba(191,219,229,.035)!important;
  backdrop-filter:blur(11px) saturate(124%)!important;
  -webkit-backdrop-filter:blur(11px) saturate(124%)!important;
}
body[data-seelo-theme="nacre"] .nav button.active::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:22%!important;
  bottom:22%!important;
  width:2px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(244,251,253,.98),rgba(167,211,225,.54))!important;
  box-shadow:0 0 7px rgba(211,237,244,.58),0 0 17px rgba(173,211,224,.18)!important;
}

body[data-seelo-theme="nacre"] .group{
  color:rgba(245,242,248,.55)!important;
  text-shadow:0 1px 12px rgba(215,231,237,.07)!important;
}

/* Identity is a quiet translucent control, not a white form box. */
body[data-seelo-theme="nacre"] .identity-button{
  appearance:none!important;
  border:1px solid rgba(92,80,101,.10)!important;
  border-radius:16px!important;
  padding:9px 13px 10px!important;
  text-align:left!important;
  color:var(--ink)!important;
  background:
    radial-gradient(ellipse 72% 100% at 8% 0%,rgba(255,255,255,.52),transparent 70%),
    linear-gradient(145deg,rgba(255,255,255,.34),rgba(255,255,255,.13))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 9px 26px rgba(72,64,78,.05)!important;
  backdrop-filter:blur(14px) saturate(116%)!important;
  -webkit-backdrop-filter:blur(14px) saturate(116%)!important;
  cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
body[data-seelo-theme="nacre"] .identity-button:hover{
  background:
    radial-gradient(ellipse 72% 100% at 8% 0%,rgba(255,255,255,.64),transparent 70%),
    linear-gradient(145deg,rgba(255,255,255,.42),rgba(220,209,225,.18))!important;
  border-color:rgba(111,96,120,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68),0 11px 30px rgba(72,64,78,.075)!important;
}
body[data-seelo-theme="nacre"] .identity-button .k{
  margin:0 0 3px!important;
  color:rgba(65,56,70,.69)!important;
  letter-spacing:.14em!important;
}
body[data-seelo-theme="nacre"] .identity-hint{
  color:rgba(69,61,74,.72)!important;
  font-size:12px!important;
}

/* Do not let newer editorial flattening remove depth from Nacre work surfaces. */
body[data-seelo-theme="nacre"] .table,
body[data-seelo-theme="nacre"] .mpl-category,
body[data-seelo-theme="nacre"] .mpl-group-card{
  box-shadow:0 12px 34px rgba(72,64,78,.055)!important;
}

@media(max-width:900px){
  body[data-seelo-theme="nacre"] .main{background:transparent!important}
  body[data-seelo-theme="nacre"] .side{overflow-x:auto!important;overflow-y:hidden!important;padding-bottom:0!important}
  body[data-seelo-theme="nacre"] .side::before,body[data-seelo-theme="nacre"] .side::after{opacity:.48!important}
}
