/* Public cards share the live network's palette. The centres stay dark;
   broad, quiet highlights give the lower page the same depth as the live view. */
body{
  --surface-a:var(--site-glow-left-color,rgb(var(--site-glow-left,119,92,206)));
  --surface-b:var(--site-glow-accent-color,rgb(var(--site-glow-accent,88,185,225)));
  --surface-c:var(--site-glow-right-color,rgb(var(--site-glow-right,255,166,144)));
}

/* The network frame follows the selected colors, including in a dialog. */
:is(#obsah,#network-theater) .hero-network{
  --scene-a:var(--surface-b);
  --scene-b:var(--surface-a);
  --scene-c:var(--surface-c);
}

/* Existing self-contained panels; no frame is added around ordinary text. */
#obsah :is(.live-app-promo,.network-metrics,.article-card,.founder-card,.membership-banner),
#obsah #sit :is(.blocks-panel,.block-detail),
#obsah .home-direct-support .kas-donation{
  --surface-turn:135deg;
  position:relative;
  isolation:isolate;
  border:1px solid transparent;
  border-radius:16px;
  background:
    radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--surface-a) 13%,transparent),transparent 60%) padding-box,
    radial-gradient(ellipse at 100% 100%,color-mix(in srgb,var(--surface-c) 8%,transparent),transparent 56%) padding-box,
    linear-gradient(145deg,#0d151a,#090f13) padding-box,
    conic-gradient(from var(--surface-turn),
      color-mix(in srgb,var(--surface-a) 25%,#172329),
      color-mix(in srgb,var(--surface-a) 78%,#172329) 65deg,
      color-mix(in srgb,var(--surface-b) 28%,#172329) 115deg,
      color-mix(in srgb,var(--surface-b) 80%,#172329) 195deg,
      color-mix(in srgb,var(--surface-c) 70%,#172329) 285deg,
      color-mix(in srgb,var(--surface-a) 25%,#172329)) border-box;
  box-shadow:0 16px 46px #0002,0 0 32px color-mix(in srgb,var(--surface-b) 5%,transparent);
}

#obsah .article-card{overflow:hidden;--surface-turn:155deg}
#obsah .article-card:nth-child(3n+2){--surface-turn:265deg}
#obsah .article-card:nth-child(3n){--surface-turn:25deg}
#obsah .article-card :is(.wallet-art,.mesh-art,.code-art){
  background:radial-gradient(ellipse at 50% 70%,color-mix(in srgb,var(--surface-b) 14%,transparent),transparent 75%),#0b1319;
}
#obsah .article-card .code-art>div{
  border-color:color-mix(in srgb,var(--surface-b) 28%,#26343a);
  background:color-mix(in srgb,var(--surface-a) 5%,#0b1217);
}
#obsah .founder-card{--surface-turn:205deg}
#obsah .membership-banner{--surface-turn:310deg}
#obsah .home-direct-support .kas-donation{--surface-turn:35deg}
#obsah .network-metrics{padding:25px 24px}
#obsah .network-metrics>div{border-right-color:color-mix(in srgb,var(--surface-b) 21%,#1d282a)}
#obsah .network-metrics>div:last-child{border-right:0}

/* Static edge highlight: no opacity pulse or automatically moving sheen. */
#obsah .article-card::after,
#obsah #komunita .community-channels>a::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  border:1px solid color-mix(in srgb,var(--surface-b) 75%,transparent);
  box-shadow:inset 0 0 18px color-mix(in srgb,var(--surface-b) 7%,transparent);
  opacity:.16;
  pointer-events:none;
  z-index:1;
}

#obsah .article-card:hover,
#obsah .article-card:focus-visible{
  border-color:transparent;
  box-shadow:0 18px 45px #0005,0 0 32px color-mix(in srgb,var(--surface-b) 15%,transparent);
}

/* The network's smaller metric cards get their own edge, without turning
   every available/connecting/offline indicator into a decorative colour. */
#obsah #sit .network-stat{
  border-color:color-mix(in srgb,var(--surface-b) 40%,#233038);
  border-radius:12px;
  background:
    radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--surface-a) 12%,transparent),transparent 75%),
    linear-gradient(150deg,#10191e,#0b1116);
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--surface-c) 14%,transparent);
}
#obsah #sit .network-stat:nth-child(3n+2){border-color:color-mix(in srgb,var(--surface-a) 45%,#233038)}
#obsah #sit .network-stat:nth-child(3n){border-color:color-mix(in srgb,var(--surface-c) 40%,#233038)}
#obsah #sit .network-stat::before{
  width:42%;height:2px;
  background:linear-gradient(90deg,var(--surface-a),var(--surface-b),transparent);
  opacity:.85;
}
#obsah #sit .network-stat-title svg{stroke:color-mix(in srgb,var(--surface-b) 70%,#d5e6e8)}
#obsah #sit .network-stat:hover{border-color:color-mix(in srgb,var(--surface-b) 70%,#233038)}

/* Portraits and resource directories remain quieter than the major cards. */
#obsah #lide .core-people{
  padding:12px 22px;
  border:1px solid color-mix(in srgb,var(--surface-a) 35%,#233038);
  border-radius:16px;
  background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--surface-c) 8%,transparent),transparent 75%),#0b1217;
}
#obsah #lide .person-row{border-color:color-mix(in srgb,var(--surface-b) 21%,#233038)}
#obsah #lide :is(.founder-copy,.person-row) .eyebrow{color:color-mix(in srgb,var(--surface-b) 45%,#b7c9cb)}
#obsah #ekosystem .resource-list>a{
  border-color:color-mix(in srgb,var(--surface-b) 30%,#233038);
  background:linear-gradient(95deg,color-mix(in srgb,var(--surface-a) 6%,transparent),transparent 80%);
}
#obsah #ekosystem .resource-list>a:nth-child(2n){
  background:linear-gradient(95deg,color-mix(in srgb,var(--surface-c) 7%,transparent),transparent 80%);
}
#obsah #ekosystem .resource-list>a:hover{
  background:linear-gradient(95deg,color-mix(in srgb,var(--surface-b) 13%,transparent),transparent 85%);
}
#obsah #ekosystem .resource-list>a>b{color:color-mix(in srgb,var(--surface-b) 65%,#d4e4e5)}
#obsah #ekosystem .resource-icon{
  color:color-mix(in srgb,var(--surface-b) 65%,#d4e4e5);
  background:color-mix(in srgb,var(--surface-a) 15%,#111d23);
}
#obsah #ekosystem .resource-list>a:hover .resource-icon{
  background:color-mix(in srgb,var(--surface-b) 22%,#111d23);
}

/* Membership and community used to keep their own green backgrounds. They
   now inherit the same selected palette as every other major surface. */
#obsah .membership-banner::before{
  border-color:color-mix(in srgb,var(--surface-c) 14%,transparent);
  box-shadow:0 0 0 55px color-mix(in srgb,var(--surface-a) 4%,transparent);
}
#obsah .membership-banner .member-benefit{
  border-bottom-color:color-mix(in srgb,var(--surface-b) 23%,#233038);
}
#obsah #komunita{
  background:
    radial-gradient(ellipse at 0% 35%,color-mix(in srgb,var(--surface-a) 12%,transparent),transparent 65%),
    radial-gradient(ellipse at 100% 80%,color-mix(in srgb,var(--surface-c) 10%,transparent),transparent 62%),
    #0b1318;
  border-block-color:color-mix(in srgb,var(--surface-b) 23%,#233038);
}
#obsah #komunita .community-channels>a{
  position:relative;
  border:1px solid transparent;
  border-radius:11px;
  padding:20px 18px;
  margin-block:10px;
  background:
    linear-gradient(130deg,#10191e,#0b1319) padding-box,
    linear-gradient(115deg,color-mix(in srgb,var(--surface-a) 75%,#24323a),color-mix(in srgb,var(--surface-b) 35%,#24323a),color-mix(in srgb,var(--surface-c) 60%,#24323a)) border-box;
}
#obsah #komunita .community-channels>a>span,
#obsah #komunita .community-channels>a>b{color:color-mix(in srgb,var(--surface-b) 70%,#c9e1e2)}
#obsah #komunita .community-channels>a:hover{
  box-shadow:0 0 25px color-mix(in srgb,var(--surface-b) 11%,transparent);
}

@media(max-width:760px){
  #obsah .network-metrics{padding:0}
  #obsah .network-metrics>div{border-bottom-color:color-mix(in srgb,var(--surface-b) 21%,#1d282a)}
  #obsah .network-metrics>div:nth-child(2){border-right:0}
  #obsah #lide .core-people{padding:8px 16px}
  #obsah :is(.live-app-promo,.network-metrics,.article-card,.founder-card,.membership-banner),
  #obsah #sit :is(.blocks-panel,.block-detail),
  #obsah .home-direct-support .kas-donation{
    border-radius:13px;
    box-shadow:0 12px 28px #0002;
  }
  #obsah #komunita .community-channels>a{padding:18px 15px}
}

/* Keep decorative page surfaces stable. The real network canvas continues normally. */
#obsah .article-card::after,
#obsah #komunita .community-channels>a::after{
  animation:none!important;
  transition:none!important;
  opacity:.16!important;
}
:is(#obsah,#network-theater) .hero-network{
  animation:none!important;
  transition:none!important;
  --network-angle:135deg;
}
:is(#obsah,#network-theater) .graph-atmosphere i{
  animation:none!important;
  transition:none!important;
  transform:none!important;
}
#obsah .hero h1 .mint{animation:none!important}